【万里征程——Windows App开发】编辑文本及键盘输入

时间：2015-04-01 09:38:52 阅读：153 评论：0 收藏：0 [点我收藏+]

相信大家都会使用TextBox，但如果要让文本在TextBox中换行该怎么做呢？将TextWrapping属性设置为Wrap，将AcceptsReturn属性设置为True就好咯。

PasswordBox很明显就是一个密码框了，和其他的控件相比其有2个特殊之处，一个是其可以用MaxLength来控制最大的长度，一个是用PasswordChanged来捕捉密码的改名。显然比如QQ密码的MaxLength就是16位了，而PasswordChanged可以用来监测比如用户设置的密码和用户名是否相同。

大家在用电脑或者手机输入时偶尔键盘是出来的26字母拼音或是26字母英文亦或是10个数字对吧，那这个是怎么实现的呢？同样也是很简单的噢！直接在TextBox上用InputScope属性就好啦，比如有Default、TelephoneNumber、EmailSmtpAddress、Url、Search、Chat等可以设置哟。

（写到这里的时候忽然手机传来一则新闻，Surface 3发布了，这毫无征兆嘛，微软果然变得霸气了，我要加油了！）

除了在XAML中设置InputScope属性外，也可以在后台C#文件中设置。

InputScope inputScope = new InputScope();
InputScopeName inputScopeName= new InputScopeName();
inputScopeName.NameValue = InputScopeNameValue.TelephoneNumber;
inputScope.Names.Add(scopeName);
phoneNumberTtBox.InputScope = scope;

在这段代码中，phoneNumberTtBox是TextBox的名字哟，或者也可以简写这段代码的：

phoneNumberTtBox.InputScope = new InputScope() 
{
    Names = {new InputScopeName(InputScopeNameValue.TelephoneNumber)}
};

除此之外，我们还可以给RichEditBox控件设置IsSpellCheckEnabled属性让这个文本控件启用拼写检查。另外值得注意的是TextBox控件的拼写检查只在Windows Phone上启用，在Windows上市禁用的。（如果以后这个规则改变了，看到的童鞋记得留言让我修改哦。）而文本预测属性在TextBox和RichEditBox以及在Windows和Windows Phone上都是可用的哦，也就是IsTextPredictionEnabled。

下面分享几段PasswordBox样式表，来源于网络。
深色主题画笔

<SolidColorBrush x:Key="TextBoxBackgroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxBorderThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxButtonBackgroundThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverBackgroundThemeBrush" Color="#FFDEDEDE" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPressedBackgroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPressedBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonPressedForegroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxDisabledBackgroundThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxDisabledBorderThemeBrush" Color="#66FFFFFF" />
<SolidColorBrush x:Key="TextBoxDisabledForegroundThemeBrush" Color="#FF666666" />
<SolidColorBrush x:Key="TextBoxForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxForegroundHeaderThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxPlaceholderTextThemeBrush" Color="#AB000000" />
<SolidColorBrush x:Key="TextSelectionHighlightColorThemeBrush" Color="#FF4617B4"/>

浅色主题画笔

<SolidColorBrush x:Key="TextBoxBackgroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxBorderThemeBrush" Color="#A3000000" />
<SolidColorBrush x:Key="TextBoxButtonBackgroundThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverBackgroundThemeBrush" Color="#FFDEDEDE" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverForegroundThemeBrush" Color="Black" />
<SolidColorBrush x:Key="TextBoxButtonPressedBackgroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPressedBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonPressedForegroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxDisabledBackgroundThemeBrush" Color="#66CACACA" />
<SolidColorBrush x:Key="TextBoxDisabledBorderThemeBrush" Color="#26000000" />
<SolidColorBrush x:Key="TextBoxDisabledForegroundThemeBrush" Color="#FF666666" />
<SolidColorBrush x:Key="TextBoxForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxForegroundHeaderThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxPlaceholderTextThemeBrush" Color="#AB000000" />
<SolidColorBrush x:Key="TextSelectionHighlightColorThemeBrush" Color="#FF4617B4"/>

其他资源

<x:Double x:Key="TextControlBackgroundThemeOpacity">0.8</x:Double>
<x:Double x:Key="TextControlBorderThemeOpacity">0.8</x:Double>
<x:Double x:Key="TextControlPointerOverBackgroundThemeOpacity">0.87</x:Double>
<x:Double x:Key="TextControlPointerOverBorderThemeOpacity">0.87</x:Double>
<x:Double x:Key="TextControlThemeMinHeight">32</x:Double>
<x:Double x:Key="TextControlThemeMinWidth">64</x:Double>
<Thickness x:Key="TextControlBorderThemeThickness">2</Thickness>
<Thickness x:Key="TextControlThemePadding">10,3,10,5</Thickness>

