Как создать собственный комбокс с всплывающим окном? - PullRequest
Новая
       7

Как создать собственный комбокс с всплывающим окном?

0 голосов
/ 04 апреля 2019

Всплывающее окно со списком всегда должно открываться ниже и показывать заголовок во всплывающем окне. Есть ли у них какой-нибудь способ сделать это. enter image description here

1 Ответ

0 голосов
/ 05 апреля 2019

Как добавить «Выберите заголовок» в этом всплывающем окне

Вы можете отредактировать стиль по умолчанию . «Перейти к -> Схема документа в Visual Studio -> Щелкните правой кнопкой мыши ваш ComboBox -> Изменить стиль -> Редактировать копию»

Вы можете увидеть элемент управления Popup (названный 'x: Name = "Popup"') в его шаблоне ControlTemplate.

Затем вы можете добавить в него TextBlock следующим образом: 

<Popup x:Name="Popup">
     <Border x:Name="PopupBorder" BackgroundSizing="OuterBorderEdge" Background="{ThemeResource ComboBoxDropDownBackground}" BorderThickness="{ThemeResource ComboBoxDropdownBorderThickness}" BorderBrush="{ThemeResource ComboBoxDropDownBorderBrush}" HorizontalAlignment="Stretch" Margin="0,-1,0,-1" Padding="{ThemeResource ComboBoxDropdownBorderPadding}">
           <StackPanel>
                <TextBlock Text="Selecte a Title"></TextBlock>
                <ScrollViewer x:Name="ScrollViewer" AutomationProperties.AccessibilityView="Raw" BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}" Foreground="{ThemeResource ComboBoxDropDownForeground}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" MinWidth="{Binding TemplateSettings.DropDownContentMinWidth, RelativeSource={RelativeSource Mode=TemplatedParent}}" VerticalSnapPointsType="OptionalSingle" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" VerticalSnapPointsAlignment="Near" ZoomMode="Disabled">
                <ItemsPresenter Margin="{ThemeResource ComboBoxDropdownContentMargin}" />
                </ScrollViewer>
           </StackPanel>
     </Border>
</Popup>

Как всегда открывать всплывающее окно под списком

С помощью комбинированного списка по умолчанию это невозможно. Так как состояние «открывать / закрывать» всплывающего окна контролируется в выделенном коде комбобокса, вы не можете его изменить. Но вы можете создать собственный элемент управления для достижения этого.

Например, вы можете обратиться к макету XAML в стиле по умолчанию и создать UserControl .

Вы можете проверить мой простой пример кода: 

<UserControl
x:Class="AppCombobox.MyComboBox"
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:local="using:AppCombobox"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="400">

<Grid>
    <Grid x:Name="LayoutRoot">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="32" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <TextBox x:Name="EditableText" Grid.Column="0" BorderBrush="Transparent" />
        <FontIcon
            x:Name="DropDownGlyph"
            Grid.Row="0"
            Grid.Column="1"
            Margin="0,10,10,10"
            HorizontalAlignment="Right"
            VerticalAlignment="Center"
            AutomationProperties.AccessibilityView="Raw"
            FontFamily="{ThemeResource SymbolThemeFontFamily}"
            FontSize="12"
            Foreground="{ThemeResource ComboBoxDropDownGlyphForeground}"
            Glyph="&#xE0E5;"
            IsHitTestVisible="False" />
        <Popup
            x:Name="Popup"
            Grid.Row="1"
            IsOpen="True">
            <Border
                x:Name="PopupBorder"
                Margin="0,-1,0,-1"
                HorizontalAlignment="Stretch"
                Background="{ThemeResource ComboBoxDropDownBackground}"
                BackgroundSizing="OuterBorderEdge"
                BorderBrush="{ThemeResource ComboBoxDropDownBorderBrush}"
                BorderThickness="{ThemeResource ComboBoxDropdownBorderThickness}"
                Padding="{ThemeResource ComboBoxDropdownBorderPadding}">
                <StackPanel>
                    <TextBlock Text="Selecte a Title" />
                    <ScrollViewer
                        x:Name="ScrollViewer"
                        AutomationProperties.AccessibilityView="Raw"
                        Foreground="{ThemeResource ComboBoxDropDownForeground}"
                        VerticalSnapPointsAlignment="Near"
                        VerticalSnapPointsType="OptionalSingle"
                        ZoomMode="Disabled">
                        <ListView Margin="{ThemeResource ComboBoxDropdownContentMargin}" x:Name="list"></ListView>
                    </ScrollViewer>
                </StackPanel>
            </Border>
        </Popup>
    </Grid>
</Grid>

Для конкретной кодовой логики вам необходимо кодировать ее самостоятельно в коде позади.

...