Параметризованный стиль в UserControl?

Question

Я использовал этот учебник MSDN , чтобы создать эффектный взгляд на все Button элементы управления моего окна, и это сработало нормально.

Чтобы сделать его еще более пригодным для повторного использования, япопытался поместить все в UserControl: я создал UC ImageButton, затем инкапсулировал все это <Style> из <Window.Resources> в <UserControl.Resources>.

Затем я изменил свои экземпляры Button в XAML с:

<Button Tag="Face.jpg" Content="Foo" />

Кому:

<uc:ImageButton Tag="Face.jpg" Content="Foo" />

И стиль перестал применяться.

Вот код UC:

<UserControl x:Class="GDTI.UI.Main.View.UserControls.ImageButton"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">

<UserControl.Resources>
    <Style TargetType="Button">
        <Setter Property="MaxWidth" Value="250" />
        <Setter Property="Margin" Value="5" />
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="Foreground" Value="White" />

        <Setter Property="Background" >
            <Setter.Value>
                <SolidColorBrush Color="Orange" Opacity="0.4" />
            </Setter.Value>
        </Setter>

        <Setter Property="ContentTemplate">
            <Setter.Value>
                <DataTemplate >
                    <StackPanel>
                        <Image Source="{Binding Tag,
                            RelativeSource={RelativeSource
                                              FindAncestor,
                                              AncestorType='Button'}}" />
                        <TextBlock Margin="10"
            HorizontalAlignment="Center"
            Text="{Binding Content,
                     RelativeSource={RelativeSource
                                       FindAncestor,
                                       AncestorType='Button'}}" />
                    </StackPanel>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</UserControl.Resources>

<Button/>

Чего мне не хватает?

Спасибо!

Answer 1

Привязки в свойствах цели стиля кнопки для кнопки, для которой больше не установлены свойства.Вам нужно перенаправить их на UserControl, если вы хотите сохранить целостность стиля:

<!-- Inside UserControl declaration -->
<Button Content="{Binding Caption, RelativeSource={RelativeSource AncestorType=UserControl}}"
        Tag="{Binding ImageSource, RelativeSource={RelativeSource AncestorType=UserControl}}"/>

Где Caption и ImageSource должны быть новыми свойствами зависимостей , определенными вUserControl (в коде позади).

Обратите внимание, что вы никогда не сможете привязаться к Content в UserControl (отсюда свойство Caption), здесь сам Button равен Content из UserControl.

В качестве альтернативы вы можете напрямую изменить таргетинг в стиле, изменив AncestorType на UserControl, который обходит Button.Связывание за пределами шаблонного контроля не совсем хорошая практика, но вы все еще находитесь внутри UserControl, так что это может быть простительно.

В любом случае, это немного хакерски, и лучше вместо этого унаследовать от Button.