3

同じ基本要素を含めようとしている 2 つの別々のスタイルがあります。たとえば、Horizo​​ntalButton には次のスタイルがあります。

<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 から内側のすべての内部要素は同一です。内部要素の 1 つのインスタンスを変更するだけで同じ結果が得られるように、xaml である種のインクルードまたは参照を行う方法はありますか?

4

1 に答える 1

4

すべての共有要素を含むセットContentControlでを使用できる場合がありますContentTemplateDataTemplate

<DataTemplate x:Key="MySharedXaml">
    <!-- Shared XAML here -->
</DataTemplate>

次に、コントロールで、共有XAMLが必要な場所でこれを使用します

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

よくわからないのはバインディングだけです。バインディングが正しく設定されるように、XAMLを少し調整する必要がある場合があります。

于 2012-07-18T15:10:52.753 に答える