如何在Windows Phone 8.1中更改文本框中文本的垂直对齐方式

Question

如何设置在 TextBox 中输入的文本的 VerticalAlignment。由于 TextBox 只有用于水平对齐的 TextAlignment 属性，因此需要进行特殊处理。

XAML：

<TextBox MinWidth="300" MinHeight="45" TextAlignment="Left" VerticalAlignment="Center"/>

编辑

添加VerticalContentAlignment属性后，XAML如下：

<TextBox VerticalContentAlignment="Center" />
<TextBox  VerticalContentAlignment="Bottom"/>
<PasswordBox VerticalContentAlignment="Stretch"/>

输出:

很明显，VerticalContentAlignment 属性并未生效。我是否漏掉了什么？

- Ankush Madankar

---

@w.b 我认为将设置填充选项仅用于设置垂直边距。 - Ankush Madankar

VerticalContentAlignment - Chris W.

@ChrisW。看起来VerticalContentAlignment不起作用！ - Ankush Madankar

看起来你是对的，如果我们去查看默认样式模板，可以发现它们确实没有像文档中所说那样绑定属性（想象一下）。因此，你可以在样式模板中的ContentControl中添加VerticalAlignment={TemplateBinding VerticalContentAlignment}。 - Chris W.

你能解决这个问题吗？ - udi

Answer 1

我有你所祈求的答案.. :-) 你所要做的就是简单地更改TextBox的默认样式...由于你移除了滚动条，我猜想不可能使用多行..虽然我并不需要那个功能... :)

原始的TextBox样式:

 <!-- 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="SelectionHighlightColor" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" />
    <Setter Property="Background" Value="{ThemeResource TextBoxBackgroundThemeBrush}" />
    <Setter Property="BorderBrush" Value="{ThemeResource TextBoxBorderThemeBrush}" />
    <Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}" />
    <Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}" />
    <Setter Property="FontSize" Value="{ThemeResource ContentControlFontSize}" />
    <Setter Property="TextWrapping" Value="NoWrap" />
    <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" />
    <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" />
    <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="Margin" Value="{ThemeResource TextControlMarginThemeThickness}" />
    <Setter Property="VerticalAlignment" Value="Top" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TextBox">
                <Grid Background="Transparent">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement"
                                                                   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>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderContentPresenter"
                                                                   Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0"
                                                                Value="{ThemeResource TextBoxDisabledHeaderForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Normal">
                                <Storyboard>
                                    <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="BorderElement"
                                                                   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="BorderElement" Grid.Row="1" Background="{TemplateBinding Background}"
                            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>
        </Setter.Value>
    </Setter>
</Style>

新样式：

<Style x:Key="ContentCenteredTextBox" TargetType="TextBox">
    <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}" />
    <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}" />
    <Setter Property="Foreground" Value="{ThemeResource TextBoxForegroundThemeBrush}" />
    <Setter Property="SelectionHighlightColor" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" />
    <Setter Property="Background" Value="{ThemeResource TextBoxBackgroundThemeBrush}" />
    <Setter Property="BorderBrush" Value="{ThemeResource TextBoxBorderThemeBrush}" />
    <Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}" />
    <Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}" />
    <Setter Property="FontSize" Value="{ThemeResource ContentControlFontSize}" />
    <Setter Property="TextWrapping" Value="NoWrap" />
    <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" />
    <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" />
    <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="VerticalContentAlignment" Value="Center"></Setter>
    <Setter Property="Margin" Value="{ThemeResource TextControlMarginThemeThickness}" />
    <Setter Property="VerticalAlignment" Value="Center" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TextBox">
                <Grid Background="Transparent">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement"
                                                                   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>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderContentPresenter"
                                                                   Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0"
                                                                Value="{ThemeResource TextBoxDisabledHeaderForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Normal">
                                <Storyboard>
                                    <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="BorderElement"
                                                                   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="BorderElement" Grid.Row="1" Background="{TemplateBinding Background}"
                            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}" />
                    <ContentControl x:Name="ContentElement" Grid.Row="1"
                                  MinHeight="{ThemeResource TextControlThemeMinHeight}"
                                   VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                  Margin="{TemplateBinding BorderThickness}"
                                    Padding="{TemplateBinding Padding}"
                                   IsTabStop="False"
                                  AutomationProperties.AccessibilityView="Raw" />
                    <ContentControl x:Name="PlaceholderTextContentPresenter" Grid.Row="1"
                                    Foreground="{ThemeResource TextBoxPlaceholderTextThemeBrush}"
                                    FontSize="{ThemeResource ContentControlFontSize}"
                                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                    Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"
                                    IsTabStop="False" Content="{TemplateBinding PlaceholderText}" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

不用谢 :-)

- Alfetch

---

一个非常简单的成就需要经历一个极其复杂的过程。 - Hendra Anggrian