有焦点时如何更改文本框边框的颜色？答案

【问题标题】：How to change the color of the Border of a TextBox when it has focus?有焦点时如何更改文本框边框的颜色？
【发布时间】：2014-10-28 15:31:54
【问题描述】：

在我的 windows phone 应用程序中，我已将文本框的边框设置为 null：

但是当它有焦点时，它的边框仍然显示为蓝色。我该如何配置该颜色？我尝试查看文本框的模板，当它具有焦点时，我没有看到边框颜色的属性：

有人知道这是否可以改变吗？

    <Thickness x:Key="TextControlHeaderMarginThemeThickness">0,0,0,4.8</Thickness>
    <x:Double x:Key="TextControlThemeMinHeight">33</x:Double>
    <x:Double x:Key="ContentControlFontSize">20.26</x:Double>
    <SolidColorBrush x:Key="TextBoxDisabledBackgroundThemeBrush" Color="Transparent" />
    <x:Double x:Key="TextControlBackgroundThemeOpacity">0.8</x:Double>
    <x:Double x:Key="TextControlBorderThemeOpacity">0.8</x:Double>
    <ControlTemplate x:Key="TextBoxControlTemplate1" TargetType="TextBox">
        <Grid>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundElement" Storyboard.TargetProperty="Background">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledBackgroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledBorderThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledForegroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledForegroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Normal">
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetName="BackgroundElement" Storyboard.TargetProperty="Opacity" Duration="0"
                                To="{ThemeResource TextControlBackgroundThemeOpacity}" />
                            <DoubleAnimation Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Opacity" Duration="0"
                                To="{ThemeResource TextControlBorderThemeOpacity}" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Opacity" Duration="0" To="0" />
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundElement" Storyboard.TargetProperty="Background">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxFocusedBackgroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Border x:Name="BackgroundElement" Grid.Row="1" Background="{TemplateBinding Background}" Margin="{TemplateBinding BorderThickness}" />
            <Border x:Name="BorderElement" Grid.Row="1" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" />
            <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" Style="{StaticResource HeaderContentPresenterStyle}" Margin="{ThemeResource TextControlHeaderMarginThemeThickness}"
                Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" />
            <ScrollViewer x:Name="ContentElement" Grid.Row="1" MinHeight="{ThemeResource TextControlThemeMinHeight}"
                HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" Margin="{TemplateBinding BorderThickness}"
                Padding="{TemplateBinding Padding}" IsTabStop="False" ZoomMode="Disabled"
                AutomationProperties.AccessibilityView="Raw"/>
            <ContentControl x:Name="PlaceholderTextContentPresenter" Grid.Row="1" Foreground="{ThemeResource TextBoxPlaceholderTextThemeBrush}"
                FontSize="{ThemeResource ContentControlFontSize}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"
                IsTabStop="False" Content="{TemplateBinding PlaceholderText}" />
        </Grid>
    </ControlTemplate>

【问题讨论】：

标签： windows-phone-8.1

【解决方案1】：

高亮是通过StoryBoard 动画完成的。

尤其是你Style中的这个

<VisualState x:Name="Focused">
    <Storyboard>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush">
            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" />
        </ObjectAnimationUsingKeyFrames>
        <!--- .... --->
   </Storyboard>
</VisualState>

您可以摆脱它（删除它），或者将值更改为红色

<VisualState x:Name="Focused">
    <Storyboard>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush">
            <DiscreteObjectKeyFrame KeyTime="0" Value="Red" />
        </ObjectAnimationUsingKeyFrames>
        <!--- .... --->
   </Storyboard>
</VisualState>

如果您摆脱了 StoryBoard Animation for Focused，那么您可以通过更改 BorderElement BorderBrush 来设置颜色

<Border x:Name="BorderElement" BorderBrush="Red" BorderThickness="{TemplateBinding BorderThickness}" Grid.Row="1"/>

【讨论】：

TextBox 有焦点时如何更改“蓝色圆圈”的颜色。我更改了“TextSelectionHighlightColorThemeBrush”，但事实并非如此。
@n179911 我认为它与手机上的PhoneAccentBrush 设置有关。如果它是可变的（我不认为它是可变的），你可以通过改变主题来做到这一点。这是一个有用的链接：stackoverflow.com/questions/11095980/…
@n179911这里需要纠正一下，可以重写PhoneAccentBrush，甚至有人将代码编译成库jeff.wilcox.name/2012/01/phonethememanager