更改controltemplate中对象的样式

时间:2013-06-22 09:24:04

标签: c# xaml windows-phone controltemplate

我制作了一个新控件,其中包含一个矩形和一些视觉状态。

 <Style TargetType="Button" x:Key="banda">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>

                            <Grid.ColumnDefinitions >
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions >
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="0:0:0.1"/>
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FF47B215" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal">
                                        <Storyboard>
                                        <ColorAnimation Duration="0" To="{Binding Background, ElementName=Border}" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FF86B072" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                        <Border x:Name="Border" Background="purple" StrokeThickness="5"  Stroke="{Binding Background, ElementName=Border}"/>
                        </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        </Style>

在我的应用程序页面中多次使用此控件,我希望每次使用时矩形都有不同的颜色值,例如当我按下按钮时,矩形会改变颜色。

我不知道如何更改c#代码中矩形的属性。有人可以帮我格式化吗?

1 个答案:

答案 0 :(得分:0)

没有汗,只需通过绑定Background就可以将该功能构建到模板中;

<Style TargetType="Button" x:Key="banda">
           <Setter Property="Background" Value="Purple"/>
           <Setter Property="BorderThickness" Value="5"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="0:0:0.1"/>
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FF47B215" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal">
                                        <Storyboard>
                                        <ColorAnimation Duration="0" To="{Binding Background, ElementName=Border}" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FF86B072" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                        <Border x:Name="Border" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{Binding Background, ElementName=Border}"/>
                        </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
     </Style>

所以这样,默认颜色将是紫色(如Setter声明中所示),您可以随时更改它;

<Button Style="{StaticResource banda}" Content="Blah" Background="Orange"/>

然而;通常建议您不要将多个状态更改附加到单个对象。例如,如果您将模板加载到Expression blend中,您将在编辑模板时查看States Panel,您会看到一个三角形感叹号图标,警告您不建议在一个对象周围建立太多状态。你的模板。大部分时间它的罚款虽然并且将按原样运作。你还有Stroke&amp; StrokeThickness已应用于没有这些依赖关系属性的Border,因此在示例中我将其修复为BorderThicknessBorderBrush。哦,你可能也会发现你的房产如何,因此相互关系会导致你的麻烦。抛弃这样的事情;

                         <VisualState x:Name="Normal">
                                <Storyboard>
                                <ColorAnimation Duration="0" To="{Binding Background, ElementName=Border}" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/>
                                </Storyboard>
                            </VisualState>

而只是通过Background将其绑定到{TemplateBinding Background}属性。我建议查看按钮的一些默认控件模板,并进行比较以了解更多如何使用它们。

希望这有帮助。