Установка шаблонов через стили

Связывание в шаблонах не ограничивается классом ContentPresenter. На самом деле вы можете использовать его в любом месте шаблона Control’а. Давайте рассмотрим наш пример кнопки с «вшитым» красным цветом фона элемента Border. Вот как можно использовать шаблонное связывание для управления фоном:

<Border BorderBrush="Orange"
BorderThickness="3"
CornerRadius="10"
Background="{TemplateBinding Background}">

Этот пример затрагивает один из вечных вопросов проектирования. Стоит ли жестко «зашивать» цвет, чтобы иметь стандартный вид кнопок, или применить связывание, чтобы сделать шаблон более гибким? На этот раз у нас имеется отличный компромисс, позволяющий убить сразу двух зайцев: вы можете сочетать шаблоны и стили! Основная идея в том, чтобы шаблон позволял изменять цвет фона, а стиль содержал бы значения по умолчанию, на случай если цвет не будет указан явно:

<Style x:Key="ButtonStyle" TargetType="Button">
<Setter Property="Background" Value="Red"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border BorderBrush="Orange"
BorderThickness="3"
CornerRadius="10"
Background="{TemplateBinding Background}">
<ContentPresenter Margin="{TemplateBinding Padding}"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

Но можно оставить стиль отдельным ресурсом:

<Style x:Key="ButtonStyle" TargetType="Button">
<Setter Property="Background" Value="Red"/>
<Setter Property="Template" Value="{StaticResource ButtonTemplate}"/>
</Style>

Только учтите, что в таком случае объявление стиля должно следовать после объявления шаблона.

Синхронное использование стилей и шаблонов также бывает полезным, если вам нужно задать свойства (зависимые свойства) отсутствующие в ContentPresenter или в элементах контейнера вашего шаблона. Обратите внимание, что в нашем примере нет связывания для цвета шрифта кнопки. А все потому, что эти свойства (Foreground, FontFamily, FontSize, FontWeight, и т.д.) учавствуют в наследовании свойств. Когда вы задаете эти значения в элементе более высокого уровня (например, в кнопке), они распространяются на вложенные элементы (например, TextBlock внутри кнопки). Сам же ContentPresenter не имеет этих свойств, и в этом нет необходимости. Значения этих свойств передаются от Control’а к вложенному контенту минуя ContentPresenter.

Иногда вам может понадобиться изменить значение наследуемого свойства, чтобы ограничить изменение вида вашего Control’а. Например, в нашем случае важно, чтобы цвет текста был белым, поскольку белый текст лучше выделяется на красном фоне кнопки. Но стандартный цвет шрифта наследуется от Silverlight страницы, на которой расположены наши элементы, и этот цвет – черный. К тому же вы не можете установить цвет через ContentPresenter, т.к. он не содержит свойства Foreground. Для решения этой проблемы нужно объединить шаблон Control’а со стилем, сеттер которого задает белый цвет текста:

<Style x:Key="ButtonStyle" TargetType="Button">
<Setter Property="Foreground" Value="White"/>
<Setter Property="Background" Value="Red"/>
<Setter Property="Template" Value="{StaticResource ButtonTemplate}"/>
</Style>

Данный подход объединяет в себе удобство и гибкость. Без каких либо дополнительных действий вы автоматически получаете кнопку с красным фоном и белым текстом, но также можете создать другой стиль, задающий другую цветовую схему, но использующий тот же самый шаблон. Это сэкономит вам много сил.

Дата добавления: 2015-08-13