2012-07-18 103 views
2

我有两种不同的样式,其中我试图包含相同的基本元素。例如,Horizo​​ntalButton有这种风格:在xaml中包含xaml元素

<Style x:Key="HorizontalButton" TargetType="{x:Type custom:SampleButton}"> 
    <Setter Property="OverridesDefaultStyle" Value="True" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type custom:DispatchButton}"> 
       <Border Name="outerBorder" Width="{Binding RelativeSource={RelativeSource AncestorType={x:Type custom:SampleGrid}}, Path=ActualWidth, Converter={StaticResource MathConverter}, ConverterParameter=x/7}"> 
        <Border Name="innerBorder" BorderThickness="1" BorderBrush="WhiteSmoke" CornerRadius="1" Background="{TemplateBinding Background}"> 
         <Grid Margin="2"> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="4*"></RowDefinition> 
           <RowDefinition Height="Auto"></RowDefinition> 
           <RowDefinition Height="1*"></RowDefinition> 
          </Grid.RowDefinitions> 
          <StackPanel Orientation="Vertical" VerticalAlignment="Top"> 
           <StackPanel Orientation="Horizontal"> 
            <TextBlock Text="{TemplateBinding Id}"></TextBlock> 
            <TextBlock Text="{TemplateBinding Code}" Margin="4,0,0,0"></TextBlock> 
           </StackPanel> 
           <TextBlock Text="{TemplateBinding Address}" TextWrapping="Wrap"></TextBlock> 
          </StackPanel> 
          <Rectangle Grid.Row="1" Height="1" Margin="2,0,2,0" Stroke="DarkGray" /> 
          <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right"> 
           <Grid> 
            <Ellipse VerticalAlignment="Center" HorizontalAlignment="Center" Width="15" Height="15" Fill="{TemplateBinding SampleColor}" /> 
            <TextBlock Foreground="{TemplateBinding Background}" VerticalAlignment="Center" HorizontalAlignment="Center" Text="{TemplateBinding Sample}"></TextBlock> 
           </Grid> 
           <Image Width="16" Height="16" Source="{TemplateBinding SymbolImage}" Margin="2,0,0,0" /> 
          </StackPanel> 
          <ContentPresenter HorizontalAlignment="Stretch" VerticalAlignment="Center" Name="content" /> 
         </Grid> 
        </Border> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

而且VerticalButton有这种风格:

<Style x:Key="VerticalButton" TargetType="{x:Type custom:SampleButton}"> 
    <Setter Property="OverridesDefaultStyle" Value="True" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type custom:DispatchButton}"> 
       <Border Name="outerBorder" Height="{Binding RelativeSource={RelativeSource AncestorType={x:Type custom:SampleGrid}}, Path=ActualHeight, Converter={StaticResource MathConverter}, ConverterParameter=x/7}"> 
        <Border Name="innerBorder" BorderThickness="1" BorderBrush="WhiteSmoke" CornerRadius="1" Background="{TemplateBinding Background}"> 
         <Grid Margin="2"> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="4*"></RowDefinition> 
           <RowDefinition Height="Auto"></RowDefinition> 
           <RowDefinition Height="1*"></RowDefinition> 
          </Grid.RowDefinitions> 
          <StackPanel Orientation="Vertical" VerticalAlignment="Top"> 
           <StackPanel Orientation="Horizontal"> 
            <TextBlock Text="{TemplateBinding Id}"></TextBlock> 
            <TextBlock Text="{TemplateBinding Code}" Margin="4,0,0,0"></TextBlock> 
           </StackPanel> 
           <TextBlock Text="{TemplateBinding Address}" TextWrapping="Wrap"></TextBlock> 
          </StackPanel> 
          <Rectangle Grid.Row="1" Height="1" Margin="2,0,2,0" Stroke="DarkGray" /> 
          <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right"> 
           <Grid> 
            <Ellipse VerticalAlignment="Center" HorizontalAlignment="Center" Width="15" Height="15" Fill="{TemplateBinding SampleColor}" /> 
            <TextBlock Foreground="{TemplateBinding Background}" VerticalAlignment="Center" HorizontalAlignment="Center" Text="{TemplateBinding Sample}"></TextBlock> 
           </Grid> 
           <Image Width="16" Height="16" Source="{TemplateBinding SymbolImage}" Margin="2,0,0,0" /> 
          </StackPanel> 
          <ContentPresenter HorizontalAlignment="Stretch" VerticalAlignment="Center" Name="content" /> 
         </Grid> 
        </Border> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

正如你所看到的,outerBorder有不同的属性设置取决于按钮是否是垂直或水平,但innerBorder内部的所有内部元素都是相同的。有没有一种方法可以在xaml中做某种包含或引用,以便我只需对内部元素的一个实例进行更改即可获得相同的结果?

回答

3

你也许能够使用ContentControlContentTemplate设置为包含所有共享元素

<DataTemplate x:Key="MySharedXaml"> 
    <!-- Shared XAML here --> 
</DataTemplate> 
在你的控制

然后DataTemplate,只是无论你想共享XAML

<ContentControl ContentTemplate="{StaticResource MySharedXAML}"> 
    <ContentPresenter /> 
</ContentControl> 
使用

我不确定的唯一的事情是绑定。您可能需要稍微调整XAML以确保绑定正确设置。

+0

谢谢雷切尔,这工作完美。你是对的,我不得不更新绑定,所以不是使用'Background = {TemplateBinding Background}',而是使用'Background =“{Binding RelativeSource = {RelativeSource AncestorType = {x:Type custom:SampleButton}},路径=背景}“' – flamebaud 2012-07-18 15:55:52