MonoTouch.Dialog Json Biçimlendirmesi

Makale
03/08/2024

Bu sayfada MonoTouch.Dialog'un JsonElement'i tarafından kabul edilen Json işaretlemesi açıklanmaktadır

Bir örnekle başlayalım. Aşağıda, JsonElement'e geçirilebilen eksiksiz bir Json dosyası verilmiştir.

{     
    "title": "Json Sample",
    "sections": [ 
        {
            "header": "Booleans",
            "footer": "Slider or image-based",
            "id": "first-section",
            "elements": [
                { 
                    "type": "boolean",
                    "caption": "Demo of a Boolean",
                    "value": true
                }, {
                    "type": "boolean",
                    "caption": "Boolean using images",
                    "value": false,
                    "on": "favorite.png",
                    "off": "~/favorited.png"
                }, {
                    "type": "root",
                    "title": "Tap for nested controller",
                    "sections": [
                        {
                            "header": "Nested view!",
                            "elements": [
                                {
                                    "type": "boolean",
                                    "caption": "Just a boolean",
                                    "id": "the-boolean",
                                    "value": false
                                }, {
                                    "type": "string",
                                    "caption": "Welcome to the nested controller"
                                }
                            ]
                        }
                    ]
                }
            ]
        }, {
            "header": "Entries",
            "elements" : [
                {
                    "type": "entry",
                    "caption": "Username",
                    "value": "",
                    "placeholder": "Your account username"
                }
            ]
        }
    ]
}

Yukarıdaki işaretleme aşağıdaki kullanıcı arabirimini oluşturur:

Ağaçtaki her öğe özelliğini "id"içerebilir. Çalışma zamanında JsonElement dizin oluşturucu kullanarak tek tek bölümlere veya öğelere başvurmak mümkündür. Böyle:

var jsonElement = JsonElement.FromFile ("demo.json");

var firstSection = jsonElement ["first-section"] as Section;

var theBoolean = jsonElement ["the-boolean"] as BooleanElement;

Kök Öğe Söz Dizimi

Root öğesi aşağıdaki değerleri içerir:

title
sections (isteğe bağlı)

Kök öğesi, iç içe denetleyici oluşturmak için bir bölümün içinde öğe olarak görünebilir. Bu durumda, ek özellik "type" olarak ayarlanmalıdır "root"

url

"url" Özellik ayarlanırsa, kullanıcı bu RootElement'e dokunursa, kod belirtilen URL'den bir dosya isteğinde bulunur ve içeriği yeni bilgilerin görüntülenmesini sağlar. Kullanıcı arabirimini kullanıcının dokunduğu şeye göre sunucudan genişletmek için bunu kullanabilirsiniz.

group

Ayarlanırsa, kök öğenin grup adını ayarlar. Grup adları, öğesindeki iç içe öğelerden birinden kök öğenin değeri olarak görüntülenen bir özet seçmek için kullanılır. Bu, onay kutusunun değeri veya radyo düğmesinin değeridir.

radyo seçimi

İç içe öğelerde seçilen radyo öğesini tanımlar

Başlık

Varsa, RootElement için kullanılan başlık olacaktır

Tür

Bu, bir bölümde göründüğünde olarak ayarlanmalıdır "root" (bu, denetleyicileri iç içe yerleştirmede kullanılır).

sections

Bu, tek tek bölümleri olan bir Json dizisidir

Bölüm Söz Dizimi

bölümü şunları içerir:

header (isteğe bağlı)
footer (isteğe bağlı)
elements Dizi

Varsa, üst bilgi metni bölümün başlık olarak görüntülenir.

Varsa, alt bilgi bölümün en altında görüntülenir.

öğeler

Bu bir öğe dizisidir. Her öğe, "type" oluşturulacak öğe türünü tanımlamak için kullanılan anahtar olan en az bir anahtar içermelidir. Bazı öğeler ve "value"gibi "caption" bazı ortak özellikleri paylaşır. Desteklenen öğelerin listesi şunlardır:

