Question

我有一个简单的问题，但我是Silverlight的新手。

我有一个透明的文本框，但是当我获得焦点时，文本字段背景会变白。

如何解决？

enter image description here

Answer 1

您只需要在VisualStateManager中编辑默认控件模板中的“FocusedState”，或者在资源字典或UserControl.Resources等中提供类似下面提供的那个。

以下是将下面的样式模板应用于TextBox实例的方法

<TextBox Style="{StaticResource YourCustomTextBoxStyle}/>

这是一个默认的WP7 TextBox样式模板，其中有适当的位置调整...

<Style x:Key="YourCustomTextBoxStyle" 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.TargetProperty="Visibility" Storyboard.TargetName="EnabledBorder">  
                                                <DiscreteObjectKeyFrame KeyTime="0">  
                                                    <DiscreteObjectKeyFrame.Value> 
                                                        <Visibility>Collapsed</Visibility> 
                                                    </DiscreteObjectKeyFrame.Value> 
                                                </DiscreteObjectKeyFrame> 
                                            </ObjectAnimationUsingKeyFrames> 
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="DisabledOrReadonlyBorder">  
                                                <DiscreteObjectKeyFrame KeyTime="0">  
                                                    <DiscreteObjectKeyFrame.Value> 
                                                        <Visibility>Visible</Visibility> 
                                                    </DiscreteObjectKeyFrame.Value> 
                                                </DiscreteObjectKeyFrame> 
                                            </ObjectAnimationUsingKeyFrames> 
                                        </Storyboard> 
                                    </VisualState> 
                                    <VisualState x:Name="ReadOnly">  
                                        <Storyboard> 
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="EnabledBorder">  
                                                <DiscreteObjectKeyFrame KeyTime="0">  
                                                    <DiscreteObjectKeyFrame.Value> 
                                                        <Visibility>Collapsed</Visibility> 
                                                    </DiscreteObjectKeyFrame.Value> 
                                                </DiscreteObjectKeyFrame> 
                                            </ObjectAnimationUsingKeyFrames> 
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="DisabledOrReadonlyBorder">  
                                                <DiscreteObjectKeyFrame KeyTime="0">  
                                                    <DiscreteObjectKeyFrame.Value> 
                                                        <Visibility>Visible</Visibility> 
                                                    </DiscreteObjectKeyFrame.Value> 
                                                </DiscreteObjectKeyFrame> 
                                            </ObjectAnimationUsingKeyFrames> 
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="DisabledOrReadonlyBorder">  
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxBrush}"/>  
                                            </ObjectAnimationUsingKeyFrames> 
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="DisabledOrReadonlyBorder">  
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxBrush}"/>  
                                            </ObjectAnimationUsingKeyFrames> 
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="DisabledOrReadonlyContent">  
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxReadOnlyBrush}"/>  
                                            </ObjectAnimationUsingKeyFrames> 
                                        </Storyboard> 
                                    </VisualState> 
                                </VisualStateGroup> 
                                <VisualStateGroup x:Name="FocusStates">  
                                    <VisualState x:Name="Focused"/>  <!-- *** Right here is your culprit, I just ripped out the FocusedState Storyboard so it doesnt do anything when focused. *** -->

                                    <VisualState x:Name="Unfocused"/>  
                                </VisualStateGroup> 
                            </VisualStateManager.VisualStateGroups> 
                            <Border x:Name="EnabledBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="{StaticResource PhoneTouchTargetOverhang}">  
                                <ContentControl x:Name="ContentElement" BorderThickness="0" HorizontalContentAlignment="Stretch" Margin="{StaticResource PhoneTextBoxInnerMargin}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="Stretch"/>  
                            </Border> 
                            <Border x:Name="DisabledOrReadonlyBorder" BorderBrush="{StaticResource PhoneDisabledBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="Transparent" Margin="{StaticResource PhoneTouchTargetOverhang}" Visibility="Collapsed">  
                                <TextBox x:Name="DisabledOrReadonlyContent" Background="Transparent" Foreground="{StaticResource PhoneDisabledBrush}" FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" IsReadOnly="True" SelectionForeground="{TemplateBinding SelectionForeground}" SelectionBackground="{TemplateBinding SelectionBackground}" TextAlignment="{TemplateBinding TextAlignment}" TextWrapping="{TemplateBinding TextWrapping}" Text="{TemplateBinding Text}" Template="{StaticResource PhoneDisabledTextBoxTemplate}"/>  
                            </Border> 
                        </Grid> 
                    </ControlTemplate> 
                </Setter.Value> 
            </Setter> 
        </Style>

默认情况下，您也可以使用BasedOn值将相同的模板应用于所有TextBox控件。

还有其他方法可以减少这种情况，但这是开始学习基础知识的好地方。希望它有所帮助。

Answer 2

更容易！

    private void TextBox1_GotFocus(object sender, RoutedEventArgs e)
    {
        TextBox tb = (TextBox)sender;
        tb.Background = new SolidColorBrush(Colors.Transparent);
        tb.BorderBrush = new SolidColorBrush(Colors.Transparent);
        tb.SelectionBackground = new SolidColorBrush(Colors.Transparent);
    }

    private void TextBox1_LostFocus(object sender, RoutedEventArgs e)
    {
        TextBox tb = (TextBox)sender;
        tb.Background = new SolidColorBrush(Colors.Transparent);
        tb.BorderBrush = new SolidColorBrush(Colors.Transparent);
        tb.SelectionBackground = new SolidColorBrush(Colors.Transparent);
    }

它的效果非常好!!

Answer 3

您所描述的是视觉状态。

当文本框获得焦点时，它会在内部触发视觉状态更改，在这种情况下包括白色背景。

看起来你在WP7工作，所以有几个地方你可以开始学习控制模板，样式以及如何更改它们。

首先查看有关控制模板的this article。

您会发现Silverlight 4相关的任何内容都是相关的。

第二get a copy of Expression Blend for Windows Phone。启动一个新的WP7项目，将TextBox拖到您的设计图面上，右键单击TextBox并选择Edit Template。然后你会开始看到改变所述视觉状态是多么容易。

Answer 4

看起来您想要点击来编辑样式。在Click-to-edit control - how to do it?帖子中有一个带有xaml代码的Silverlight示例。

解决文本框背景焦点问题

4 个答案: