Erstellen einer Xamarin.iOS-Anwendung mithilfe der Elements-API
Dieser Artikel baut auf den Informationen auf, die im Artikel Einführung in monoTouch Dialog vorgestellt werden. Es wird eine exemplarische Vorgehensweise gezeigt, die zeigt, wie MonoTouch.Dialog (MT. D) Elements-API, um schnell mit dem Erstellen einer Anwendung mit MT.D zu beginnen.
In dieser exemplarischen Vorgehensweise verwenden wir das MT. D Elements-API zum Erstellen eines master-Detailstils einer Anwendung, die eine Aufgabenliste anzeigt. Wenn der Benutzer die + Schaltfläche in der Navigationsleiste auswählt, wird der Tabelle für die Aufgabe eine neue Zeile hinzugefügt. Wenn Sie die Zeile auswählen, navigieren Sie zum Detailbildschirm, auf dem wir die Aufgabenbeschreibung und das Fälligkeitsdatum aktualisieren können, wie unten dargestellt:
Einrichten von MT. D
MT. D wird mit Xamarin.iOS verteilt. Klicken Sie dazu mit der rechten Maustaste auf den Knoten Verweise eines Xamarin.iOS-Projekts in Visual Studio 2017 oder Visual Studio für Mac, und fügen Sie einen Verweis auf die MonoTouch.Dialog-1-Assembly hinzu. Fügen Sie dann nach Bedarf Anweisungen im Quellcode hinzu using MonoTouch.Dialog
.
Exemplarische Vorgehensweise für die Element-API
Im Artikel Einführung in monoTouch Dialog haben wir ein solides Verständnis der verschiedenen Teile von MT.D. Wir verwenden die Elemente-API, um sie alle in einer Anwendung zusammenzufügen.
Einrichten der Multi-Screen-Anwendung
Um den Bildschirmerstellungsprozess zu starten, erstellt MonoTouch.Dialog einen DialogViewController
und fügt dann ein hinzu RootElement
.
Um eine Multi-Screen-Anwendung mit MonoTouch.Dialog zu erstellen, müssen wir:
- Erstellen der Datei
UINavigationController.
- Erstellen der Datei
DialogViewController.
- Fügen Sie den
DialogViewController
als Stamm von hinzu.UINavigationController.
- Hinzufügen einer
RootElement
zumDialogViewController.
- Hinzufügen
Sections
von undElements
zumRootElement.
Verwenden eines UINavigationControllers
Um eine Anwendung im Navigationsstil zu erstellen, müssen sie erstellt UINavigationController
und dann als RootViewController
in der FinishedLaunching
-Methode von hinzugefügt werden AppDelegate
. Um die UINavigationController
Arbeit mit MonoTouch.Dialog zu ermöglichen, fügen wir der UINavigationController
wie unten gezeigt ein hinzuDialogViewController
:
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;
}
Mit dem obigen Code wird eine instance erstellt RootElement
und an die DialogViewController
übergeben. Der DialogViewController
hat immer oben in seiner Hierarchie ein RootElement
. In diesem Beispiel wird mit RootElement
der Zeichenfolge "To Do List" erstellt, die als Titel in der Navigationsleiste des Navigationscontrollers dient. An diesem Punkt wird beim Ausführen der Anwendung der folgende Bildschirm angezeigt:
Sehen wir uns an, wie Sie die hierarchische Struktur von Sections
MonoTouch.Dialog verwenden und Elements
weitere Bildschirme hinzufügen.
Erstellen der Dialogbildschirme
Eine DialogViewController
ist eine UITableViewController
Unterklasse, die MonoTouch.Dialog verwendet, um Bildschirme hinzuzufügen. MonoTouch.Dialog erstellt Bildschirme, indem einer RootElement
DialogViewController
hinzugefügt wird, wie oben gezeigt. Der RootElement
kann Instanzen haben Section
, die die Abschnitte einer Tabelle darstellen.
Die Abschnitte bestehen aus Elementen, anderen Abschnitten oder sogar anderen RootElements
. Durch das Verschachteln RootElements
erstellt MonoTouch.Dialog automatisch eine Anwendung im Navigationsstil, wie wir als Nächstes sehen werden.
Verwenden von DialogViewController
Die DialogViewController
- als UITableViewController
Unterklasse - weist eine UITableView
als Ansicht auf. In diesem Beispiel möchten wir der Tabelle bei jedem Tippen auf die + Schaltfläche Elemente hinzufügen. Da zu DialogViewController
einem UINavigationController
hinzugefügt wurde, können wir die NavigationItem
-Eigenschaft "s RightBarButton
" verwenden, um die + Schaltfläche hinzuzufügen, wie unten gezeigt:
_addButton = new UIBarButtonItem (UIBarButtonSystemItem.Add);
_rootVC.NavigationItem.RightBarButtonItem = _addButton;
Als wir das RootElement
zuvor erstellt haben, haben wir eine einzelne Section
instance übergeben, sodass wir Elemente hinzufügen können, wenn der Benutzer auf die + Schaltfläche tippt. Wir können den folgenden Code verwenden, um dies im Ereignishandler für die Schaltfläche zu erreichen:
_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);
};
Dieser Code erstellt jedes Mal, wenn auf die Schaltfläche getippt wird, ein neues Task
Objekt. Im Folgenden wird die einfache Implementierung der Task
-Klasse veranschaulicht:
public class Task
{
public Task ()
{
}
public string Name { get; set; }
public string Description { get; set; }
public DateTime DueDate { get; set; }
}
Die -Eigenschaft des Vorgangs Name
wird verwendet, um die RootElement
Untertitel zusammen mit einer Zählervariable namens n
zu erstellen, die für jeden neuen Vorgang inkrementiert wird. MonoTouch.Dialog wandelt die Elemente in die Zeilen um, die dem TableView
hinzugefügt werden, wenn jedes taskElement
hinzugefügt wird.
Präsentation und Verwaltung von Dialogbildschirmen
Wir haben eine RootElement
verwendet, damit MonoTouch.Dialog automatisch einen neuen Bildschirm für die Details jeder Aufgabe erstellt und zu diesem navigiert, wenn eine Zeile ausgewählt wird.
Der Aufgabendetailseite selbst besteht aus zwei Abschnitten; Jeder dieser Abschnitte enthält ein einzelnes Element. Das erste Element wird aus einem EntryElement
erstellt, um eine bearbeitbare Zeile für die Eigenschaft des Vorgangs Description
bereitzustellen. Wenn das Element ausgewählt ist, wird eine Tastatur für die Textbearbeitung angezeigt, wie unten gezeigt:
Der zweite Abschnitt enthält eine DateElement
, mit der wir die Eigenschaft der DueDate
Aufgabe verwalten können. Wenn Sie das Datum auswählen, wird automatisch eine Datumsauswahl wie gezeigt geladen:
In beiden EntryElement
Fällen und DateElement
(oder für alle Dateneingabeelemente in MonoTouch.Dialog) werden alle Änderungen an den Werten automatisch beibehalten. Wir können dies veranschaulichen, indem wir das Datum bearbeiten und dann zwischen dem Stammbildschirm und verschiedenen Aufgabendetails hin und her navigieren, wobei die Werte in den Detailbildschirmen beibehalten werden.
Zusammenfassung
In diesem Artikel wurde eine exemplarische Vorgehensweise vorgestellt, die die Verwendung der MonoTouch.Dialog Elements-API veranschaulicht. Es wurden die grundlegenden Schritte zum Erstellen einer Anwendung mit mehreren Bildschirmen mit MT behandelt. D, einschließlich der Verwendung von und DialogViewController
dem Hinzufügen von Elementen und Abschnitten zum Erstellen von Bildschirmen. Darüber hinaus wurde gezeigt, wie MT verwendet wird. D in Verbindung mit einem UINavigationController
.