2012-07-18 37 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