如果其样式内的文本框的 AcceptsReturn 为 True,AutoSuggestBox 的行为会有所不同
AutoSuggestBox behaves differently if AcceptsReturn is True for the textbox inside its style
我有一个简单的 AutoSuggestBox
,其样式通过更改其中 TextBox
的几个属性进行了修改。
我修改的属性 AcceptsReturn
和 MinHeight
这是样式的修改部分
<Style TargetType="AutoSuggestBox">
<!-- -->
<TextBox x:Name="TextBox" Style="{TemplateBinding TextBoxStyle}" PlaceholderText="{TemplateBinding PlaceholderText}" Header="{TemplateBinding Header}" Width="{TemplateBinding Width}" AcceptsReturn="True" ScrollViewer.BringIntoViewOnFocusChange="False" Canvas.ZIndex="0" MinHeight="20" Margin="0" DesiredCandidateWindowAlignment="BottomEdge" UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}" />
<!-- -->
</Style>
这是我完整的示例代码
<Page
x:Class="TestApplication.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
<Style TargetType="AutoSuggestBox">
<Setter Property="VerticalAlignment" Value="Top" />
<Setter Property="IsTabStop" Value="False" />
<Setter Property="TextBoxStyle" Value="{StaticResource AutoSuggestBoxTextBoxStyle}" />
<Setter Property="UseSystemFocusVisuals" Value="{ThemeResource IsApplicationFocusVisualKindReveal}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="AutoSuggestBox">
<Grid x:Name="LayoutRoot">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="Orientation">
<VisualState x:Name="Landscape" />
<VisualState x:Name="Portrait" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBox x:Name="TextBox" Style="{TemplateBinding TextBoxStyle}" PlaceholderText="{TemplateBinding PlaceholderText}" Header="{TemplateBinding Header}" Width="{TemplateBinding Width}" AcceptsReturn="True" ScrollViewer.BringIntoViewOnFocusChange="False" Canvas.ZIndex="0" MinHeight="20" Margin="0" DesiredCandidateWindowAlignment="BottomEdge" UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}" />
<Popup x:Name="SuggestionsPopup">
<Border x:Name="SuggestionsContainer">
<ListView x:Name="SuggestionsList" Background="{ThemeResource AutoSuggestBoxSuggestionsListBackground}" BorderThickness="{ThemeResource AutoSuggestListBorderThemeThickness}" BorderBrush="{ThemeResource AutoSuggestBoxSuggestionsListBorderBrush}" DisplayMemberPath="{TemplateBinding DisplayMemberPath}" IsItemClickEnabled="True" ItemTemplate="{TemplateBinding ItemTemplate}" ItemTemplateSelector="{TemplateBinding ItemTemplateSelector}" ItemContainerStyle="{TemplateBinding ItemContainerStyle}" MaxHeight="{ThemeResource AutoSuggestListMaxHeight}" Margin="{ThemeResource AutoSuggestListMargin}" Padding="{ThemeResource AutoSuggestListPadding}" />
</Border>
</Popup>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<StackPanel>
<AutoSuggestBox x:Name="MyAutoSuggestBox" Margin="100" Text="{x:Bind Text, Mode=OneWay}" Width="200"/>
</StackPanel>
</Page>
Here's Sample GiF of What happens
从这个document,它提到我们通常设置 AcceptsReturn 和 TextWrapping 属性来制作多行文本盒子。因此,您可以像下面这样添加 TextWrapping 属性。
如果您不想添加 TextWrapping 属性,您可以在 Page.Loaded
事件中为 Text 设置一个值。当 AutoSuggestBox 加载并分配给文本 属性 时,它运行良好。
<Style TargetType="AutoSuggestBox">
<!-- -->
<TextBox x:Name="TextBox" TextWrapping="Wrap" Style="{TemplateBinding TextBoxStyle}" PlaceholderText="{TemplateBinding PlaceholderText}" Header="{TemplateBinding Header}" Width="{TemplateBinding Width}" AcceptsReturn="True" MinHeight="20" ScrollViewer.BringIntoViewOnFocusChange="False" Canvas.ZIndex="0" Margin="0" DesiredCandidateWindowAlignment="BottomEdge" UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}" />
<!-- -->
</Style>
我有一个简单的 AutoSuggestBox
,其样式通过更改其中 TextBox
的几个属性进行了修改。
我修改的属性 AcceptsReturn
和 MinHeight
这是样式的修改部分
<Style TargetType="AutoSuggestBox">
<!-- -->
<TextBox x:Name="TextBox" Style="{TemplateBinding TextBoxStyle}" PlaceholderText="{TemplateBinding PlaceholderText}" Header="{TemplateBinding Header}" Width="{TemplateBinding Width}" AcceptsReturn="True" ScrollViewer.BringIntoViewOnFocusChange="False" Canvas.ZIndex="0" MinHeight="20" Margin="0" DesiredCandidateWindowAlignment="BottomEdge" UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}" />
<!-- -->
</Style>
这是我完整的示例代码
<Page
x:Class="TestApplication.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
<Style TargetType="AutoSuggestBox">
<Setter Property="VerticalAlignment" Value="Top" />
<Setter Property="IsTabStop" Value="False" />
<Setter Property="TextBoxStyle" Value="{StaticResource AutoSuggestBoxTextBoxStyle}" />
<Setter Property="UseSystemFocusVisuals" Value="{ThemeResource IsApplicationFocusVisualKindReveal}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="AutoSuggestBox">
<Grid x:Name="LayoutRoot">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="Orientation">
<VisualState x:Name="Landscape" />
<VisualState x:Name="Portrait" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBox x:Name="TextBox" Style="{TemplateBinding TextBoxStyle}" PlaceholderText="{TemplateBinding PlaceholderText}" Header="{TemplateBinding Header}" Width="{TemplateBinding Width}" AcceptsReturn="True" ScrollViewer.BringIntoViewOnFocusChange="False" Canvas.ZIndex="0" MinHeight="20" Margin="0" DesiredCandidateWindowAlignment="BottomEdge" UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}" />
<Popup x:Name="SuggestionsPopup">
<Border x:Name="SuggestionsContainer">
<ListView x:Name="SuggestionsList" Background="{ThemeResource AutoSuggestBoxSuggestionsListBackground}" BorderThickness="{ThemeResource AutoSuggestListBorderThemeThickness}" BorderBrush="{ThemeResource AutoSuggestBoxSuggestionsListBorderBrush}" DisplayMemberPath="{TemplateBinding DisplayMemberPath}" IsItemClickEnabled="True" ItemTemplate="{TemplateBinding ItemTemplate}" ItemTemplateSelector="{TemplateBinding ItemTemplateSelector}" ItemContainerStyle="{TemplateBinding ItemContainerStyle}" MaxHeight="{ThemeResource AutoSuggestListMaxHeight}" Margin="{ThemeResource AutoSuggestListMargin}" Padding="{ThemeResource AutoSuggestListPadding}" />
</Border>
</Popup>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<StackPanel>
<AutoSuggestBox x:Name="MyAutoSuggestBox" Margin="100" Text="{x:Bind Text, Mode=OneWay}" Width="200"/>
</StackPanel>
</Page>
Here's Sample GiF of What happens
从这个document,它提到我们通常设置 AcceptsReturn 和 TextWrapping 属性来制作多行文本盒子。因此,您可以像下面这样添加 TextWrapping 属性。
如果您不想添加 TextWrapping 属性,您可以在 Page.Loaded
事件中为 Text 设置一个值。当 AutoSuggestBox 加载并分配给文本 属性 时,它运行良好。
<Style TargetType="AutoSuggestBox">
<!-- -->
<TextBox x:Name="TextBox" TextWrapping="Wrap" Style="{TemplateBinding TextBoxStyle}" PlaceholderText="{TemplateBinding PlaceholderText}" Header="{TemplateBinding Header}" Width="{TemplateBinding Width}" AcceptsReturn="True" MinHeight="20" ScrollViewer.BringIntoViewOnFocusChange="False" Canvas.ZIndex="0" Margin="0" DesiredCandidateWindowAlignment="BottomEdge" UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}" />
<!-- -->
</Style>