Xamarin.iOS'ta kullanıcı arabirimi oluşturmak için JSON kullanma
MonoTouch.Dialog (MT. D) JSON verileri aracılığıyla dinamik kullanıcı arabirimi oluşturma desteği içerir. Bu öğreticide, bir uygulamaya dahil olan veya uzak url'den yüklenen JSON'dan kullanıcı arabirimi oluşturmak için JSONElement'in nasıl kullanılacağını inceleyeceğiz.
MT. D, JSON'da bildirilen kullanıcı arabirimleri oluşturmayı destekler. Öğeler JSON, MT kullanılarak bildirildiğinde. D, sizin için otomatik olarak ilişkili öğeleri oluşturur. JSON yerel bir dosyadan, ayrıştırılmış JsonObject örnekten, hatta uzak url'den yüklenebilir.
MT. D, JSON kullanılırken Öğeler API'sinde kullanılabilen tüm özellikleri destekler. Örneğin, aşağıdaki ekran görüntüsündeki uygulama tamamen JSON kullanılarak bildirilir:
JSON kullanarak görev ayrıntısı ekranının nasıl ekleneceğini gösteren Öğeler API'si İzlenecek Yol öğreticisinden örneği yeniden gözden geçirelim.
MT'nin ayarlanması. D
MT. D, Xamarin.iOS ile dağıtılır. Bunu kullanmak için Visual Studio 2017 veya Mac için Visual Studio bir Xamarin.iOS projesinin Başvurular düğümüne sağ tıklayın ve MonoTouch.Dialog-1 derlemesine başvuru ekleyin. Ardından, kaynak kodunuza gerektiği gibi deyimler ekleyin using MonoTouch.Dialog .
JSON kılavuzu
Bu izlenecek yol örneği, görevlerin oluşturulmasına izin verir. İlk ekranda bir görev seçildiğinde, gösterildiği gibi bir ayrıntı ekranı gösterilir:
JSON oluşturma
Bu örnekte, JSON dosyasını projedeki adlı task.jsonbir dosyadan yükleyeceğiz. MT. D, JSON'un Elements API'sini yansıtan bir söz dizimine uymasını bekler. Koddan Öğeler API'sini kullanırken olduğu gibi JSON kullanırken de bölümleri bildiririz ve bu bölümlerin içinde öğeleri ekleriz. JSON'da bölümleri ve öğeleri bildirmek için anahtarlar olarak sırasıyla "sections" ve "elements" dizelerini kullanırız. Her öğe için, ilişkili öğe türü anahtarı kullanılarak type ayarlanır. Diğer tüm öğeler özelliği, anahtar olarak özellik adıyla ayarlanır.
Örneğin, aşağıdaki JSON görev ayrıntıları için bölümleri ve öğeleri açıklar:
{
"title": "Task",
"sections": [
{
"elements" : [
{
"id" : "task-description",
"type": "entry",
"placeholder": "Enter task description"
},
{
"id" : "task-duedate",
"type": "date",
"caption": "Due Date",
"value": "00:00"
}
]
}
]
}
Yukarıdaki JSON dosyasında her öğe için bir kimlik bulunduğuna dikkat edin. Herhangi bir öğe, çalışma zamanında başvurmak için bir kimlik içerebilir. JSON'un koda nasıl yükleneceklerini gösterdiğimiz bir anda bunun nasıl kullanıldığını göreceğiz.
Kodda JSON yükleme
JSON tanımlandıktan sonra MT'ye yüklememiz gerekir. sınıfını JsonElement kullanarak D. Yukarıda oluşturduğumuz JSON içeren bir dosyanın projeye sample.json adıyla eklendiğini ve içerik derleme eylemi verildiğini varsayarsak, öğesini JsonElement yüklemek aşağıdaki kod satırını çağırmak kadar basittir:
var taskElement = JsonElement.FromFile ("task.json");
Her görev oluşturulduğunda bunu isteğe bağlı olarak eklediğimizden, önceki Öğeler API'si örneğinden tıklanan düğmeyi aşağıdaki gibi değiştirebiliriz:
_addButton.Clicked += (sender, e) => {
++n;
var task = new Task{Name = "task " + n, DueDate = DateTime.Now};
var taskElement = JsonElement.FromFile ("task.json");
_rootElement [0].Add (taskElement);
};
Çalışma zamanında öğelere erişme
Hatırlayacağınız gibi, bunları JSON dosyasında bildirdiğimizde her iki öğeye de bir kimlik ekledik. Koddaki özelliklerini değiştirmek üzere çalışma zamanında her öğeye erişmek için id özelliğini kullanabiliriz. Örneğin, aşağıdaki kod, görev nesnesinden değerleri ayarlamak için giriş ve tarih öğelerine başvurur:
_addButton.Clicked += (sender, e) => {
++n;
var task = new Task{Name = "task " + n, DueDate = DateTime.Now};
var taskElement = JsonElement.FromFile ("task.json");
taskElement.Caption = task.Name;
var description = taskElement ["task-description"] as EntryElement;
if (description != null) {
description.Caption = task.Name;
description.Value = task.Description;
}
var duedate = taskElement ["task-duedate"] as DateElement;
if (duedate != null) {
duedate.DateValue = task.DueDate;
}
_rootElement [0].Add (taskElement);
};
Url'den JSON yükleme
MT. D, yalnızca Url'yi oluşturucusundan geçirerek bir dış Url'den JSON'un dinamik olarak yüklenmesini JsonElementde destekler. MT. D, siz ekranlar arasında gezinirken isteğe bağlı olarak JSON'da bildirilen hiyerarşiyi genişletir. Örneğin, yerel web sunucusunun kökünde aşağıdaki gibi bir JSON dosyası düşünün:
{
"type": "root",
"title": "home",
"sections": [
{
"header": "Nested view!",
"elements": [
{
"type": "boolean",
"caption": "Just a boolean",
"id": "first-boolean",
"value": false
},
{
"type": "string",
"caption": "Welcome to the nested controller"
}
]
}
]
}
Bunu aşağıdaki kodda olduğu gibi kullanarak JsonElement yükleyebiliriz:
_rootElement = new RootElement ("Json Example") {
new Section ("") {
new JsonElement ("Load from url", "http://localhost/sample.json")
}
};
Çalışma zamanında, dosya MT tarafından alınır ve ayrıştırılır. Aşağıdaki ekran görüntüsünde gösterildiği gibi kullanıcı ikinci görünüme geçtiğinde D:
Özet
Bu makalede MT ile bir kullanarak arabirimin nasıl oluşturulacağı gösterildi. JSON'dan D. Uygulamayla birlikte bir dosyaya dahil edilen JSON'un yanı sıra uzak url'den nasıl yüklenecek gösterildi. Ayrıca çalışma zamanında JSON'da açıklanan öğelere nasıl erişecekleri de gösterildi.