Question

我试图在复合控件中为一组文本框设置两个不同的边框厚度值：一个用于聚焦状态，一个用于未聚焦状态。为此，我有以下模板：

            <ControlTemplate TargetType="TextBox">
                <Grid Background="Transparent">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver"/>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainBorder" Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainBorder" Storyboard.TargetProperty="BorderBrush">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="ReadOnly">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainBorder" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Collapsed</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ReadonlyBorder" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ReadonlyBorder" Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ReadonlyBorder" Storyboard.TargetProperty="BorderBrush">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxReadOnlyBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainBorder" Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBackgroundBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainBorder" Storyboard.TargetProperty="BorderBrush">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBorderBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="UnfocusedBorder" Storyboard.TargetProperty="BorderThickness">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="1" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="UnFocused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="UnfocusedBorder" Storyboard.TargetProperty="BorderThickness">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="4" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="MainBorder" 
                            Background="{TemplateBinding Background}" 
                            BorderThickness="4" 
                            BorderBrush="{StaticResource PhoneDarkBorderBrush}" 
                            Margin="{StaticResource PhoneTouchTargetOverhang}" />
                    <Border x:Name="UnfocusedBorder" 
                            Background="{TemplateBinding Background}" 
                            BorderThickness="1" 
                            BorderBrush="{StaticResource PhoneDarkBorderBrush}" 
                            Margin="{StaticResource PhoneTouchTargetOverhang}" />
                    <Border x:Name="ReadonlyBorder" 
                            Visibility="Collapsed" 
                            Background="Transparent" 
                            BorderBrush="{StaticResource PhoneDisabledBrush}" 
                            BorderThickness="{TemplateBinding BorderThickness}" 
                            Margin="{StaticResource PhoneTouchTargetOverhang}" />
                    <Border Background="Transparent" 
                            BorderThickness="1" 
                            BorderBrush="{StaticResource PhoneDarkBorderBrush}" 
                            Margin="{StaticResource PhoneTouchTargetOverhang}">
                        <ContentControl x:Name="ContentElement" 
                                        BorderThickness="0"
                                        Padding="{TemplateBinding Padding}" 
                                        HorizontalContentAlignment="Stretch" 
                                        VerticalContentAlignment="Stretch" 
                                        Margin="{StaticResource PhoneTextBoxInnerMargin}"/>
                    </Border>
                </Grid>
            </ControlTemplate>

然而，所有这一切似乎都是始终应用边框厚度为1，它永远不会变为4.我无法理解为什么 - 任何人都可以给我一个线索吗？

Answer 1

在Unfocused上将BorderThickness设置为4，但UnfocusedBorder元素缺少TemplateBinding并硬编码为1.因此将BorderThickness =“{TemplateBinding BorderThickness}”添加到“UnfocusedBorder”。

<DiscreteObjectKeyFrame KeyTime="0" Value="4" />

<Border x:Name="UnfocusedBorder"
       Background="{TemplateBinding Background}"
       BorderThickness="{TemplateBinding BorderThickness}"
       BorderBrush="{StaticResource PhoneDarkBorderBrush}" 
       Margin="{StaticResource PhoneTouchTargetOverhang}" />

在Windows Phone 8上使用VisualStateGroups更改文本框边框粗细

1 个答案: