<ui:Page
    x:Class="ModernWpf.SampleApp.ControlPages.ComboBoxPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:ui="http://schemas.modernwpf.com/2019"
    xmlns:sc="clr-namespace:SamplesCommon;assembly=SamplesCommon"
    xmlns:sys="clr-namespace:System;assembly=mscorlib"
    mc:Ignorable="d"
    DataContext="{Binding RelativeSource={RelativeSource Self}}">

    <ScrollViewer>
        <ui:SimpleStackPanel Style="{StaticResource ControlPageContentPanelStyle}">
            <sc:ControlExample HeaderText="A ComboBox with items defined inline and its width set.">
                <sc:ControlExample.Example>
                    <StackPanel>
                        <ComboBox
                            x:Name="Combo1"
                            SelectionChanged="ColorComboBox_SelectionChanged"
                            ui:ControlHelper.Header="Colors"
                            ui:ControlHelper.PlaceholderText="Pick a color"
                            Width="200">
                            <sys:String>Blue</sys:String>
                            <sys:String>Green</sys:String>
                            <sys:String>Red</sys:String>
                            <sys:String>Yellow</sys:String>
                        </ComboBox>
                        <Rectangle
                            x:Name="Control1Output"
                            Height="30"
                            Width="100"
                            Margin="0,8,0,0" />
                    </StackPanel>
                </sc:ControlExample.Example>
            </sc:ControlExample>

            <sc:ControlExample HeaderText="A ComboBox with its ItemsSource set.">
                <sc:ControlExample.Example>
                    <StackPanel>
                        <ComboBox
                            x:Name="Combo2"
                            ItemsSource="{Binding Fonts}"
                            DisplayMemberPath="Item1"
                            SelectedValuePath="Item2"
                            SelectedIndex="2"
                            ui:ControlHelper.Header="Font"
                            Width="200" />
                        <TextBlock
                            x:Name="Control2Output"
                            Text="You can set the font used for this text."
                            FontFamily="{Binding SelectedValue, ElementName=Combo2, Mode=OneWay}"
                            Style="{StaticResource OutputTextBlockStyle}" />
                    </StackPanel>
                </sc:ControlExample.Example>
            </sc:ControlExample>

            <sc:ControlExample HeaderText="An editable ComboBox.">
                <sc:ControlExample.Example>
                    <StackPanel>
                        <ComboBox
                            x:Name="Combo3"
                            IsEditable="True"
                            ItemsSource="{Binding FontSizes}"
                            SelectedIndex="2"
                            ui:ControlHelper.Header="Font Size"
                            Width="200" />
                        <TextBlock
                            x:Name="Control3Output"
                            Text="You can set the font size used for this text."
                            FontFamily="Segoe UI"
                            FontSize="{Binding SelectedValue, ElementName=Combo3, Mode=OneWay}"
                            Style="{StaticResource OutputTextBlockStyle}" />
                    </StackPanel>
                </sc:ControlExample.Example>
            </sc:ControlExample>

            <sc:ControlExample HeaderText="A virtualized ComboBox.">
                <sc:ControlExample.Example>
                    <ComboBox
                        x:Name="Combo4"
                        ui:ControlHelper.Header="Virtualized"
                        Width="200">
                        <ComboBox.ItemsPanel>
                            <ItemsPanelTemplate>
                                <VirtualizingStackPanel />
                            </ItemsPanelTemplate>
                        </ComboBox.ItemsPanel>
                    </ComboBox>
                </sc:ControlExample.Example>
            </sc:ControlExample>
        </ui:SimpleStackPanel>
    </ScrollViewer>
</ui:Page>
