2

MonoTouch アプリに非常に単純なダイアグラム機能を組み込むための仕様があります。今までやらなければならなかったことはすべてテーブルベースだったので、これは新しい領域です。

MindMeister や SimpleMind マインド マッピング アプリなど、アプリ ストアにはダイアグラムの例が数多くあります。

ユーザーがビューをクリックして、新しい形状を「配置」し、ラベルを付け、オプションで既存の形状に接続できるようにする必要があります。

この種のインタラクティブな機能を実現するには、どのようなアプローチがよいでしょうか? 私の最初の方法はUIImageView、カスタム イメージから作成されたイメージを配置し、タッチ イベントに応答して移動できるようにすることです。ただし、テキスト オーバーレイを追加する場合は、2 つのビュー (画像とテキストの両方) を管理する必要があるため、問題はさらに複雑になります。

どのようなアプローチに従うことができますか?

PS: これが SO にふさわしくない場合は、意のままにスマイトしてください!

更新: 基本的な図要素は、単純なラベルのオーバーライドを使用して実現できます。

UILabel lbl = new UILabel(new RectangleF(...));
lbl.Text = "Whatever";
lbl.Layer.BorderWidth = 3f;
lbl.Layer.BorderColor ( new CGColor (1f, 0f, 0f) );
this.Add (lbl);

gui 要素クラスを拡張し、TouchesBegan、TouchesMovedおよびTouchesEndイベントをオーバーライドすることで、ある程度の対話性を実現できます。

4

1 に答える 1

1

あなたがやりたいことは、それほど難しいことではありません。例の準備はできていませんが、開始するのに役立ついくつかの手順を示します。

  1. UIView を継承してカスタム ビューを作成します。これにより、形状とテキストが保持されます。
  2. それに 2 つのサブビューを追加します。形状とテキストの UILabel を保持する UIImageView。
  3. カスタム ビューの Draw メソッドをオーバーライドします。その中で、ビューの内容を画像コンテキストにコピーできます。
  4. そのコンテキストの画像を別のレイヤーに割り当てます。
  5. カスタム ビューのスーパービューに対するユーザーのタッチに応じて、そのレイヤーを移動します。

簡単な例:

public CALayer ContentsLayer { get; set; }
public override void Draw (RectangleF rect)
{
    base.Draw(rect);

    // Create an image context
    UIGraphics.BeginImageContext(this.Bounds.Size);

    // Render the contents of the view to the context
    this.Layer.RenderInContext(UIGraphics.GetCurrentContext());

    // Assign the contents to the layer
    this.ContentsLayer = new CALayer();
    this.ContentsLayer.Contents = UIGraphics.GetImageFromCurrentImageContext().CGImage;

    // End the context
    UIGraphics.EndImageContext();
}

この例は非常に単純であり、そのまま使用しないでください。たとえば、カスタム ビューのコンテンツを受け取るタイミングのロジックを提供する必要があります。このままにしておくと、Draw メソッドが呼び出されるたびに新しいコンテキストが作成されます。これは一度だけ行う必要があります。

コンテンツをレイヤーにコピーした後、それをスーパービューのレイヤーに追加してそのフレームを変更することにより、スーパービューを介してそのレイヤーを好きな場所に移動できます。スーパービュー用に別のカスタム ビューを作成する必要はありません。カスタム UIGestureRecognizer を作成し、独自の Touches* メソッドをオーバーライドしてスーパービューに追加するだけです。

このようにして、図形とテキストの両方を保持する 1 つのオブジェクト (レイヤー) を移動できます。

これが役立つことを願っています。

于 2011-06-04T08:27:06.270 に答える