Question

不使用代码，如何将其转换为模板？

我有大约10个，我的代码变得越来越大。它工作得很好，我只是在寻找清理代码的方法，我只是不熟悉模板和资源动画和触发器来做到这一点。

提前致谢。

    <RadioButton Width="35" Height="35" Content="RadioButton" Visibility="Visible" IsChecked="False" Margin="2.5,2.5,2.5,2.5" Template="{DynamicResource RadioTemplate}" >
        <RadioButton.Resources>
            <ControlTemplate x:Key="RadioTemplate" TargetType="{x:Type RadioButton}">
                <BulletDecorator Background="Transparent">
                    <BulletDecorator.Bullet>
                        <StackPanel>
                            <Image Width="Auto" Height="Auto" Source="..\Content\img.png" Stretch="Fill" />
                        </StackPanel>
                    </BulletDecorator.Bullet>
                </BulletDecorator>
            </ControlTemplate>
        </RadioButton.Resources>
        <RadioButton.BitmapEffect>
            <OuterGlowBitmapEffect x:Name="imageGlow" GlowColor="#FFeeba00" Opacity="1" GlowSize="0" />
        </RadioButton.BitmapEffect>
        <RadioButton.Triggers>
            <EventTrigger RoutedEvent="ToggleButton.Checked">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="imageGlow" Storyboard.TargetProperty="GlowSize" From="0" To="10" Duration="0:0:.15" AutoReverse="False" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
            <EventTrigger RoutedEvent="ToggleButton.Unchecked">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="imageGlow" Storyboard.TargetProperty="GlowSize" From="10" To="0" Duration="0:0:.15" AutoReverse="False" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </RadioButton.Triggers>
    </RadioButton>

Answer 1

您需要创建一种风格。

<Style x:Key="RadioStyle" TargetType="{x:Type RadioButton}">
    <Setter Property="Width" Value="35"/>
    <Setter Property="Height" Value="35"/>
    <Setter Property="Margin" Value="2.5"/>
    <Setter Property="BitmapEffect">
        <Setter.Value>
            <OuterGlowBitmapEffect GlowColor="#FFeeba00" Opacity="1" GlowSize="0" />
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type RadioButton}">
                <BulletDecorator Background="Transparent">
                    <BulletDecorator.Bullet>
                        <StackPanel>
                            <ContentPresenter/>
                        </StackPanel>
                    </BulletDecorator.Bullet>
                </BulletDecorator>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
<!--Continued-->

其余的（所以似乎切断了长代码片段）：

    <Style.Triggers>
        <EventTrigger RoutedEvent="ToggleButton.Checked">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="BitmapEffect.GlowSize" From="0" To="10" Duration="0:0:.15" AutoReverse="False" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="ToggleButton.Unchecked">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="BitmapEffect.GlowSize" From="10" To="0" Duration="0:0:.15" AutoReverse="False" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Style.Triggers>
</Style>

对于每个按钮，您将拥有以下内容：

<RadioButton Style="{DynamicResource RadioStyle}" Visibility="Visible" IsChecked="False">
    <Image Width="Auto" Height="Auto" Source="..\Content\img.png" Stretch="Fill" />
</RadioButton>

如何让这个Xaml成为模板？

1 个答案: