Блог

Я впервые создаю приложение UWP и сталкиваюсь со странной проблемой, когда нижняя граница текстового поля исчезает, если высота текстового поля меньше 32 (размер текстового поля по умолчанию).

Я хочу, чтобы текстовое поле имело высоту 25, а не 32. Итак, что мне следует сделать, чтобы сохранить нижнюю границу текстового поля и размер текстового поля равным 25?

Короче говоря, вам нужно создать пользовательский стиль для вашего текстового поля.

Шаги: Перейдите к «Структура документа -> Щелкните правой кнопкой мыши текстовое поле -> Редактировать шаблон -> Редактировать копию».

Затем найдите <Border x:Name="BorderElement"> элемент в этом стиле и задайте для него MinHeight тот, который вы хотите.

 <Page.Resources>
    <Style x:Key="TextBoxStyle1" TargetType="TextBox">
        ...
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TextBox">
                    <Grid>
                        ...
                        <ContentPresenter x:Name="HeaderContentPresenter" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Grid.ColumnSpan="2" Grid.Column="0" FontWeight="Normal" Foreground="{ThemeResource TextControlHeaderForeground}" Margin="{StaticResource TextBoxTopHeaderMargin}" Grid.Row="0" TextWrapping="Wrap" VerticalAlignment="Top" Visibility="Collapsed" x:DeferLoadStrategy="Lazy" />
                        <Border x:Name="BorderElement" MinHeight="25" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}" Grid.ColumnSpan="2" Grid.Column="0" Control.IsTemplateFocusTarget="True"  MinWidth="{ThemeResource TextControlThemeMinWidth}" Grid.RowSpan="1" Grid.Row="1" />
                        <ScrollViewer x:Name="ContentElement" AutomationProperties.AccessibilityView="Raw" Grid.Column="0" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsTabStop="False" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" Grid.Row="1" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" ZoomMode="Disabled" />
                        <TextBlock x:Name="PlaceholderTextContentPresenter" Grid.ColumnSpan="2" Grid.Column="0" Foreground="{Binding PlaceholderForeground, RelativeSource={RelativeSource Mode=TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForeground}}" IsHitTestVisible="False" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" Grid.Row="1" Text="{TemplateBinding PlaceholderText}" TextWrapping="{TemplateBinding TextWrapping}" TextAlignment="{TemplateBinding TextAlignment}" />
                        <Button x:Name="DeleteButton" AutomationProperties.AccessibilityView="Raw" BorderThickness="{TemplateBinding BorderThickness}" Grid.Column="1" FontSize="{TemplateBinding FontSize}" IsTabStop="False" MinWidth="34" Margin="{ThemeResource HelperButtonThemePadding}" Grid.Row="1" Style="{StaticResource DeleteButtonStyle}" VerticalAlignment="Stretch" Visibility="Collapsed" />
                        <ContentPresenter x:Name="DescriptionPresenter" AutomationProperties.AccessibilityView="Raw" Content="{TemplateBinding Description}" Grid.ColumnSpan="2" Grid.Column="0" Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}" Grid.Row="2" x:Load="False" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>
<Grid>
    <TextBox Style="{StaticResource TextBoxStyle1}" Height="25"></TextBox>
</Grid>
  

Пожалуйста, обратите внимание, что я меняю для него только минимальный размер, если вы введете его, вы обнаружите, что его текстовое отображение является неполным. Если вы хотите, чтобы это выглядело лучше. Вам нужно выполнить дополнительные настройки.

Пожалуйста, прочтите руководство: Создание пользовательских стилей и шаблонов управления для получения дополнительной информации.

Это регрессия в Windows 10 версии 1806 (сборка 17763). В предыдущей версии — Fall creators update (сборка 16299) этой проблемы не было.

Удаление MinWidth=»{ThemeResource TextControlThemeMinWidth}» для элемента границы в определении стиля текстового поля, как предлагалось выше, исправляет это.