暗黙的なスタイル Xamarin.Forms

Download Sample サンプルをダウンロードします

暗黙的なスタイルは、各コントロールがスタイルを参照する必要なく、同じ TargetType のすべてのコントロールで使用されるスタイルです。

XAML で暗黙的なスタイルを作成する

ページ レベルで宣言 Style するには、a を ResourceDictionary ページに追加する必要があり、次に 1 つ以上 Style の宣言を ResourceDictionary. A Style は、属性を指定しないことによって 暗黙的x:Key 行われます。 その後、スタイルは正確に一致 TargetType するビジュアル要素に適用されますが、値から TargetType 派生した要素には適用されません。

次のコード例は、ページの XAML で宣言され、ページのResourceDictionaryインスタンスに適用される暗黙的なスタイルをEntry示しています。

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:Styles;assembly=Styles" x:Class="Styles.ImplicitStylesPage" Title="Implicit" IconImageSource="xaml.png">
    <ContentPage.Resources>
        <ResourceDictionary>
            <Style TargetType="Entry">
                <Setter Property="HorizontalOptions" Value="Fill" />
                <Setter Property="VerticalOptions" Value="CenterAndExpand" />
                <Setter Property="BackgroundColor" Value="Yellow" />
                <Setter Property="FontAttributes" Value="Italic" />
                <Setter Property="TextColor" Value="Blue" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <Entry Text="These entries" />
            <Entry Text="are demonstrating" />
            <Entry Text="implicit styles," />
            <Entry Text="and an implicit style override" BackgroundColor="Lime" TextColor="Red" />
            <local:CustomEntry Text="Subclassed Entry is not receiving the style" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

ページResourceDictionaryEntryのインスタンスに適用される 1 つの暗黙的なスタイルを定義します。 黄色の Style 背景に青いテキストを表示し、他の外観オプションも設定するために使用されます。 属性Styleを指定x:KeyせずにページにResourceDictionary追加されます。 したがって、すべてのStyleEntryインスタンスは、正確にプロパティStyleと一致TargetTypeするため、暗黙的に適用されます。 ただし、サブクラスStyle化されたEntryインスタンスには適用CustomEntryされません。 この結果、次のスクリーンショットに示すような外観が表示されます。

Implicit Styles Example

さらに、4 つ目 EntryBackgroundColor 、暗黙的なスタイルのプロパティを TextColor 異なる Color 値にオーバーライドします。

コントロール レベルで暗黙的なスタイルを作成する

次のコード例に示すように、暗黙的 スタイルをページ レベルで作成するだけでなく、コントロール レベルで作成することもできます。

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:Styles;assembly=Styles" x:Class="Styles.ImplicitStylesPage" Title="Implicit" IconImageSource="xaml.png">
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <StackLayout.Resources>
                <ResourceDictionary>
                    <Style TargetType="Entry">
                        <Setter Property="HorizontalOptions" Value="Fill" />
                        ...
                    </Style>
                </ResourceDictionary>
            </StackLayout.Resources>
            <Entry Text="These entries" />
            ...
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

この例では、暗黙的StyleなコントロールのコレクションStackLayoutResources割り当てられます。 その後、 暗黙的な スタイルをコントロールとその子に適用できます。

アプリケーション ResourceDictionaryでスタイルを作成する方法については、「 グローバル スタイル」を参照してください。

C で暗黙的なスタイルを作成する#

Styleインスタンスを C# のページのコレクションに追加するには、次のResourcesコード例に示すように、新しいResourceDictionaryインスタンスを作成し、インスタンスをResourceDictionaryインスタンスに追加Styleします。

public class ImplicitStylesPageCS : ContentPage
{
    public ImplicitStylesPageCS ()
    {
        var entryStyle = new Style (typeof(Entry)) {
            Setters = {
                ...
                new Setter { Property = Entry.TextColorProperty, Value = Color.Blue }
            }
        };

        ...
        Resources = new ResourceDictionary ();
        Resources.Add (entryStyle);

        Content = new StackLayout {
            Children = {
                new Entry { Text = "These entries" },
                new Entry { Text = "are demonstrating" },
                new Entry { Text = "implicit styles," },
                new Entry { Text = "and an implicit style override", BackgroundColor = Color.Lime, TextColor = Color.Red },
                new CustomEntry  { Text = "Subclassed Entry is not receiving the style" }
            }
        };
    }
}

コンストラクターは、ページEntryのインスタンスに適用される 1 つの暗黙的なスタイルを定義します。 黄色の Style 背景に青いテキストを表示し、他の外観オプションも設定するために使用されます。 文字列Styleを指定keyせずにページにResourceDictionary追加されます。 したがって、すべてのStyleEntryインスタンスは、正確にプロパティStyleと一致TargetTypeするため、暗黙的に適用されます。 ただし、サブクラスStyle化されたEntryインスタンスには適用CustomEntryされません。

派生型にスタイルを適用する

この Style.ApplyToDerivedTypes プロパティを使用すると、プロパティによって参照される基本型から派生したコントロールにスタイルを TargetType 適用できます。 したがって、このプロパティを設定すると、プロパティで true 指定された基本型から型が派生する場合に、1 つのスタイルで複数の型を TargetType 対象にできます。

次の例は、インスタンスの背景色 Button を赤に設定する暗黙的なスタイルを示しています。

<Style TargetType="Button"
       ApplyToDerivedTypes="True">
    <Setter Property="BackgroundColor"
            Value="Red" />
</Style>

このスタイルをページ レベル ResourceDictionary に配置すると、そのスタイルがページ上のすべての Button インスタンスと、そこから Button派生するすべてのコントロールに適用されます。 ただし、プロパティの設定が ApplyToDerivedTypes 解除されたままの場合、スタイルはインスタンスにのみ適用 Button されます。

これに相当する C# コードを次に示します。

var buttonStyle = new Style(typeof(Button))
{
    ApplyToDerivedTypes = true,
    Setters =
    {
        new Setter
        {
            Property = VisualElement.BackgroundColorProperty,
            Value = Color.Red
        }
    }
};

Resources = new ResourceDictionary { buttonStyle };