XAML'ye genel bakış

XAML (Genişletilebilir Uygulama biçimlendirme dili), WinUI uygulamalarında kullanıcı arabirimini tanımlamak için kullanılan bildirim temelli işaretleme dilidir. Kullanıcı arabirimi yapınızı ve özelliklerini .xaml dosyalarında tanımlar, mantığı ve olayları ise eşleştirilmiş bir code-behind dosyasında işlersiniz.

Uyarı

C# ve C++/WinRT hem WinUI 3 / Windows Uygulama SDK'sı hem de UWP uygulamaları için desteklenir. C++/CX yalnızca UWP için geçerlidir ve WinUI 3 için desteklenmez.

XAML nedir?

XAML, nesne oluşturmaya ve özelliklerini ayarlamaya yönelik XML tabanlı bir dildir. Kullanıcı arabirimi öğelerini—düğmeler, metin kutuları, düzenler—işaretleme dilinde tanımlar ve olaylara yanıt vermekle bu öğeleri çalışma zamanında değiştirmek için arkadaki kod dosyasını kullanırsınız.

XAML metin tabanlı bir veri alışverişi biçimi olduğundan, tasarımcılar ve geliştiriciler bağımsız olarak çalışabilir: tasarımcılar görsel yapıyı XAML'de oluşturur, geliştiriciler mantığı code-behind içinde bağlar ve her iki taraf da birbirini engellemeden yineleme yapabilir.

Temel XAML söz dizimi

Tüm geçerli XAML'ler de geçerli XML'dir, ancak XAML en üstüne kendi kavramlarını ekler. Örneğin, özellik öğesinin söz dizimi , bir özelliği öznitelik dizesi yerine iç içe XML öğesi olarak ayarlamanıza olanak tanır; geçerli XML, ancak XAML'de ek anlam içerir.

Tam söz dizimi ayrıntıları için XAML söz dizimi kılavuzuna bakın.

XAML ve Visual Studio

Visual Studio XAML düzenleyicisi IntelliSense, otomatik tamamlama ve görsel tasarım yüzeyi sağlar. Derlemeden önce hatalar satır içinde dalgalı çizgiler olarak görünür. Her söz dizimi kuralını ezberlemeniz gerekmez; IDE size yol göstersin.

XAML ad alanları

Her XAML dosyası, kök öğesinde ad alanlarını bildirir. Tipik bir WinUI sayfası iki ile başlar:

<Page
    x:Class="Application1.BlankPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
>
  • Varsayılan ad alanı (xmlns=): Tüm yerleşik WinUI denetimlerini, metin, grafikleri, veri bağlama ve stil türlerini içerir. XAML'nizin çoğu bu ad alanını ön ek olmadan kullanır.
  • XAML dili ad alanı (xmlns:x=): Ön ekine x: eşlenir, temel dil özellikleri sağlar.

İsim alanı x:

Özellik Purpose
x:Key Bir ResourceDictionary içindeki kaynağın benzersiz anahtarı
x:Class XAML dosyasını arkasındaki kod sınıfına bağlar
x:Name Arkadaki kodun öğeye başvurabilmesi için bir çalışma zamanı adı atar
x:Uid Yerelleştirilmiş kaynak değişimi için öğeleri işaretler
XAML iç türleri Basit değerleri (gibi x:Boolean) nesne öğeleri olarak ifade eder

Özel türleri eşleme

XAML'de kendi türlerinizi veya üçüncü taraf kitaplık türlerinizi kullanmak için kod ad alanına eşleyen bir ad alanı ön eki bildirin:

xmlns:myTypes="using:myCompany.myTypes"

Ardından bu türlere ön ekiyle başvurun:

<myTypes:CustomButton/>

C++/CX ile ilgili dikkat edilmesi gerekenler de dahil olmak üzere ayrıntılar için bkz. XAML ad alanları ve ad alanı eşlemesi.

Tasarımcı ve uyumluluk ad alanları

Araçların oluşturduğu XAML'de genellikle d: (tasarımcı) ve mc: (işaretleme uyumluluğu) ön eklerini görürsünüz. Bunlar tasarım zamanı araçlarını destekler ve çalışma zamanında güvenle yok sayılabilir. Ayrıntılar için bkz. Diğer XAML ad alanları.

Biçimlendirme Uzantıları

İşaretleme uzantıları, paylaşılan kaynağa başvuru veya veri bağlama gibi düz dize olarak ifade edilmeyecek bir özelliğe özellik ayarlamanıza olanak sağlar. Küme parantezi söz dizimini kullanırlar:

<Button Style="{StaticResource SearchButtonStyle}"/>

