2009-04-22 81 views
1

如果不使用代码,我该如何将它变成模板?我该如何制作这个Xaml模板?

我有大约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> 

回答

3

您需要创建一个样式。

<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--> 

而其余的(SO似乎切断长的代码片段):

<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> 
+0

您可以添加剩余的属性,但我认为每个按钮的一些属性会有所不同:内容,可见性,IsChecked。 – 2009-04-22 12:10:53