使用元素 API 创建 Xamarin.iOS 应用程序

2015-11-25

本文基于“MonoTouch 对话框简介”一文中提供的信息。其中提供了一个演练，演示如何使用 MonoTouch.Dialog (MT.D) 元素 API 快速开始使用 MT.D 生成应用程序。

在本演练中，我们将使用 MT.D 元素 API 创建一个显示任务列表的主从样式应用程序。当用户选择导航栏中的 + 按钮时，将向任务表中添加一个新行。选择该行会导航到详细信息屏幕，我们可以在其中更新任务说明和截止日期，如下所示：

设置 MT.D

MT.D 与 Xamarin.iOS 一起分发。若要使用它，请右键单击 Visual Studio 2017 或 Visual Studio for Mac 中 Xamarin.iOS 项目的“引用”节点，然后添加对“MonoTouch.Dialog-1”程序集的引用。然后，根据需要在源代码中添加 using MonoTouch.Dialog 语句。

元素 API 演练

在 MonoTouch 对话框简介一文中，我们对 MT.D 的不同部分有了深入的了解。让我们使用元素 API 将其全部放入一个应用程序中。

设置多屏应用程序

为了开始执行屏幕创建过程，MonoTouch.Dialog 将创建一个 DialogViewController，然后添加一个 RootElement。

若要使用 MonoTouch.Dialog 创建多屏应用程序，我们需要：

创建 UINavigationController.
创建 DialogViewController.
添加 DialogViewController 作为 UINavigationController. 的根
将 RootElement 添加到 DialogViewController.
将 Sections 和 Elements 添加到 RootElement.

使用 UINavigationController

若要创建导航样式的应用程序，我们需要创建一个 UINavigationController，然后将其添加为 AppDelegate 的 FinishedLaunching 方法中的 RootViewController。为使 UINavigationController 能够与 MonoTouch.Dialog 配合使用，我们将 DialogViewController 添加到 UINavigationController，如下所示：

public override bool FinishedLaunching (UIApplication app, NSDictionary options)
{
    _window = new UIWindow (UIScreen.MainScreen.Bounds);
            
    _rootElement = new RootElement ("To Do List"){new Section ()};

    // code to create screens with MT.D will go here …

    _rootVC = new DialogViewController (_rootElement);
    _nav = new UINavigationController (_rootVC);
    _window.RootViewController = _nav;
    _window.MakeKeyAndVisible ();
            
    return true;
}

上面的代码创建 RootElement 的实例并将其传递给 DialogViewController。 DialogViewController 的层次结构顶部始终有一个 RootElement。在此示例中，RootElement 是使用字符串“To Do List”创建的，该字符串用作导航控制器导航栏中的标题。此时，运行应用程序会显示如下所示的屏幕：

让我们了解如何使用 MonoTouch.Dialog 的 Sections 和 Elements 层次结构来添加更多屏幕。

创建对话框屏幕

DialogViewController 是 MonoTouch.Dialog 用来添加屏幕的 UITableViewController 子类。 MonoTouch.Dialog 通过将 RootElement 添加到 DialogViewController 来创建屏幕，如前所示。 RootElement 可以包含代表表的各个部分的 Section 实例。这些部分由元素、其他部分甚至其他 RootElements 组成。通过嵌套 RootElements，MonoTouch.Dialog 可以自动创建一个导航样式的应用程序，如下所示。

使用 DialogViewController

DialogViewController 是一个 UITableViewController 子类，它采用 UITableView 作为视图。在此示例中，我们希望每次单击 + 按钮时都将项添加到表中。由于 DialogViewController 已添加到 UINavigationController，因此我们可以使用 NavigationItem 的 RightBarButton 属性添加 + 按钮，如下所示：

_addButton = new UIBarButtonItem (UIBarButtonSystemItem.Add);
_rootVC.NavigationItem.RightBarButtonItem = _addButton;

当我们先前创建 RootElement 时，我们向它传递了一个 Section 实例，以便可以在用户点击 + 按钮时添加元素。可以使用以下代码在该按钮的事件处理程序中实现此目的：

_addButton.Clicked += (sender, e) => {                
    ++n;
                
    var task = new Task{Name = "task " + n, DueDate = DateTime.Now};
                
    var taskElement = new RootElement (task.Name) {
        new Section () {
            new EntryElement (task.Name, "Enter task description", task.Description)
        },
        new Section () {
            new DateElement ("Due Date", task.DueDate)
        }
    };
    _rootElement [0].Add (taskElement);
};

每次点击该按钮时，此代码都会创建新的 Task 对象。下面显示了 Task 类的简单实现：

public class Task
{   
    public Task ()
    {
    }
      
    public string Name { get; set; }
        
    public string Description { get; set; }

    public DateTime DueDate { get; set; }
}

任务的 Name 属性用于创建 RootElement 的标题以及名为 n 的计数器变量，该变量针对每个新任务递增。 MonoTouch.Dialog 将元素转换为在添加每个 taskElement 时添加到 TableView 的行。

呈现和管理对话框屏幕

我们使用了 RootElement，以便 MonoTouch.Dialog 会自动为每个任务的详细信息创建新屏幕，并在选择一行时导航到该屏幕。

任务详细信息屏幕本身由两部分组成；每个部分包含一个元素。第一个元素是基于 EntryElement 创建的，为任务的 Description 属性提供可编辑行。选择该元素时，会呈现用于文本编辑的键盘，如下所示：

第二个部分包含一个 DateElement，可让我们管理任务的 DueDate 属性。选择日期会自动加载日期选取器，如下所示：

在使用 EntryElement 和 DateElement 的情况下（或对于 MonoTouch.Dialog 中的任何数据输入元素），对值进行的任何更改都会自动保留。我们可以通过编辑日期，然后在根屏幕和各种任务详细信息之间来回导航（其中保留了详细信息屏幕中的值），来演示这一点。

总结

本文提供了有关如何使用 MonoTouch.Dialog 元素 API 的演练。其中介绍了使用 MT.D 创建多屏应用程序的基本步骤，包括如何使用 DialogViewController 以及如何添加元素和部分来创建屏幕。此外，它还演示了如何将 MT.D 与 UINavigationController 配合使用。

通过