Aracılığıyla paylaş


Aç-Kapa Anahtarları

İki durumlu düğme, kullanıcıların ışık düğmesi gibi öğeleri açmasını veya kapatmasını sağlayan fiziksel bir anahtarı temsil eder. Kullanıcılara iki adet birbirini dışlayan seçenek (örneğin, açık/kapalı) sunmak için iki durumlu düğme denetimlerini kullanın; burada bir seçeneğin seçilmesi anında sonuç verir.

Geçiş anahtarı denetimi oluşturmak için ToggleSwitch sınıfını kullanırsınız.

Doğru kontrol bu mu?

Kullanıcı geçiş anahtarını çevirdiğinde anında etkili olan ikili işlemler için geçiş anahtarı kullanın.

Geçiş anahtarı, açık

Anahtarı kapat

Geçiş anahtarını bir cihaz için fiziksel güç anahtarı olarak düşünün: Cihaz tarafından gerçekleştirilen eylemi etkinleştirmek veya devre dışı bırakmak istediğinizde açıp kapatabilirsiniz.

Geçiş anahtarının anlaşılmasını kolaylaştırmak için, düğmeyi denetlediği işlevselliği açıklayan bir veya iki sözcükle (tercihen isimlerle) etiketle. Örneğin, "WiFi" veya "Mutfak ışıkları."

Geçiş anahtarı ile onay kutusu arasında seçim yapma

Bazı eylemler için, iki durumlu bir düğme veya onay kutusu uygun olabilir. Hangi denetimin daha iyi çalışacağına karar vermek için şu ipuçlarını izleyin:

  • Kullanıcı bunları değiştirdikten hemen sonra değişiklikler etkili olduğunda ikili ayarlar için iki durumlu anahtar kullanın.

    geçiş düğmesi ve onay kutusu

    Bu örnekte, iki durumlu düğmeyle mutfak ışıklarının "Açık" olarak ayarlandığı açıktır. Ancak onay kutusuyla, kullanıcının ışıkların açık olup olmadığını veya ışıkları açmak için kutuyu işaretlemesi gerekip gerekmediğini düşünmesi gerekir.

  • İsteğe bağlı ("güzeldir") öğeleri için onay kutularını kullanın.

  • Değişikliklerin etkili olması için kullanıcının ek adımlar gerçekleştirmesi gerektiğinde onay kutusunu kullanın. Örneğin, kullanıcının değişiklikleri uygulamak için bir "gönder" veya "sonraki" düğmesine tıklaması gerekiyorsa, onay kutusunu kullanın.

  • Kullanıcı tek bir ayar veya özellikle ilgili birden çok öğe seçebiliyorsa onay kutularını kullanın.

Recommendations

  • Kullanabileceğiniz durumlarda varsayılan Açık ve Kapalı etiketlerini kullanın; yalnızca iki durumlu düğmenin anlamlı olması gerektiğinde bunları değiştirin. Bunları değiştirirseniz, aç-kapa düğmeyi daha doğru açıklayan tek bir sözcük kullanın. Genel olarak, "Açık" ve "Kapalı" sözcükleri bir geçiş anahtarına bağlı eylemi açıklamıyorsa, farklı bir denetime ihtiyacınız olabilir.
  • Zorunlu olmadıkça Açık ve Kapalı etiketlerini değiştirmekten kaçının; durum özel etiketleri çağırmadığı sürece varsayılan etiketlerle devam edin.

Geçiş anahtarı oluşturma

WinUI 3 Galeri uygulaması çoğu WinUI 3 denetimi, özelliği ve işlevselliğine ilişkin etkileşimli örnekler içerir. Uygulamayı Microsoft Store'dan alın veya GitHub'dan kaynak kodunu alın

İşte basit bir geçiş anahtarı nasıl yapılır. Bu XAML, daha önce gösterilen iki durumlu anahtarı oluşturur.

<ToggleSwitch x:Name="lightToggle" Header="Kitchen Lights"/>

Kodda aynı aç-kapa anahtarını şu şekilde oluşturabilirsiniz.

ToggleSwitch lightToggle = new ToggleSwitch();
lightToggle.Header = "Kitchen Lights";

// Add the toggle switch to a parent container in the visual tree.
stackPanel1.Children.Add(lightToggle);

Ison

Anahtar açık veya kapalı olabilir. Anahtarın durumunu belirlemek için IsOn özelliğini kullanın. Anahtar, başka bir ikili özelliğin durumunu denetlemek için kullanıldığında, burada gösterildiği gibi bir bağlama kullanabilirsiniz.

<StackPanel Orientation="Horizontal">
    <ToggleSwitch x:Name="ToggleSwitch1" IsOn="True"/>
    <ProgressRing IsActive="{x:Bind ToggleSwitch1.IsOn, Mode=OneWay}" 
                  Width="130"/>
</StackPanel>

Değiştirildi

Diğer durumlarda, Değiştirildi olayını, durumdaki değişikliklere yanıt vermek için işleyebilirsiniz.

Bu örnekte, XAML'de ve kodda Geçişli olay işleyicisi ekleme gösterilmektedir. Geçişli olay, ilerleme halkasını açmak veya kapatmak ve görünürlüğünü değiştirmek için işlenir.

<ToggleSwitch x:Name="toggleSwitch1" IsOn="True"
              Toggled="ToggleSwitch_Toggled"/>

Kodda aynı aç-kapa anahtarını şu şekilde oluşturabilirsiniz.

// Create a new toggle switch and add a Toggled event handler.
ToggleSwitch toggleSwitch1 = new ToggleSwitch();
toggleSwitch1.Toggled += ToggleSwitch_Toggled;

// Add the toggle switch to a parent container in the visual tree.
stackPanel1.Children.Add(toggleSwitch1);

Toggled olayının işleyicisi aşağıdadır.

private void ToggleSwitch_Toggled(object sender, RoutedEventArgs e)
{
    ToggleSwitch toggleSwitch = sender as ToggleSwitch;
    if (toggleSwitch != null)
    {
        if (toggleSwitch.IsOn == true)
        {
            progress1.IsActive = true;
            progress1.Visibility = Visibility.Visible;
        }
        else
        {
            progress1.IsActive = false;
            progress1.Visibility = Visibility.Collapsed;
        }
    }
}

Açık/Kapalı etiketleri

Varsayılan olarak, anahtar düğme, otomatik olarak yerelleştirilen Açık ve Kapalı etiketlerini tam olarak içerir. OnContent ve OffContent özelliklerini ayarlayarak bu etiketleri değiştirebilirsiniz.

Bu örnek, Açık/Kapalı etiketlerini Etiketleri Göster/Gizle ile değiştirir.

<ToggleSwitch x:Name="imageToggle" Header="Show images"
              OffContent="Show" OnContent="Hide"
              Toggled="ToggleSwitch_Toggled"/>

OnContentTemplate ve OffContentTemplate özelliklerini ayarlayarak daha karmaşık içerik de kullanabilirsiniz.

UWP ve WinUI 2

Önemli

Bu makaledeki bilgiler ve örnekler, Windows Uygulama SDK'sı ve WinUI 3kullanan uygulamalar için iyileştirilmiştir, ancak genellikle WinUI 2kullanan UWP uygulamaları için geçerlidir. Platforma özgü bilgiler ve örnekler için UWP API başvurusuna bakın.

Bu bölüm, denetimi bir UWP veya WinUI 2 uygulamasında kullanmak için ihtiyacınız olan bilgileri içerir.

Bu denetimin API'leri Windows.UI.Xaml.Controls ad alanında bulunur.

Tüm denetimler için en güncel stilleri ve şablonları almak için en son WinUI 2'yi kullanmanızı öneririz.