string öğeleri (stil oluşturma ile ve stil olmadan)
entry satırlar (normal veya parola)
boolean değerler (anahtarları veya görüntüleri kullanarak)

Dize öğeleri, kullanıcı hücreye veya aksesuara dokunduğunda çağrılacak bir yöntem sağlayarak düğme olarak kullanılabilir,

İşleme Öğeleri

İşleme öğeleri C# StringElement ve StyledStringElement'i temel alır ve bilgileri çeşitli şekillerde işleyebilir ve bunları çeşitli şekillerde işlemek mümkündür. En basit öğeler şu şekilde oluşturulabilir:

{
    "type": "string",
    "caption": "Json Serializer"
}

Bu, tüm varsayılan değerleri içeren basit bir dize gösterir: yazı tipi, arka plan, metin rengi ve süslemeler. Bu öğelere eylem bağlamak ve özelliği veya özellikleri ayarlayarak "ontap" düğmeler gibi davranmalarını "onaccessorytap" sağlamak mümkündür:

{
    "type": "string",
    "caption": "View Photos",
    "ontap": "Acme.PhotoLibrary.ShowPhotos"
}

Yukarıdaki, "Acme.PhotoLibrary" sınıfında "ShowPhotos" yöntemini çağırır. "onaccessorytap" benzerdir, ancak yalnızca kullanıcı hücreye dokunmak yerine aksesuara dokunduğunda çağrılır. Bunu etkinleştirmek için aksesuarı da ayarlamanız gerekir:

{
    "type": "string",
    "caption": "View Photos",
    "ontap": "Acme.PhotoLibrary.ShowPhotos",
    "accessory": "detail-disclosure",
    "onaccessorytap": "Acme.PhotoLibrary.ShowStats"
}

İşleme öğeleri aynı anda iki dize görüntüleyebilir; biri başlık, diğeri de değerdir. Bu dizelerin nasıl işlendiği stile bağlıdır, özelliğini kullanarak "style" bunu ayarlayabilirsiniz. Varsayılan değer soldaki başlık ve sağda değeri gösterir. Daha fazla ayrıntı için stil bölümüne bakın. Renkler '#' simgesi kullanılarak kodlanır ve ardından kırmızı, yeşil, mavi ve belki de alfa değerlerini temsil eden onaltılık sayılar kullanılır. İçerikler, RGB veya RGBA değerlerini temsil eden kısa biçimde (3 veya 4 onaltılık basamak) kodlanabilir. Veya RGB veya RGBA değerlerini temsil eden uzun form (6 veya 8 basamak). Kısa sürüm, aynı onaltılık rakamı iki kez yazmanın kısaltmasıdır. Bu nedenle "#1bc" sabiti red=0x11, green=0xbb ve blue=0xcc olarak tanıtılır. Alfa değeri yoksa, renk opak olur. Bazı örnekler:

"background": "#f00"
"background": "#fa08f880"

Aksesuar

İşleme öğenizde gösterilecek aksesuar türünü belirler, olası değerler şunlardır:

checkmark
detail-disclosure
disclosure-indicator

Değer yoksa aksesuar gösterilmez

arka plan

background özelliği hücrenin arka plan rengini ayarlar. Değer bir görüntünün URL'sidir (bu durumda, zaman uyumsuz görüntü indiricisi çağrılır ve resim indirildikten sonra arka plan güncelleştirilir) veya renk söz dizimi kullanılarak belirtilen bir renk olabilir.

başlık

İşleme öğesinde gösterilecek ana dize. Yazı tipi ve renk, ve "font" özellikleri ayarlanarak "textcolor" özelleştirilebilir. İşleme stili özelliği tarafından "style" belirlenir.

renk ve ayrıntı rengi

Ana metin veya ayrıntılı metin için kullanılacak renk.

detailfont ve yazı tipi

başlık veya ayrıntı metni için kullanılacak yazı tipi. Yazı tipi belirtiminin biçimi, isteğe bağlı olarak bir tire ve nokta boyutuyla birlikte yazı tipi adıdır. Geçerli yazı tipi belirtimleri şunlardır:

"Helvetica"
"Helvetica-14"

Linebreak

Çizgilerin nasıl bölüneceğini belirler. Olası değerler:

character-wrap
clip
head-truncation
middle-truncation
tail-truncation
word-wrap

hem hem word-wrap de character-wrap özelliği sıfır olarak ayarlanıp işleme öğesini çok satırlı bir öğeye dönüştürmek için birlikte kullanılabilir"lines".

ontap ve onaccessorytap

Bu özellikler, uygulamanızda bir nesneyi parametre olarak alan statik bir yöntem adına işaret etmelidir. JsonDialog.FromFile veya JsonDialog.FromJson yöntemlerini kullanarak hiyerarşinizi oluşturduğunuzda isteğe bağlı bir nesne değeri geçirebilirsiniz. Bu nesne değeri daha sonra yöntemlerinize geçirilir. Statik yönteminize bağlam geçirmek için bunu kullanabilirsiniz. Örneğin:

class Foo {
    Foo ()
    {
        root = JsonDialog.FromJson (myJson, this);
    }

    static void Callback (object obj)
    {
        Foo myFoo = (Foo) obj;
        obj.Callback ();
    }
}

satırlar

Bu sıfır olarak ayarlanırsa, içindeki dizelerin içeriğine bağlı olarak öğesini otomatik olarak boyutlandıracaktır. Bunun çalışması için özelliğini veya "word-wrap"olarak "character-wrap" da ayarlamanız "linebreak" gerekir.

stili

Stil, içeriği işlemek için kullanılacak hücre stilini belirler ve UITableViewCellStyle numaralandırma değerlerine karşılık gelir. Olası değerler:

"default"
"value1"
"value2"
"subtitle" : alt başlığı olan metin.

Altyazı

Alt başlık için kullanılacak değer. Bu, stilin "subtitle" ayarlanacağı ve özelliğinin dize olarak "value" ayarlanacağı bir kısayoldur. Bu, her ikisini de tek bir girişle yapar.

Textcolor

Metin için kullanılacak renk.

değer

İşleme öğesinde gösterilecek ikincil değer. Bunun düzeni ayardan "style" etkilenir. yazı tipi ve rengi ve "detailcolor"ayarıyla "detailfont" özelleştirilebilir.

Boole Öğeleri

Boole öğeleri türünü "bool"olarak ayarlamalıdır; görüntülenecek öğe "caption" içerebilir ve "value" değeri true veya false olarak ayarlanır. "on" ve "off" özellikleri ayarlanırsa, bunların görüntü olduğu varsayılır. Görüntüler, uygulamadaki geçerli çalışma dizinine göre çözümlenir. Paket göreli dosyalarına başvurmak istiyorsanız, uygulama paketi dizinini "~" temsil etmek için kısayol olarak kullanabilirsiniz. Örneğin "~/favorite.png" , paket dosyasında yer alan favorite.png olacaktır. Örneğin:

{ 
    "type": "boolean",
    "caption": "Demo of a Boolean",
    "value": true
},

{
    "type": "boolean",
    "caption": "Boolean using images",
    "value": false,
    "on": "favorite.png",
    "off": "~/favorited.png"
}

Tür

Tür veya "checkbox"olarak "boolean" ayarlanabilir. Boole olarak ayarlanırsa UISlider veya görüntüler (her ikisi "on" de "off" ayarlandıysa) kullanır. Onay kutusu olarak ayarlanırsa, onay kutusu kullanılır. "group" özelliği, bir boole öğesini belirli bir gruba ait olarak etiketlemek için kullanılabilir. Bu, aynı gruba ait tüm booleanların (veya onay kutularının) sayısıyla sonuçları özetleyeceği için, kök içeren kökün de bir "group" özelliği varsa kullanışlıdır.

Giriş Öğeleri