共享资源

<FontFamily x:Key="SymbolThemeFontFamily">Segoe UI Symbol</FontFamily>
<FontFamily x:Key="ContentControlThemeFontFamily">Segoe UI</FontFamily>
<x:Double x:Key="ControlContentThemeFontSize">14.667</x:Double>

默认样式

<!-- Default style for Windows.UI.Xaml.Controls.PasswordBox -->
<Style TargetType="PasswordBox">
    <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}" />
    <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}" />
    <Setter Property="Foreground" Value="{ThemeResource TextBoxForegroundThemeBrush}" />
    <Setter Property="Background" Value="{ThemeResource TextBoxBackgroundThemeBrush}" />
    <Setter Property="SelectionHighlightColor" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" />
    <Setter Property="BorderBrush" Value="{ThemeResource TextBoxBorderThemeBrush}" />
    <Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}" />
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
    <Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="PasswordBox">
                <Grid>
                    <Grid.Resources>
                        <Style x:Name="RevealButtonStyle" TargetType="Button">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="Button">
                                        <Grid>
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" />
                                                    <VisualState x:Name="PointerOver">
                                                        <Storyboard>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundElement"
                                                                                           Storyboard.TargetProperty="Background">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPointerOverBackgroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement"
                                                                                           Storyboard.TargetProperty="BorderBrush">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPointerOverBorderThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GlyphElement"
                                                                                           Storyboard.TargetProperty="Foreground">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPointerOverForegroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundElement"
                                                                                           Storyboard.TargetProperty="Background">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPressedBackgroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement"
                                                                                           Storyboard.TargetProperty="BorderBrush">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPressedBorderThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GlyphElement"
                                                                                           Storyboard.TargetProperty="Foreground">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPressedForegroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Storyboard.TargetName="BackgroundElement"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="0"
                                                                             Duration="0" />
                                                            <DoubleAnimation Storyboard.TargetName="BorderElement"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="0"
                                                                             Duration="0" />
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Border x:Name="BorderElement"
                                                    BorderBrush="{ThemeResource TextBoxButtonBorderThemeBrush}"
                                                    BorderThickness="{TemplateBinding BorderThickness}"/>
                                            <Border x:Name="BackgroundElement"
                                                    Background="{ThemeResource TextBoxButtonBackgroundThemeBrush}"
                                                    Margin="{TemplateBinding BorderThickness}">
                                                <TextBlock x:Name="GlyphElement"
                                                           Foreground="{ThemeResource TextBoxButtonForegroundThemeBrush}"
                                                           VerticalAlignment="Center"
                                                           HorizontalAlignment="Center"
                                                           FontStyle="Normal"
                                                           Text="&#xE052;"
                                                           FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                                           AutomationProperties.AccessibilityView="Raw"/>
                                            </Border>
                                        </Grid>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </Grid.Resources>
                    <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="PointerOver">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="BackgroundElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     Duration="0"
                                                     To="{ThemeResource TextControlPointerOverBackgroundThemeOpacity}" />
                                    <DoubleAnimation Storyboard.TargetName="BorderElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     Duration="0"
                                                     To="{ThemeResource TextControlPointerOverBorderThemeOpacity}" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Focused" />
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="ButtonStates">
                            <VisualState x:Name="ButtonVisible">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RevealButton"
                                                                   Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="ButtonCollapsed" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <Border x:Name="BackgroundElement"
                            Grid.Row="1"
                            Background="{TemplateBinding Background}"
                            Margin="{TemplateBinding BorderThickness}"
                            Grid.ColumnSpan="2"
                            Grid.RowSpan="1"/>
                    <Border x:Name="BorderElement"
                            Grid.Row="1"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Grid.ColumnSpan="2"
                            Grid.RowSpan="1"/>
                    <ContentPresenter x:Name="HeaderContentPresenter"
                                      Grid.Row="0"
                                      Foreground="{ThemeResource TextBoxForegroundHeaderThemeBrush}"
                                      Margin="0,4,0,4"
                                      Grid.ColumnSpan="2"
                                      Content="{TemplateBinding Header}"
                                      ContentTemplate="{TemplateBinding HeaderTemplate}"
                                      FontWeight="Semilight" />
                    <ScrollViewer x:Name="ContentElement"
                            Grid.Row="1"
                                  HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                                  HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                                  VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                                  VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                                  IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                                  IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                                  Margin="{TemplateBinding BorderThickness}"
                                  Padding="{TemplateBinding Padding}"
                                  IsTabStop="False"
                                  ZoomMode="Disabled"
                                  AutomationProperties.AccessibilityView="Raw"/>
                    <ContentControl x:Name="PlaceholderTextContentPresenter"
                                  Grid.Row="1"
                                  Foreground="{ThemeResource TextBoxPlaceholderTextThemeBrush}"
                                  Margin="{TemplateBinding BorderThickness}"
                                  Padding="{TemplateBinding Padding}"
                                  IsTabStop="False"
                                  Grid.ColumnSpan="2"
                                  Content="{TemplateBinding PlaceholderText}" 
                                  IsHitTestVisible="False"/>
                    <Button x:Name="RevealButton"
                            Grid.Row="1"
                            Style="{StaticResource RevealButtonStyle}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            IsTabStop="False"
                            Grid.Column="1"
                            Visibility="Collapsed"
                            FontSize="{TemplateBinding FontSize}"
                            VerticalAlignment="Stretch"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

