XAML C# WinUI3修改AutosuggestBox

我试图修改标准的AutoSuggestBox的方式，列表视图弹出大于文本框本身：

的数据
不幸的是我被困住了我试着创建自己的风格定义：
（标准版本来自Blend）

<Style x:Key="AutoSuggestBoxStyle1" 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">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="Orientation">
                                <VisualState x:Name="Landscape"/>
                                <VisualState x:Name="Portrait"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <TextBox x:Name="TextBox"
                                 ScrollViewer.BringIntoViewOnFocusChange="False"
                                 DesiredCandidateWindowAlignment="BottomEdge"
                                 Description="{TemplateBinding Description}"
                                 Header="{TemplateBinding Header}"
                                 Margin="0"
                                 PlaceholderText="{TemplateBinding PlaceholderText}"
                                 Style="{TemplateBinding TextBoxStyle}"
                                 UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}"
                                 Width="{TemplateBinding Width}"
                                 Canvas.ZIndex="0"/>
                        <Popup x:Name="SuggestionsPopup">
                            <Border x:Name="SuggestionsContainer">
                                <ListView x:Name="SuggestionsList"
                                          Background="{ThemeResource AutoSuggestBoxSuggestionsListBackground}"
                                          BorderBrush="{ThemeResource AutoSuggestBoxSuggestionsListBorderBrush}"
                                          BorderThickness="{ThemeResource AutoSuggestListBorderThemeThickness}"
                                          DisplayMemberPath="{TemplateBinding DisplayMemberPath}"
                                          ItemTemplate="{TemplateBinding ItemTemplate}"
                                          ItemContainerStyle="{TemplateBinding ItemContainerStyle}"
                                          ItemTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                                          IsItemClickEnabled="True"
                                          Margin="{ThemeResource AutoSuggestListMargin}"
                                          MaxHeight="{ThemeResource AutoSuggestListMaxHeight}"
                                          Padding="{ThemeResource AutoSuggestListPadding}"/>
                            </Border>
                        </Popup>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
</Style>

字符串
我的版本：

<Style x:Key="AutoSuggestBoxStyle1" 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">
                    <StackPanel x:Name="LayoutRoot">
                        
                        <TextBox x:Name="TextBox"
                                 ScrollViewer.BringIntoViewOnFocusChange="False"
                                 DesiredCandidateWindowAlignment="BottomEdge"
                                 Description="{TemplateBinding Description}"
                                 Header="{TemplateBinding Header}"
                                 Margin="0"
                                 PlaceholderText="{TemplateBinding PlaceholderText}"
                                 Style="{TemplateBinding TextBoxStyle}"
                                 UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}"
                                 Width="100"
                                 Canvas.ZIndex="0"/>
                        <Popup x:Name="SuggestionsPopup">
                            <Border x:Name="SuggestionsContainer" Width="250">
                                <ListView x:Name="SuggestionsList"
                                          Background="{ThemeResource AutoSuggestBoxSuggestionsListBackground}"
                                          BorderBrush="{ThemeResource AutoSuggestBoxSuggestionsListBorderBrush}"
                                          BorderThickness="{ThemeResource AutoSuggestListBorderThemeThickness}"
                                          DisplayMemberPath="{TemplateBinding DisplayMemberPath}"
                                          ItemTemplate="{TemplateBinding ItemTemplate}"
                                          ItemContainerStyle="{TemplateBinding ItemContainerStyle}"
                                          ItemTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                                          IsItemClickEnabled="True"
                                          Margin="{ThemeResource AutoSuggestListMargin}"
                                          MaxHeight="{ThemeResource AutoSuggestListMaxHeight}"
                                          Padding="{ThemeResource AutoSuggestListPadding}"/>
                            </Border>
                        </Popup>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
</Style>

型
不幸的是，Popupwidth总是与TextBox一样宽
然后我尝试创建自己的自定义控件，并尝试重建AutoSuggestBox的功能。
现在我不知道如何从AutoSuggestBox中使用的样式化TextBox中获取XAML元素

<Setter Property="TextBoxStyle" Value="{StaticResource AutoSuggestBoxTextBoxStyle}"/>

型
我想访问样式化的TextBox的各个部分，以添加一些功能，并将QueryIcon添加到相关的Button

<Style x:Key="AutoSuggestBoxTextBoxStyle" TargetType="TextBox">
        <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}"/>
        <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}"/>
        <Setter Property="Foreground" Value="{ThemeResource TextControlForeground}"/>
        <Setter Property="Background" Value="{ThemeResource TextControlBackground}"/>
        <Setter Property="BorderBrush" Value="{ThemeResource TextControlBorderBrush}"/>
        <Setter Property="SelectionHighlightColor" Value="{ThemeResource TextControlSelectionHighlightColor}"/>
        <Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}"/>
        <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
        <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
        <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="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TextBox">
                    <Grid>
                        ...
                        <Border x:Name="BorderElement" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="3" Grid.RowSpan="1" Grid.Row="1"/>
                        <ContentPresenter x:Name="HeaderContentPresenter" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Grid.ColumnSpan="3" Foreground="{ThemeResource TextControlHeaderForeground}" FontWeight="Normal" Margin="{ThemeResource AutoSuggestBoxTopHeaderMargin}" Grid.Row="0" TextWrapping="Wrap" Visibility="Collapsed" x:DeferLoadStrategy="Lazy"/>
                        <ScrollViewer x:Name="ContentElement" AutomationProperties.AccessibilityView="Raw" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" IsTabStop="False" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" Grid.Row="1" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" ZoomMode="Disabled"/>
                        <ContentControl x:Name="PlaceholderTextContentPresenter" Content="{TemplateBinding PlaceholderText}" Grid.ColumnSpan="3" Foreground="{ThemeResource TextControlPlaceholderForeground}" IsTabStop="False" IsHitTestVisible="False" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" Grid.Row="1"/>
                        <Button x:Name="DeleteButton" AutomationProperties.AccessibilityView="Raw" BorderThickness="{TemplateBinding BorderThickness}" Grid.Column="1" FontSize="{TemplateBinding FontSize}" IsTabStop="False" MinWidth="34" Grid.Row="1" Style="{StaticResource DeleteButtonStyle}" VerticalAlignment="Stretch" Visibility="Collapsed"/>
                        <Button x:Name="QueryButton" AutomationProperties.AccessibilityView="Raw" BorderThickness="{TemplateBinding BorderThickness}" Grid.Column="2" FontSize="{TemplateBinding FontSize}" IsTabStop="False" MinWidth="34" Grid.Row="1" Style="{StaticResource QueryButtonStyle}" VerticalAlignment="Stretch" Width="{TemplateBinding Height}"/>
                        <ContentPresenter x:Name="DescriptionPresenter" AutomationProperties.AccessibilityView="Raw" Content="{TemplateBinding Description}" Grid.ColumnSpan="3" Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}" Grid.Row="2" x:Load="False"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
</Style>

型
然后在函数override void OnApplyTemplate()中，我可以从我自己的样式模板中获取元素，但我不知道如何从文本框样式中获取元素？

public sealed class CustomControl1 : Control
{
    public CustomControl1()
    {
        this.DefaultStyleKey = typeof(CustomControl1);
    }

    private Popup popup;
    private TextBox textbox;

    protected override void OnApplyTemplate()
    {
        textbox = GetTemplateChild("QueryTextBox") as TextBox;
        popup = GetTemplateChild("SuggestionsPopup") as Popup;

        base.OnApplyTemplate();
    }
}

型
任何帮助将不胜感激。或者你知道AutoSuggestBox的源代码是否在GitHub上可用吗？

XAML C# WinUI3修改AutosuggestBox

1条答案

相关问题

热门标签

最新问答