Xamarin.Forms の暗黙的なスタイル
"暗黙的なスタイルとは、各コントロールがスタイルを参照しなくても、同じ TargetType に対するすべてのコントロールで使用されるスタイルです。"
XAML で暗黙的なスタイルを作成する
ページ レベルで Style
を宣言するには、ResourceDictionary
をページに追加する必要があります。そうすると、1 つ以上の Style
宣言を ResourceDictionary
に含めることができます。 Style
は、x:Key
属性を指定しないことによって暗黙的なものとなります。 その後、このスタイルは TargetType
に正確に一致するビジュアル要素に適用されますが、TargetType
値から派生した要素には適用されません。
次のコード例は、ページの ResourceDictionary
の XAML で宣言され、ページの 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>
ResourceDictionary
を使って、ページの Entry
インスタンスに適用される 1 つの "暗黙的な" スタイルを定義します。 Style
を使用して、黄色の背景に青いテキストを表示するように設定しているほか、他の外観オプションも設定されています。 x:Key
属性を指定せずに、ページの ResourceDictionary
に Style
が追加されています。 したがって、Style
は、Style
の TargetType
プロパティと正確に一致するため、すべての Entry
インスタンスに暗黙的に適用されます。 ただし、サブクラス化された Entry
である CustomEntry
インスタンスには Style
は適用されません。 これで、次のスクリーンショットのような結果になります。
さらに、4 つ目の Entry
は、暗黙的なスタイルの BackgroundColor
および 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>
この例では、implicit Style
がStackLayout
コントロールのResources
コレクションに割り当てられます。 その後、"暗黙的な" スタイルをコントロールとその子に適用できます。
アプリケーションの ResourceDictionary
でスタイルを作成する方法については、グローバル スタイルに関する記事を参照してください。
C# で暗黙的なスタイルを作成する
Style
インスタンスは、C# でページの Resources
コレクションに追加できます。次のコード例に示すように、新しい ResourceDictionary
インスタンスを作成してから Style
インスタンスを ResourceDictionary
に追加します。
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
に追加されます。 したがって、Style
は、Style
の TargetType
プロパティと正確に一致するため、すべての Entry
インスタンスに暗黙的に適用されます。 ただし、サブクラス化された Entry
である CustomEntry
インスタンスには Style
は適用されません。
派生型にスタイルを適用する
Style.ApplyToDerivedTypes
プロパティを使用すると、TargetType
プロパティで参照される基本データ型から派生したコントロールにスタイルを適用できます。 したがって、TargetType
プロパティで指定された基本データ型から派生している型であれば、このプロパティを true
に設定することで、1 つのスタイルで複数の型をターゲットにできます。
次の例は、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 };