下面再分享几段RichEditBox样式表，同样来源于网络。
深色主题画笔

<SolidColorBrush x:Key="TextBoxBackgroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxBorderThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxDisabledBackgroundThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxDisabledBorderThemeBrush" Color="#66FFFFFF" />
<SolidColorBrush x:Key="TextBoxDisabledForegroundThemeBrush" Color="#FF666666" />
<SolidColorBrush x:Key="TextBoxForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxForegroundHeaderThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxPlaceholderTextThemeBrush" Color="#AB000000" />
<SolidColorBrush x:Key="TextSelectionHighlightColorThemeBrush" Color="#FF4617B4"/>

浅色主题画笔

<SolidColorBrush x:Key="TextBoxBackgroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxBorderThemeBrush" Color="#A3000000" />
<SolidColorBrush x:Key="TextBoxDisabledBackgroundThemeBrush" Color="#66CACACA" />
<SolidColorBrush x:Key="TextBoxDisabledBorderThemeBrush" Color="#26000000" />
<SolidColorBrush x:Key="TextBoxDisabledForegroundThemeBrush" Color="#FF666666" />
<SolidColorBrush x:Key="TextBoxForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxForegroundHeaderThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxPlaceholderTextThemeBrush" Color="#AB000000" />
<SolidColorBrush x:Key="TextSelectionHighlightColorThemeBrush" Color="#FF4617B4"/>

其他资源

<x:Double x:Key="TextControlBackgroundThemeOpacity">0.8</x:Double>
<x:Double x:Key="TextControlBorderThemeOpacity">0.8</x:Double>
<x:Double x:Key="TextControlPointerOverBackgroundThemeOpacity">0.87</x:Double>
<x:Double x:Key="TextControlPointerOverBorderThemeOpacity">0.87</x:Double>
<x:Double x:Key="TextControlThemeMinHeight">32</x:Double>
<x:Double x:Key="TextControlThemeMinWidth">64</x:Double>
<Thickness x:Key="TextControlBorderThemeThickness">2</Thickness>
<Thickness x:Key="TextControlThemePadding">10,3,10,5</Thickness>

共享资源


<FontFamily x:Key="SymbolThemeFontFamily">Segoe UI Symbol</FontFamily>
<FontFamily x:Key="ContentControlThemeFontFamily">Segoe UI</FontFamily>
<x:Double x:Key="ControlContentThemeFontSize">14.667</x:Double>

默认样式

<!-- Default style for System.Windows.Controls.RichEditBox -->
<Style TargetType="RichEditBox">
    <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}" />
    <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}" />
    <Setter Property="Foreground" Value="{ThemeResource TextBoxForegroundThemeBrush}" />
    <Setter Property="Background" Value="{ThemeResource TextBoxBackgroundThemeBrush}" />
    <Setter Property="SelectionHighlightColor" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" />
    <Setter Property="BorderBrush" Value="{ThemeResource TextBoxBorderThemeBrush}" />
    <Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}" />
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
    <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False" />
    <Setter Property="TextWrapping" Value="Wrap" />
    <Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="RichEditBox">
                <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="PointerOver">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="BackgroundElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     Duration="0"
                                                     To="{ThemeResource TextControlPointerOverBackgroundThemeOpacity}" />
                                    <DoubleAnimation Storyboard.TargetName="BorderElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     Duration="0"
                                                     To="{ThemeResource TextControlPointerOverBorderThemeOpacity}" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Focused" />
                        </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}"
                            Grid.ColumnSpan="2"
                            Grid.RowSpan="2"/>
                    <Border x:Name="BorderElement"
                            Grid.Row="1"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Grid.ColumnSpan="2"
                            Grid.RowSpan="1"/>
                    <ContentPresenter x:Name="HeaderContentPresenter"
                                      Grid.Row="0"
                                      Foreground="{ThemeResource TextBoxForegroundHeaderThemeBrush}"
                                      Margin="0,4,0,4"
                                      Grid.ColumnSpan="2"
                                      Content="{TemplateBinding Header}"
                                      ContentTemplate="{TemplateBinding HeaderTemplate}"
                                      FontWeight="Semilight" />
                    <ScrollViewer x:Name="ContentElement"
                                  Grid.Row="1"
                                  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}"
                                  Margin="{TemplateBinding BorderThickness}"
                                  Padding="{TemplateBinding Padding}"
                                  IsTabStop="False"
                                  Grid.ColumnSpan="2"
                                  Content="{TemplateBinding PlaceholderText}" 
                                  IsHitTestVisible="False"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

还有TextBox样式表，好多呀，又是来源于网络。（这一篇可真长哎，我转载不是为了凑字数哦，为了大家的控件更加美观啦。）
深色主题画笔

<SolidColorBrush x:Key="TextBoxBackgroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxBorderThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxButtonBackgroundThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverBackgroundThemeBrush" Color="#FFDEDEDE" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPressedBackgroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPressedBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonPressedForegroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxDisabledBackgroundThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxDisabledBorderThemeBrush" Color="#66FFFFFF" />
<SolidColorBrush x:Key="TextBoxDisabledForegroundThemeBrush" Color="#FF666666" />
<SolidColorBrush x:Key="TextBoxForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxForegroundHeaderThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxPlaceholderTextThemeBrush" Color="#AB000000" />
<SolidColorBrush x:Key="TextSelectionHighlightColorThemeBrush" Color="#FF4617B4"/>

浅色主题画笔

<SolidColorBrush x:Key="TextBoxBackgroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxBorderThemeBrush" Color="#A3000000" />
<SolidColorBrush x:Key="TextBoxButtonBackgroundThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverBackgroundThemeBrush" Color="#FFDEDEDE" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverForegroundThemeBrush" Color="Black" />
<SolidColorBrush x:Key="TextBoxButtonPressedBackgroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxButtonPressedBorderThemeBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxButtonPressedForegroundThemeBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="TextBoxDisabledBackgroundThemeBrush" Color="#66CACACA" />
<SolidColorBrush x:Key="TextBoxDisabledBorderThemeBrush" Color="#26000000" />
<SolidColorBrush x:Key="TextBoxDisabledForegroundThemeBrush" Color="#FF666666" />
<SolidColorBrush x:Key="TextBoxForegroundThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxForegroundHeaderThemeBrush" Color="#FF000000" />
<SolidColorBrush x:Key="TextBoxPlaceholderTextThemeBrush" Color="#AB000000" />
<SolidColorBrush x:Key="TextSelectionHighlightColorThemeBrush" Color="#FF4617B4"/>

其他资源

<x:Double x:Key="TextControlBackgroundThemeOpacity">0.8</x:Double>
<x:Double x:Key="TextControlBorderThemeOpacity">0.8</x:Double>
<x:Double x:Key="TextControlPointerOverBackgroundThemeOpacity">0.87</x:Double>
<x:Double x:Key="TextControlPointerOverBorderThemeOpacity">0.87</x:Double>
<x:Double x:Key="TextControlThemeMinHeight">32</x:Double>
<x:Double x:Key="TextControlThemeMinWidth">64</x:Double>
<Thickness x:Key="TextControlBorderThemeThickness">2</Thickness>
<Thickness x:Key="TextControlThemePadding">10,3,10,5</Thickness>

共享资源

<FontFamily x:Key="SymbolThemeFontFamily">Segoe UI Symbol</FontFamily>
<FontFamily x:Key="ContentControlThemeFontFamily">Segoe UI</FontFamily>
<x:Double x:Key="ControlContentThemeFontSize">14.667</x:Double>

默认样式

