Простое приложение для создания диаграмм iPhone в MonoTouch

У меня есть спецификация для создания очень простой возможности построения диаграмм в приложении MonoTouch. Все, что мне приходилось делать до сих пор, было основано на таблице, так что это новая территория.

Многочисленные примеры построения диаграмм можно найти в магазине приложений, например приложения MindMeister и SimpleMind.

Мне нужно, чтобы пользователи могли щелкнуть представление, чтобы «отложить» новую форму, пометить ее и, при необходимости, соединить ее с существующей формой.

Что было бы хорошим подходом для достижения такой интерактивной функциональности? Сначала я бы поставил UIImageView, созданный из пользовательского изображения, а затем убедился, что он может реагировать на события касания, чтобы перемещать его. Однако, когда вы хотите добавить наложение текста, все становится сложнее, поскольку вам придется управлять двумя представлениями (и изображением, и текстом).

Какому подходу я мог бы следовать?

PS: Смей по желанию, если это неуместно для ТАК!

Обновление: основные элементы диаграммы можно получить с помощью простого переопределения метки:

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

Некоторой интерактивности можно добиться, расширив класс элементов графического интерфейса и переопределив события TouchesBegan, TouchesMoved и TouchesEnd.


person Ryan    schedule 03.06.2011    source источник


Ответы (1)


То, что вы хотите сделать, не так сложно. У меня нет готового примера, но я дам вам несколько шагов, которые могут помочь вам начать работу.

  1. Создайте собственное представление, наследующее UIView. Это сохранит вашу форму и текст.
  2. Добавьте в него два подвида. UIImageView, который будет содержать вашу форму и UILabel для текста.
  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* и добавить его в суперпредставление.

Таким образом, у вас есть один объект для перемещения (слой), который содержит как вашу форму, так и ваш текст.

Надеюсь, это поможет.

person Dimitris Tavlikos    schedule 04.06.2011