Liste/ayrıntılar kalıbı

Liste/ayrıntılar deseninde bir liste bölmesi (genellikle liste görünümüyle) ve içerik için ayrıntılar bölmesi vardır. Listedeki bir öğe seçildiğinde, ayrıntılar bölmesi güncelleştirilir. Bu düzen genellikle e-posta ve adres defterleri için kullanılır.

Önemli API'ler: ListView sınıfı, SplitView sınıfı

Bu doğru desen mi?

Listeler/ayrıntılar deseni aşağıdaki durumlarda çok iyi çalışır:

• Bir e-posta uygulaması, adres defteri veya liste ayrıntıları düzenini temel alan herhangi bir uygulama oluşturun.
• Büyük bir içerik koleksiyonunu bulun ve önceliklerini belirleyin.
• Bağlamlar arasında ileri geri çalışırken öğelerin listeden hızlı bir şekilde eklenmesine ve kaldırılmasına izin verin.

Doğru stili seçme

Liste/ayrıntılar desenini uygularken, kullanılabilir ekran alanı miktarına bağlı olarak yığılmış stili veya yan yana stili kullanmanızı öneririz.

Kullanılabilir pencere genişliği	Önerilen stil
320 epx-640 epx	Üst üste
641 epx veya daha geniş	Yan yana

Yığılmış stil

Katmanlı stilde, aynı anda yalnızca bir bölme görünür: liste veya ayrıntılar.

Kullanıcı liste bölmesinden başlar ve listeden bir öğe seçerek ayrıntılar bölmesine "detaya gider". Kullanıcıya göre, liste ve ayrıntı görünümleri iki ayrı sayfada var gibi görünür.

Yığılmış liste/ayrıntılar deseni oluşturma

Yığılmış liste/ayrıntılar desenini oluşturmanın bir yolu, liste bölmesi ve ayrıntılar bölmesi için ayrı sayfalar kullanmaktır. Liste görünümünü bir sayfaya, ayrıntılar bölmesini ise ayrı bir sayfaya yerleştirin.

Liste görünümü sayfasında liste görünümü denetimi, resim ve metin içerebilen listeleri sunmak için iyi sonuç verir.

Ayrıntılar görünümü sayfası için en mantıklı içerik öğesini kullanın. Çok fazla ayrı alanınız varsa, öğeleri bir formda düzenlemek için Kılavuz düzeni kullanmayı göz önünde bulundurun.

Sayfalar arasında gezinti için bkz. Windows uygulamaları için gezinti geçmişi ve geriye doğru gezinme.

Yan yana stil

Yan yana stilinde, liste bölmesi ve ayrıntılar bölmesi aynı anda görünür.

Liste bölmesindeki listede, seçili durumdaki öğeyi gösteren bir seçim görseli vardır. Listede yeni bir öğe seçildiğinde ayrıntılar bölmesi güncelleştirilir.

Karşılaştırmalı liste/ayrıntılar düzeni oluşturma

Yan yana liste/ayrıntı deseni oluşturmanın bir yolu bölünmüş görünüm denetimini kullanmaktır. Liste görünümünü bölünmüş görünüm bölmesine, ayrıntılar görünümünü ise bölünmüş görünüm içeriğine yerleştirin.

Liste bölmesi için liste görünümü denetimi, resim ve metin içerebilen listeleri sunmak için iyi sonuç verir.

Ayrıntılar içeriği için en mantıklı içerik öğesini kullanın. Çok fazla ayrı alanınız varsa, öğeleri bir formda düzenlemek için Kılavuz düzeni kullanmayı göz önünde bulundurun.

Uyarlamalı düzen

Herhangi bir ekran boyutu için liste/ayrıntı deseni uygulamak için uyarlamalı düzende duyarlı bir kullanıcı arabirimi oluşturun.

Uyarlamalı liste/ayrıntılar deseni oluşturma

Uyarlamalı düzen oluşturmak için kullanıcı arabiriminiz için farklı VisualState'ler tanımlayın ve AdaptiveTriggers ile farklı durumlar için kesme noktaları bildirin.

Örnek kodunu alma

Aşağıdaki örnekler uyarlamalı düzenlerle liste/ayrıntılar desenini uygular ve statik, veritabanı ve çevrimiçi kaynaklara veri bağlamayı gösterir:

• Ana/ayrıntı örneği
• ListView ve GridView örneği
• Müşteri siparişleri veritabanı örneği
• RSS Okuyucu örneği

İlgili makaleler

• Listeleri
• Uygulama ve komut çubukları
• ListView sınıfı
• SplitView sınıfı