<!-- Default style for Windows.UI.Xaml.Controls.TextBox -->
<Style TargetType="TextBox">
    <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}" />
    <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}" />
    <Setter Property="Foreground" Value="{ThemeResource TextBoxForegroundThemeBrush}" />
    <Setter Property="Background" Value="{ThemeResource TextBoxBackgroundThemeBrush}" />
    <Setter Property="BorderBrush" Value="{ThemeResource TextBoxBorderThemeBrush}" />
    <Setter Property="SelectionHighlightColor" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" />
    <Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}" />
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
    <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False" />
    <Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TextBox">
                <Grid>
                    <Grid.Resources>
                        <Style x:Name="DeleteButtonStyle" TargetType="Button">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="Button">
                                        <Grid>
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" />
                                                    <VisualState x:Name="PointerOver">
                                                        <Storyboard>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundElement"
                                                                                           Storyboard.TargetProperty="Background">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPointerOverBackgroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement"
                                                                                           Storyboard.TargetProperty="BorderBrush">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPointerOverBorderThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GlyphElement"
                                                                                           Storyboard.TargetProperty="Foreground">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPointerOverForegroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundElement"
                                                                                           Storyboard.TargetProperty="Background">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPressedBackgroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement"
                                                                                           Storyboard.TargetProperty="BorderBrush">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPressedBorderThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GlyphElement"
                                                                                           Storyboard.TargetProperty="Foreground">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxButtonPressedForegroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Storyboard.TargetName="BackgroundElement"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="0"
                                                                             Duration="0" />
                                                            <DoubleAnimation Storyboard.TargetName="BorderElement"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="0"
                                                                             Duration="0" />
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Border x:Name="BorderElement"
                                                    BorderBrush="{ThemeResource TextBoxButtonBorderThemeBrush}"
                                                    BorderThickness="{TemplateBinding BorderThickness}"/>
                                            <Border x:Name="BackgroundElement"
                                                    Background="{ThemeResource TextBoxButtonBackgroundThemeBrush}"
                                                    Margin="{TemplateBinding BorderThickness}">
                                                <TextBlock x:Name="GlyphElement"
                                                           Foreground="{ThemeResource TextBoxButtonForegroundThemeBrush}"
                                                           VerticalAlignment="Center"
                                                           HorizontalAlignment="Center"
                                                           FontStyle="Normal"
                                                           Text="&#xE0A4;"
                                                           FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                                           AutomationProperties.AccessibilityView="Raw"/>
                                            </Border>
                                        </Grid>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </Grid.Resources>
                    <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="PointerOver">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="BackgroundElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     Duration="0"
                                                     To="{ThemeResource TextControlPointerOverBackgroundThemeOpacity}" />
                                    <DoubleAnimation Storyboard.TargetName="BorderElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     Duration="0"
                                                     To="{ThemeResource TextControlPointerOverBorderThemeOpacity}" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Focused" />
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="ButtonStates">
                            <VisualState x:Name="ButtonVisible">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DeleteButton"
                                                                   Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="ButtonCollapsed" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <Border x:Name="BackgroundElement"
                            Grid.Row="1"
                            Background="{TemplateBinding Background}"
                            Margin="{TemplateBinding BorderThickness}"
                            Grid.ColumnSpan="2"
                            Grid.RowSpan="1"/>
                    <Border x:Name="BorderElement"
                            Grid.Row="1"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Grid.ColumnSpan="2"
                            Grid.RowSpan="1"/>
                    <ContentPresenter x:Name="HeaderContentPresenter"
                                      Grid.Row="0"
                                      Foreground="{ThemeResource TextBoxForegroundHeaderThemeBrush}"
                                      Margin="0,4,0,4"
                                      Grid.ColumnSpan="2"
                                      Content="{TemplateBinding Header}"
                                      ContentTemplate="{TemplateBinding HeaderTemplate}"
                                      FontWeight="Semilight" />
                    <ScrollViewer x:Name="ContentElement"
                                  Grid.Row="1"
                                  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"
                                  AutomationProperties.AccessibilityView="Raw"
                                  ZoomMode="Disabled" />
                    <ContentControl x:Name="PlaceholderTextContentPresenter"
                                  Grid.Row="1"
                                  Foreground="{ThemeResource TextBoxPlaceholderTextThemeBrush}"
                                  Margin="{TemplateBinding BorderThickness}"
                                  Padding="{TemplateBinding Padding}"
                                  IsTabStop="False"
                                  Grid.ColumnSpan="2"
                                  Content="{TemplateBinding PlaceholderText}" 
                                  IsHitTestVisible="False"/>
                    <Button x:Name="DeleteButton"
                            Grid.Row="1"
                            Style="{StaticResource DeleteButtonStyle}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            IsTabStop="False"
                            Grid.Column="1"
                            Visibility="Collapsed"
                            FontSize="{TemplateBinding FontSize}"
                            VerticalAlignment="Stretch"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

【万里征程——Windows App开发】编辑文本及键盘输入

标签：windows app wp8 windows-phone-8 开发

原文地址：http://blog.csdn.net/nomasp/article/details/44787217

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行