Udostępnij przez

Style urządzeń w programie Xamarin.Forms

Xamarin.Forms zawiera sześć stylów dynamicznych, znanych jako style urządzeń, w klasie Device.Styles.

Style urządzeń to:

Wszystkie sześć stylów można stosować tylko do Label wystąpień. Na przykład element Label wyświetlający treść akapitu może ustawić jego Style właściwość na BodyStyle.

W poniższym przykładzie kodu pokazano użycie stylów urządzenia na stronie XAML:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.DeviceStylesPage" Title="Device" IconImageSource="xaml.png">
    <ContentPage.Resources>
        <ResourceDictionary>
            <Style x:Key="myBodyStyle" TargetType="Label"
              BaseResourceKey="BodyStyle">
                <Setter Property="TextColor" Value="Accent" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <Label Text="Title style"
              Style="{DynamicResource TitleStyle}" />
            <Label Text="Subtitle text style"
              Style="{DynamicResource SubtitleStyle}" />
            <Label Text="Body style"
              Style="{DynamicResource BodyStyle}" />
            <Label Text="Caption style"
              Style="{DynamicResource CaptionStyle}" />
            <Label Text="List item detail text style"
              Style="{DynamicResource ListItemDetailTextStyle}" />
            <Label Text="List item text style"
              Style="{DynamicResource ListItemTextStyle}" />
            <Label Text="No style" />
            <Label Text="My body style"
              Style="{StaticResource myBodyStyle}" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

Style urządzenia są powiązane z użyciem DynamicResource rozszerzenia znaczników. Dynamiczny charakter stylów można zobaczyć w systemie iOS, zmieniając ustawienia ułatwień dostępu dla rozmiaru tekstu. Wygląd stylów urządzenia różni się na każdej platformie, jak pokazano na poniższych zrzutach ekranu:

Style urządzeń na każdej platformie

Style urządzeń można również uzyskać, ustawiając BaseResourceKey właściwość na nazwę klucza dla stylu urządzenia. W powyższym myBodyStyle przykładzie kodu dziedziczy i BodyStyle ustawia kolor tekstu wyróżniającego. Aby uzyskać więcej informacji na temat dziedziczenia stylu dynamicznego, zobacz Dziedziczenie stylu dynamicznego.

Poniższy przykład kodu przedstawia równoważną stronę w języku C#:

public class DeviceStylesPageCS : ContentPage
{
    public DeviceStylesPageCS ()
    {
        var myBodyStyle = new Style (typeof(Label)) {
            BaseResourceKey = Device.Styles.BodyStyleKey,
            Setters = {
                new Setter {
                    Property = Label.TextColorProperty,
                    Value = Color.Accent
                }
            }
        };

        Title = "Device";
        IconImageSource = "csharp.png";
        Padding = new Thickness (0, 20, 0, 0);

        Content = new StackLayout {
            Children = {
                new Label { Text = "Title style", Style = Device.Styles.TitleStyle },
                new Label { Text = "Subtitle style", Style = Device.Styles.SubtitleStyle },
                new Label { Text = "Body style", Style = Device.Styles.BodyStyle },
                new Label { Text = "Caption style", Style = Device.Styles.CaptionStyle },
                new Label { Text = "List item detail text style",
                  Style = Device.Styles.ListItemDetailTextStyle },
                new Label { Text = "List item text style", Style = Device.Styles.ListItemTextStyle },
                new Label { Text = "No style" },
                new Label { Text = "My body style", Style = myBodyStyle }
            }
        };
    }
}

Właściwość Style każdego Label wystąpienia jest ustawiona na odpowiednią właściwość z Device.Styles klasy .

Ułatwienia dostępu

Style urządzeń przestrzegają preferencji ułatwień dostępu, więc rozmiary czcionek zmienią się w miarę zmiany preferencji ułatwień dostępu na każdej platformie. W związku z tym w celu obsługi tekstu dostępnego upewnij się, że style urządzenia są używane jako podstawa dla dowolnych stylów tekstu w aplikacji.

Na poniższych zrzutach ekranu przedstawiono style urządzeń na każdej platformie z najmniejszym dostępnym rozmiarem czcionki:

Dostępne małe style urządzeń na każdej platformie

Na poniższych zrzutach ekranu przedstawiono style urządzeń na każdej platformie z największym dostępnym rozmiarem czcionki:

Dostępne duże style urządzeń na każdej platformie

  • Last updated on