Formatowanie ciągu

Przeglądanie przykładu

W aplikacji interfejsu użytkownika aplikacji wieloplatformowej platformy .NET (.NET MAUI) czasami wygodne jest użycie powiązań danych w celu wyświetlenia ciągu reprezentacji obiektu lub wartości. Na przykład możesz użyć elementu , Label aby wyświetlić bieżącą wartość elementu Slider. W tym powiązaniu Slider danych element jest źródłem, a elementem docelowym jest Text właściwość Label.

Formatowanie ciągów w kodzie jest zwykle realizowane przy użyciu metody statycznej String.Format . Ciąg formatowania zawiera kody formatowania specyficzne dla różnych typów obiektów i można dołączyć inny tekst wraz z sformatowanymi wartościami. Aby uzyskać więcej informacji, zobacz Formatting Types in .NET (Typy formatowania w programie .NET ), aby uzyskać więcej informacji na temat formatowania ciągów.

Formatowanie ciągów można również wykonać za pomocą powiązań danych, ustawiając StringFormat właściwość Binding (lub StringFormat właściwość Binding rozszerzenia znaczników) na standardowy ciąg formatowania platformy .NET z symbolem zastępczym:

<Slider x:Name="slider" />
<Label Text="{Binding Source={x:Reference slider},
                      Path=Value,
                      StringFormat='The slider value is {0:F2}'}" />

W języku XAML ciąg formatowania jest rozdzielany znakami pojedynczego cudzysłowu, aby pomóc analizatorowi XAML uniknąć traktowania nawiasów klamrowych jako innego rozszerzenia znaczników XAML. W tym przykładzie specyfikacja F2 formatowania powoduje wyświetlenie wartości z dwoma miejscami dziesiętnymi.

Uwaga

StringFormat Użycie właściwości ma sens tylko wtedy, gdy właściwość docelowa ma typ string, a tryb powiązania to OneWay lub TwoWay. W przypadku powiązań dwukierunkowych parametr ma zastosowanie tylko do wartości przekazywanych StringFormat ze źródła do obiektu docelowego.

W poniższym przykładzie pokazano kilka zastosowań StringFormat właściwości:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:sys="clr-namespace:System;assembly=netstandard"
             x:Class="DataBindingDemos.StringFormattingPage"
             Title="String Formatting">

    <ContentPage.Resources>
        <Style TargetType="Label">
            <Setter Property="HorizontalTextAlignment" Value="Center" />
        </Style>
        <Style TargetType="BoxView">
            <Setter Property="Color" Value="Blue" />
            <Setter Property="HeightRequest" Value="2" />
            <Setter Property="Margin" Value="0, 5" />
        </Style>        
    </ContentPage.Resources>

    <StackLayout Margin="10">
        <Slider x:Name="slider" />
        <Label Text="{Binding Source={x:Reference slider},
                              Path=Value,
                              StringFormat='The slider value is {0:F2}'}" />
        <BoxView />
        <TimePicker x:Name="timePicker" />
        <Label Text="{Binding Source={x:Reference timePicker},
                              Path=Time,
                              StringFormat='The TimeSpan is {0:c}'}" />
        <BoxView />                              
        <Entry x:Name="entry" />
        <Label Text="{Binding Source={x:Reference entry},
                              Path=Text,
                              StringFormat='The Entry text is &quot;{0}&quot;'}" />
        <BoxView />
        <StackLayout BindingContext="{x:Static sys:DateTime.Now}">
            <Label Text="{Binding}" />
            <Label Text="{Binding Path=Ticks,
                                  StringFormat='{0:N0} ticks since 1/1/1'}" />
            <Label Text="{Binding StringFormat='The {{0:MMMM}} specifier produces {0:MMMM}'}" />
            <Label Text="{Binding StringFormat='The long date is {0:D}'}" />
        </StackLayout>
        <BoxView />        
        <StackLayout BindingContext="{x:Static sys:Math.PI}">
            <Label Text="{Binding}" />
            <Label Text="{Binding StringFormat='PI to 4 decimal points = {0:F4}'}" />
            <Label Text="{Binding StringFormat='PI in scientific notation = {0:E7}'}" />
        </StackLayout>
    </StackLayout>
</ContentPage>

W tym przykładzie powiązania w obiekcie Slider i pokazują użycie specyfikacji formatu określonego dla double typów danych i TimeSpan TimePicker . Element StringFormat , który wyświetla tekst z Entry widoku, pokazuje, jak określić podwójne cudzysłów w ciągu formatowania przy użyciu " jednostki HTML.

Następna sekcja w pliku XAML jest StackLayout elementem z ustawionym BindingContext x:Static rozszerzeniem znaczników odwołującym się do właściwości statycznej DateTime.Now . Pierwsze powiązanie nie ma właściwości:

<Label Text="{Binding}" />

Spowoduje to po prostu wyświetlenie DateTime wartości BindingContext z domyślnym formatowaniem. Drugie powiązanie wyświetla Ticks właściwość DateTime, podczas gdy pozostałe dwa powiązania wyświetlają DateTime się z określonym formatowaniem.

Uwaga

Jeśli musisz wyświetlić nawiasy klamrowe w lewym lub prawym nawiasie klamrowym w ciągu formatowania, użyj pary z nich. Na przykład StringFormat='{{0:MMMM}}'.

Ostatnia sekcja ustawia BindingContext wartość na wartość Math.PI i wyświetla ją z domyślnym formatowaniem i dwoma różnymi typami formatowania liczbowego:

ViewModels i formatowanie ciągów

Gdy używasz Label elementu i StringFormat wyświetlasz wartość widoku, który jest również elementem docelowym modelu widoków, możesz zdefiniować powiązanie z widoku do modelu widokowego lub Label z modelu viewmodel do Labelelementu . Ogólnie rzecz biorąc, drugie podejście jest najlepsze, ponieważ sprawdza, czy powiązania między widokiem i modelem widoków działają.

To podejście przedstawiono w poniższym przykładzie:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:DataBindingDemos"
             x:Class="DataBindingDemos.BetterColorSelectorPage"
             Title="Better Color Selector">
    <ContentPage.BindingContext>
        <local:HslColorViewModel Color="Sienna" />
    </ContentPage.BindingContext>

    <ContentPage.Resources>
        <ResourceDictionary>
            <Style TargetType="Slider">
                <Setter Property="VerticalOptions" Value="Center" />
            </Style>

            <Style TargetType="Label">
                <Setter Property="HorizontalTextAlignment" Value="Center" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>

    <StackLayout Margin="20">
        <BoxView Color="{Binding Color}"
                 HeightRequest="100"
                 WidthRequest="100"
                 HorizontalOptions="Center" />
        <StackLayout Margin="10, 0">
            <Label Text="{Binding Name}" />
            <Slider Value="{Binding Hue}" />
            <Label Text="{Binding Hue, StringFormat='Hue = {0:F2}'}" />
            <Slider Value="{Binding Saturation}" />
            <Label Text="{Binding Saturation, StringFormat='Saturation = {0:F2}'}" />
            <Slider Value="{Binding Luminosity}" />
            <Label Text="{Binding Luminosity, StringFormat='Luminosity = {0:F2}'}" />
        </StackLayout>
    </StackLayout>
</ContentPage>    

W tym przykładzie istnieją trzy pary Slider elementów i Label , które są powiązane z tą samą właściwością źródłową HslColorViewModel w obiekcie. KażdaLabel, która towarzyszy właściwości ma StringFormat Slider właściwość do wyświetlania każdej Slider wartości: