[英]Change focused textbox background/foreground in WP7
每當文本框被聚焦時,文本的邊框和前景都會根據當前主題進行更改:
主題燈 - >邊框:黑色,文字:白色,背景:透明
主題黑暗 - >邊框:白色,文字:白色,背景:白色
我希望文本框始終有邊框:白色,文字:白色,背景:透明
我可以在文本框未聚焦時控制這些設置,但是當它具有焦點時我無法更改背景。
文本框的XML是:
<TextBox InputScope="EmailSmtpAddress" Height="72" LostFocus="textBox1_LostFocus" GotFocus="textBox1_GotFocus" HorizontalAlignment="Left" Margin="0,62,0,0" Name="textBox1" Text="Enter URL here..." VerticalAlignment="Top" Width="460" TextChanged="textBox1_TextChanged" Foreground="White" Background="#005DADF5" SelectionForeground="White" BorderBrush="#DEEAEAEA" FontFamily="Tahoma" FontWeight="Normal" />
您可以使用模板覆蓋默認樣式:
<Style x:Key="TextBoxStyle1" TargetType="TextBox">
<Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilyNormal}" />
<Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}" />
<Setter Property="Background" Value="{StaticResource PhoneTextBoxBrush}" />
<Setter Property="Foreground" Value="{StaticResource PhoneTextBoxForegroundBrush}" />
<Setter Property="BorderBrush" Value="{StaticResource PhoneTextBoxBrush}" />
<Setter Property="SelectionBackground" Value="{StaticResource PhoneAccentBrush}" />
<Setter Property="SelectionForeground" Value="{StaticResource PhoneTextBoxSelectionForegroundBrush}" />
<Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}" />
<Setter Property="Padding" Value="2" />
<Setter Property="Template">
<Setter.Value>
<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="EnabledBorder" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="ReadOnly">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="EnabledBorder" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyContent" 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="EnabledBorder" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBackgroundBrush}" />
</ObjectAnimationUsingKeyFrames>
<!-- COMMENT THIS OUT -----> <!--<ObjectAnimationUsingKeyFrames Storyboard.TargetName="EnabledBorder" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBorderBrush}" />
</ObjectAnimationUsingKeyFrames>-->
</Storyboard>
</VisualState>
<VisualState x:Name="Unfocused" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border x:Name="EnabledBorder"
Margin="{StaticResource PhoneTouchTargetOverhang}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<ContentControl x:Name="ContentElement"
Margin="{StaticResource PhoneTextBoxInnerMargin}"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
BorderThickness="0"
Padding="{TemplateBinding Padding}" />
</Border>
<Border x:Name="DisabledOrReadonlyBorder"
Margin="{StaticResource PhoneTouchTargetOverhang}"
Background="Transparent"
BorderBrush="{StaticResource PhoneDisabledBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Visibility="Collapsed">
<TextBox x:Name="DisabledOrReadonlyContent"
Background="Transparent"
FontFamily="{TemplateBinding FontFamily}"
FontSize="{TemplateBinding FontSize}"
FontStyle="{TemplateBinding FontStyle}"
FontWeight="{TemplateBinding FontWeight}"
Foreground="{StaticResource PhoneDisabledBrush}"
IsReadOnly="True"
SelectionBackground="{TemplateBinding SelectionBackground}"
SelectionForeground="{TemplateBinding SelectionForeground}"
Template="{StaticResource PhoneDisabledTextBoxTemplate}"
Text="{TemplateBinding Text}"
TextAlignment="{TemplateBinding TextAlignment}"
TextWrapping="{TemplateBinding TextWrapping}" />
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
我使用Expression Blend獲取默認模板,然后通過刪除(注釋掉)改變了Focused
VisualState
BorderBrush
的ObjectAnimationUsingKeyFrames
元素來修改它。 將此樣式應用於TextBox
並將其BorderBrush
更改為您的顏色。
<TextBox BorderBrush="Red" Style="{StaticResource TextBoxStyle1}" />
最簡單的方法是在GotFocus上設置事件。
TextBox的XamlCode:
<TextBox x:Name="InputUserName"
Foreground="Black"
Background="LightGray"
BorderBrush="LightGray"
GotFocus="GotFocusaAction" />
GotFocusAction的Codebehind:
private void GotFocusaAction(object sender, System.Windows.RoutedEventArgs e)
{
InputUserName.Background = new SolidColorBrush(Colors.LightGray);
InputUserName.BorderBrush = new SolidColorBrush(Colors.LightGray);
}
如果要將聚焦TextBox的顏色設置為其他顏色,還應設置“LostFocus事件”以更改BackgroundColor。
TextBox的XamlCode:
<TextBox x:Name="InputUserName"
Foreground="Black"
Background="Red"
BorderBrush="Red"
GotFocus="GotFocusaAction"
LostFocus="GotFocusaAction" />
Codebehind:
private void GotFocusaAction(object sender, System.Windows.RoutedEventArgs e)
{
InputUserName.Background = new SolidColorBrush(Colors.Purple);
InputUserName.BorderBrush = new SolidColorBrush(Colors.Purple);
}
private void LostFocusAction(object sender, System.Windows.RoutedEventArgs e)
{
InputUserName.Background = new SolidColorBrush(Colors.Red);
InputUserName.BorderBrush = new SolidColorBrush(Colors.Red);
}
顯然你不能在聚焦時改變文本框的背景,而不是在黑暗的主題中(它甚至在系統的集成文本框中也是如此)。
所以我提出了解決我的問題的解決方案,
我創建了兩個完全相互上下的文本框實例,並將前面的不透明度更改為等於0(完全不可見)。
然后我通過代碼連接兩個文本框,這樣如果正在鍵入前面的那個(它是不可見的,所以沒有人會看到正在寫的文本)我編輯后面的文本完全相同。
您需要評論更大的區域:
<VisualStateGroup x:Name="FocusStates">
<VisualState x:Name="Focused">
<!--<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="EnabledBorder" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBackgroundBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="EnabledBorder" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxEditBorderBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>-->
</VisualState>
<VisualState x:Name="Unfocused" />
</VisualStateGroup>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.