{StaticResource} olmadan, bir Style atamak için ayrıntılı özellik öğesi sözdizimini kullanmanız gerekirdi. İşaretleme uzantıları, XAML’ı özlü tutar.

Windows Çalışma Zamanı XAML şu işaretleme uzantılarını destekler:

Extension Purpose
{x:Bind} Derleme zamanı veri bağlama (en iyi performans)
{Bağlama} Çalışma zamanı veri bağlama
{StaticResource} Bir ResourceDictionary girdisine anahtarla başvurma
{ThemeResource} gibi {StaticResource}, ancak uygulama teması değiştiğinde güncelleştirilir
{TemplateBinding} Denetim şablonunun üst öğesinin özelliğine bağlama
{RelativeSource} Şablonlanmış üst öğeye göre bağlama
{CustomResource} Gelişmiş özel kaynak arama
{x:Null} Boş olabilen bir değeri açıkça null olarak ayarlayın

İşaretleme uzantıları iç içe yerleştirilebilir; en içteki önce değerlendirilir.

Events

Olayı öznitelik olarak ve işleyici yöntemi adını değeri olarak belirterek XAML'de olay işleyicilerini ekleyin:

<Button Click="showUpdatesButton_Click">Show updates</Button>

Derleyici, doğru temsilci imzasıyla arka planda kodda eşleşen bir yöntem bekler:

private void showUpdatesButton_Click(object sender, RoutedEventArgs e)
{
    // your code
}
void showUpdatesButton_Click(Windows::Foundation::IInspectable const&, Microsoft::UI::Xaml::RoutedEventArgs const&);

Uyarı

C++/CX'te her XAML sayfasında iki arka planda kod dosyası vardır: üst bilgi (.xaml.h) ve uygulama (.xaml.cpp).

Daha fazla bilgi için bkz . Olaylara ve yönlendirilen olaylara genel bakış.

Kaynak sözlükleri

Bir ResourceDictionary, x:Key ile tanımlanan yeniden kullanılabilir nesneleri — fırçalar, stiller, şablonlar — depolar. Kaynaklar bir sayfanın kaynaklar bölümünde veya ayrı .xaml bir dosyada bulunabilir. Tam açıklama için bkz. ResourceDictionary ve XAML kaynak başvuruları.

XAML ve XML

XAML, bilmeniz gereken birkaç şey içeren bir XML üst kümesidir:

  • Büyük/küçük harfe duyarlı: Öğe ve öznitelik adları tam olarak eşleşmelidir.
  • xml:lang: XAML'de geçerlidir, ancak ayrıştırma davranışıyla değil çerçeve düzeyinde çalışma zamanı davranışıyla eşlenir.
  • Kodlama: Yalnızca UTF-8 ve UTF-16 desteklenir.

XAML namescope'ları

ile x:Name atanan adların ad kapsamları içinde benzersiz olması gerekir. Ad kapsamları, özellikle denetim şablonlarında önemlidir; burada adlar sayfa yerine şablon içinde kapsamlanır. Ayrıntılar için bkz: XAML ad kapsamları.

Performans ipuçları

  • Sık kullanılan fırçaları, renk sabitlerini tekrarlamak yerine SolidColorBrush kaynakları olarak tanımlayın.
  • Sayfalar arasında paylaşılan kaynakları Application.Resources içinde bulundurun; sayfaya özgü kaynakları yalnızca ilgili sayfada tutun.
  • Göndermeden önce kullanılmayan kaynakları ({StaticResource} referansı olmayan anahtarlar) kaldırın.
  • Denetim şablonlarını geçersiz kılmaktan kaçının; varsayılanlar zaten yük performansı için iyileştirilmiştir.
  • Aynı pikseli birden fazla kez çizmek (overdraw) yerine Border ve düzen kapsayıcılarını kullanın.
  • ListView ve GridView için varsayılan öğe şablonlarını kullanın; Presenter mantıkları büyük listeler için optimize edilmiştir.

Daha fazla kılavuz için bkz . XAML işaretlemenizi iyileştirme.

XAML hatalarını ayıklama

Dosyalarda .xaml kesme noktaları ayarlayamazsınız, ancak Visual Studio başka yardım sağlar:

  • Tasarım zamanı: Siz yazarken dalgalı çizgiler ve hata işaretçileri satır içinde görünür.
  • Çalışma zamanı: Ayrıştırma hataları, XAML dosyasındaki satır numarası bağlamıyla XamlParseException (veya C++/CX'te benzer bir yapılandırılmış özel durum) fırlatır.

Çalışma zamanı hata işlemesi için bkz. C# dilinde WinUI uygulamaları için özel durum işleme. Hata ayıklama oturumu başlatmak için bkz. Hata ayıklama oturumu başlatma.