Kullanıcının veri girmesine izin vermek için giriş öğelerini kullanırsınız. Giriş öğelerinin türü veya "password"şeklindedir"entry". "caption" özelliği sağda gösterilecek metne ayarlanır ve "value" girişin ayarlanacağı ilk değere ayarlanır. "placeholder", kullanıcıya boş girişler için bir ipucu göstermek için kullanılır (gri gösterilir). Burada bazı örnekler verilmiştir:

{
    "type": "entry",
    "caption": "Username",
    "value": "",
    "placeholder": "Your account username"
}, {
    "type": "password",
    "caption": "Password",
    "value": "",
    "placeholder": "You password"
}, {
    "type": "entry",
    "caption": "Zip Code",
    "value": "01010",
    "placeholder": "your zip code",
    "keyboard": "numbers"
}, {
    "type": "entry",
    "return-key": "route",
    "caption": "Entry with 'route'",
    "placeholder": "captialization all + no corrections",
    "capitalization": "all",
    "autocorrect": "no"
}

otomatik düzelt

Giriş için kullanılacak otomatik düzeltme stilini belirler. Olası değerler true veya false (veya dizeleri "yes" ve "no") olabilir.

Büyük harf

Giriş için kullanılacak büyük harfe çevirme stili. Olası değerler:

all
none
sentences
words

başlık

Giriş için kullanılacak başlık

klavye

Veri girişi için kullanılacak klavye türü. Olası değerler:

ascii
decimal
default
email
name
numbers
numbers-and-punctuation
twitter
url

Yer tutucu

Girdi boş bir değere sahip olduğunda gösterilen ipucu metni.

return-key

Dönüş anahtarı için kullanılan etiket. Olası değerler:

default
done
emergencycall
go
google
join
next
route
search
send
yahoo

değer

Girdinin başlangıç değeri

Radyo Öğeleri

Radyo öğelerinin türü "radio"vardır. Seçilen öğe, kök öğesini içeren özelliği tarafından radioselected seçilir. Ayrıca, özellik için "group" bir değer ayarlanırsa, bu radyo düğmesi bu gruba aittir.

Tarih ve Saat Öğeleri

öğesi türleri "datetime""date" ve "time" tarihlerini saat, tarih veya saatlerle işlemek için kullanılır. Bu öğeler parametre olarak bir başlık ve bir değer alır. Değer, .NET DateTime.Parse işlevi tarafından desteklenen herhangi bir biçimde yazılabilir. Örnek:

"header": "Dates and Times",
"elements": [
    {
        "type": "datetime",
        "caption": "Date and Time",
        "value": "Sat, 01 Nov 2008 19:35:00 GMT"
    }, {
        "type": "date",
        "caption": "Date",
        "value": "10/10"
    }, {
        "type": "time",
        "caption": "Time",
        "value": "11:23"
    }                       
]

Html/Web Öğesi

Dokunulduğunda, türü kullanarak "html" yerel veya uzak belirtilen URL'nin içeriğini işleyen bir UIWebView ekleyecek bir hücre oluşturabilirsiniz. Bu öğenin yalnızca iki özelliği şunlardır"caption":"url"

{
    "type": "html",
    "caption": "Miguel's blog",
    "url": "https://tirania.org/blog" 
}

Aracılığıyla paylaş

MonoTouch.Dialog Json Biçimlendirmesi

Kök Öğe Söz Dizimi

url

group

radyo seçimi

Başlık

Tür

sections

Bölüm Söz Dizimi

üst bilgi

alt bilgi

öğeler

İşleme Öğeleri

Aksesuar

arka plan

başlık

renk ve ayrıntı rengi

detailfont ve yazı tipi

Linebreak

ontap ve onaccessorytap

satırlar

stili

Altyazı

Textcolor

değer

Boole Öğeleri

Tür

Giriş Öğeleri

otomatik düzelt

Büyük harf

başlık

klavye

Yer tutucu

return-key

değer

Radyo Öğeleri

Tarih ve Saat Öğeleri

Html/Web Öğesi

Ek kaynaklar