關於wpf中級聯下拉菜單的一些探索

先上效果圖：

（1）建立實體類

由於這個級聯菜單的實現用到了綁定機制，所以需要先聲明幾個實體類，每一個實體類都代表着一個下拉菜單。

 

    public class Country
    {
        private string countryName;
        private List<Province> provinceList;

        public Country(string countryName, List<Province> provinceList)
        {
            this.countryName = countryName;
            this.provinceList = provinceList;
        }
        public Country() { }

        public string CountryName
        {
            get
            {
                return countryName;
            }

            set
            {
                countryName = value;
            }
        }

        internal List<Province> ProvinceList
        {
            get
            {
                return provinceList;
            }

            set
            {
                provinceList = value;
            }
        }
    }


    public class Province
    {
        private string provinceName;

        private List<City> cityList;

        public Province(string provinceName, List<City> cityList)
        {
            this.provinceName = provinceName;
            this.cityList = cityList;
        }
        public Province() { }

        public string ProvinceName
        {
            get
            {
                return provinceName;
            }

            set
            {
                provinceName = value;
            }
        }

        public List<City> CountyList
        {
            get
            {
                return cityList;
            }

            set
            {
                cityList = value;
            }
        }

    }



    public class City
    {
        private string cityName;
        private List<County> countyList;

        public City(string cityName, List<County> countyList)
        {
            this.cityName = cityName;
            this.countyList = countyList;
        }
        public City() { }

        public string CityName
        {
            get
            {
                return cityName;
            }

            set
            {
                cityName = value;
            }
        }

        public List<County> CountyList
        {
            get
            {
                return countyList;
            }

            set
            {
                countyList = value;
            }
        }
    }


    public class County
    {
        private string countyName;

        public County(string countyName)
        {
            this.countyName = countyName;
        }
        public County() { }
        public string CountyName
        {
            get
            {
                return countyName;
            }

            set
            {
                countyName = value;
            }
        }
    }

 

這代表着級聯菜單一共有四個：國、省、市、縣，然後再加一個作爲容器Combobox，當然這也需要聲明一個類

    public class UserAddress : INotifyPropertyChanged
    {
        private string userCountry;
        private string userProvince;
        private string userCity;
        private string userCounty;

        public event PropertyChangedEventHandler PropertyChanged;
        public void OnPropertyChanged(PropertyChangedEventArgs e)
        {
            PropertyChanged?.Invoke(this, e);
        }
        public string UserCountry
        {
            get
            {
                return userCountry;
            }

            set
            {
                userCountry = value;
                OnPropertyChanged(new PropertyChangedEventArgs("FinallyAddress"));
            }
        }

        public string UserProvince
        {
            get
            {
                return userProvince;
            }

            set
            {
                userProvince = value;
                OnPropertyChanged(new PropertyChangedEventArgs("FinallyAddress"));
            }
        }

        public string UserCity
        {
            get
            {
                return userCity;
            }

            set
            {
                userCity = value;
                OnPropertyChanged(new PropertyChangedEventArgs("FinallyAddress"));
            }
        }

        public string UserCounty
        {
            get
            {
                return userCounty;
            }

            set
            {
                userCounty = value;
                OnPropertyChanged(new PropertyChangedEventArgs("FinallyAddress"));
            }
        }

        public string FinallyAddress
        {
            get
            {
                return String.Format("{0}：{1}：{2}：{3}",userCountry,userProvince,userCity,userCounty);
            }
        }
    }

 

這個類與上面的那些不同，它繼承於INotifyPropertyChanged接口，這也是必要的，這個機制主要是提供了更改通知功能。

 

（2）xaml代碼

                        <ComboBox x:Name="addr" Style="{StaticResource SearchComboBoxStyle}" Width="120"  Text="{Binding Path=FinallyAddress,Mode=OneWay}">
                            <ComboBoxItem>
                                <ComboBox x:Name="country" Width="100" Style="{StaticResource InsideComboBoxStyle}" DisplayMemberPath="CountryName"
                                          Text="{Binding Path=UserCountry,Mode=OneWayToSource}"/>
                            </ComboBoxItem>
                            <ComboBoxItem>
                                <ComboBox x:Name="province" Width="100" Style="{StaticResource InsideComboBoxStyle}"  Text="{Binding Path=UserProvince,Mode=OneWayToSource}" 
                                          DisplayMemberPath="ProvinceName" 
                                          ItemsSource="{Binding SelectedItem, ConverterParameter=province, Converter={StaticResource Convert}, ElementName=country}"/>
                            </ComboBoxItem>
                            <ComboBoxItem>
                                <ComboBox x:Name="city" Width="100" Style="{StaticResource InsideComboBoxStyle}" Text="{Binding Path=UserCity,Mode=OneWayToSource}" 
                                          DisplayMemberPath="CityName" 
                                          ItemsSource="{Binding SelectedItem, ConverterParameter=city, Converter={StaticResource Convert}, ElementName=province}"/>
                            </ComboBoxItem>
                            <ComboBoxItem>
                                <ComboBox x:Name="county" Width="100" Style="{StaticResource InsideComboBoxStyle}" Text="{Binding Path=UserCounty,Mode=OneWayToSource}" 
                                          DisplayMemberPath="CountyName" 
                                          ItemsSource="{Binding SelectedItem, ConverterParameter=county, Converter={StaticResource Convert}, ElementName=city}"/>
                            </ComboBoxItem>
                        </ComboBox>

下面的是用到的樣式和模板：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:MyQQ.resource.Style">
    <!-- Fill Brushes -->

    <LinearGradientBrush x:Key="NormalBrush" StartPoint="0,0" EndPoint="0,1">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#FFF" Offset="0.0"/>
                <GradientStop Color="#CCC" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="HorizontalNormalBrush" StartPoint="0,0" EndPoint="1,0">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#FFF" Offset="0.0"/>
                <GradientStop Color="#CCC" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="LightBrush" StartPoint="0,0" EndPoint="0,1">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#FFF" Offset="0.0"/>
                <GradientStop Color="#EEE" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="HorizontalLightBrush" StartPoint="0,0" EndPoint="1,0">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#FFF" Offset="0.0"/>
                <GradientStop Color="#EEE" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="DarkBrush" StartPoint="0,0" EndPoint="0,1">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#FFF" Offset="0.0"/>
                <GradientStop Color="#AAA" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="PressedBrush" StartPoint="0,0" EndPoint="0,1">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#BBB" Offset="0.0"/>
                <GradientStop Color="#EEE" Offset="0.1"/>
                <GradientStop Color="#EEE" Offset="0.9"/>
                <GradientStop Color="#FFF" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <SolidColorBrush x:Key="DisabledForegroundBrush" Color="#888" />

    <SolidColorBrush x:Key="DisabledBackgroundBrush" Color="#EEE" />

    <SolidColorBrush x:Key="WindowBackgroundBrush" Color="#FFF" />

    <SolidColorBrush x:Key="SelectedBackgroundBrush" Color="#DDD" />

    <!-- Border Brushes -->

    <LinearGradientBrush x:Key="NormalBorderBrush" StartPoint="0,0" EndPoint="0,1">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#CCC" Offset="0.0"/>
                <GradientStop Color="#444" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="HorizontalNormalBorderBrush" StartPoint="0,0" EndPoint="1,0">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#CCC" Offset="0.0"/>
                <GradientStop Color="#444" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="DefaultedBorderBrush" StartPoint="0,0" EndPoint="0,1">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#777" Offset="0.0"/>
                <GradientStop Color="#000" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="PressedBorderBrush" StartPoint="0,0" EndPoint="0,1">
        <GradientBrush.GradientStops>
            <GradientStopCollection>
                <GradientStop Color="#444" Offset="0.0"/>
                <GradientStop Color="#888" Offset="1.0"/>
            </GradientStopCollection>
        </GradientBrush.GradientStops>
    </LinearGradientBrush>

    <SolidColorBrush x:Key="DisabledBorderBrush" Color="#AAA" />

    <SolidColorBrush x:Key="SolidBorderBrush" Color="#888" />

    <SolidColorBrush x:Key="LightBorderBrush" Color="#AAA" />

    <!-- Miscellaneous Brushes -->
    <SolidColorBrush x:Key="GlyphBrush" Color="#444" />

    <SolidColorBrush x:Key="LightColorBrush" Color="#DDD" />
    <ControlTemplate x:Key="ComboBoxToggleButton" TargetType="ToggleButton">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="20" />
            </Grid.ColumnDefinitions>
            <Border
                x:Name="Border" 
                Grid.ColumnSpan="2"
                Background="Transparent"
                BorderBrush="{StaticResource NormalBorderBrush}"
                BorderThickness="0" />
            <Border 
                Grid.Column="0"
                Margin="1" 
                Background="{StaticResource WindowBackgroundBrush}" 
                BorderBrush="{StaticResource NormalBorderBrush}"
                BorderThickness="0" />
            <Path 
                x:Name="Arrow"
                Grid.Column="1"     
                Fill="{StaticResource GlyphBrush}"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Data="M 0 0 L 4 4 L 8 0 Z"/>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsEnabled" Value="False">
                <Setter TargetName="Border" Property="Background" Value="{StaticResource DisabledBackgroundBrush}" />
                <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DisabledBorderBrush}" />
                <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                <Setter TargetName="Arrow" Property="Fill" Value="{StaticResource DisabledForegroundBrush}" />
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <ControlTemplate x:Key="ComboBoxTextBox" TargetType="TextBox">
        <Border x:Name="PART_ContentHost" Focusable="False" Background="{TemplateBinding Background}" />
    </ControlTemplate>

    <Style x:Key="LoginComboBoxStyle" TargetType="ComboBox">
        <Setter Property="SnapsToDevicePixels" Value="true"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
        <Setter Property="Width" Value="220"/>
        <Setter Property="MinHeight" Value="20"/>
        <Setter Property="MaxDropDownHeight" Value="70"/>
        <Setter Property="IsEditable" Value="True"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBox">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Border x:Name="underline" Grid.ColumnSpan="2" BorderBrush="Black" BorderThickness="0,0,0,1" Opacity="0.3"/>
                        <Rectangle x:Name="img" VerticalAlignment="Top" HorizontalAlignment="Left" Opacity="0.5" Width="20" Height="20">
                            <Rectangle.Fill>
                                <ImageBrush ImageSource="../img/username.jpg"></ImageBrush>
                            </Rectangle.Fill>
                        </Rectangle>
                        <Grid Grid.Column="2">
                            <ToggleButton 
                            Name="ToggleButton" 
                            Template="{StaticResource ComboBoxToggleButton}" 
                            Grid.Column="2" 
                            Focusable="false" 
                            IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
                            ClickMode="Press"/>

                            <ContentPresenter
                            Name="ContentSite"
                            Grid.Column="2"
                            IsHitTestVisible="False" 
                            Content="{TemplateBinding SelectionBoxItem}"
                            ContentTemplate="{StaticResource ComboboxDisplay}"
                            ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                            Margin="3,3,23,3"
                            VerticalAlignment="Center"
                            HorizontalAlignment="Left" >
                            </ContentPresenter>
                            <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center" Visibility="Collapsed" Opacity="0.4"  Grid.Column="2" x:Name="mark" Text="{TemplateBinding Tag}"/>
                            <TextBox x:Name="PART_EditableTextBox"
                            Style="{x:Null}" 
                            Grid.Column="2" 
                            Template="{StaticResource ComboBoxTextBox}" 
                            HorizontalAlignment="Left" 
                            VerticalAlignment="Center" 
                            Margin="3,3,23,3"
                            Focusable="True" 
                            Background="Transparent"
                            Visibility="Hidden"
                            IsReadOnly="{TemplateBinding IsReadOnly}"/>
                            <Popup 
                            Name="Popup"
                            Grid.Column="2" 
                            Placement="Bottom"
                            IsOpen="{TemplateBinding IsDropDownOpen}"
                            AllowsTransparency="True" 
                            Focusable="False"
                            PopupAnimation="Slide">
                                <Grid 
                              Name="DropDown"
                              SnapsToDevicePixels="True"                
                              MinWidth="200"
                              MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                    <Border 
                                x:Name="DropDownBorder"
                                Background="{StaticResource WindowBackgroundBrush}"
                                BorderThickness="1"
                                BorderBrush="{StaticResource SolidBorderBrush}"/>
                                    <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True" Style="{StaticResource LeftScrollViewer}">
                                        <ItemsPresenter KeyboardNavigation.DirectionalNavigation="Contained" ></ItemsPresenter>
                                    </ScrollViewer>
                                </Grid>
                            </Popup>
                        </Grid>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="Text" Value="">
                            <Setter TargetName="mark" Property="Visibility" Value="Visible"/>
                        </Trigger>
                        <Trigger Property="IsFocused" Value="True">
                            <Setter TargetName="underline" Property="Border.BorderBrush" Value="Blue"/>
                        </Trigger>
                        <Trigger Property="HasItems" Value="false">
                            <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                        </Trigger>
                        <Trigger Property="IsGrouping" Value="true">
                            <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
                        </Trigger>
                        <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true">
                            <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4"/>
                            <Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/>
                        </Trigger>
                        <Trigger Property="IsEditable" Value="true">
                            <Setter Property="IsTabStop" Value="false"/>
                            <Setter TargetName="PART_EditableTextBox" Property="Visibility"    Value="Visible"/>
                            <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="ItemContainerStyle">
            <Setter.Value>
                <Style TargetType="ComboBoxItem">
                    <Setter Property="Background" Value="Snow"></Setter>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                                <ContentPresenter></ContentPresenter>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" Value="WhiteSmoke"></Setter>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="SearchComboBoxStyle" TargetType="ComboBox">
        <Setter Property="SnapsToDevicePixels" Value="true"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBox">
                    <Border BorderBrush="Black" BorderThickness="1" CornerRadius="3">
                        <Grid>
                            <ToggleButton 
            Name="ToggleButton" 
            Template="{StaticResource ComboBoxToggleButton}" 
            Grid.Column="2" 
            Focusable="false"
            IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
            ClickMode="Press">
                            </ToggleButton>
                            <ContentPresenter
            Name="ContentSite"
            IsHitTestVisible="False" 
            Content="{TemplateBinding Text}"
            ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
            ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
            Margin="3,3,23,3"
            VerticalAlignment="Center"
            HorizontalAlignment="Left" />
                            <TextBox x:Name="PART_EditableTextBox"
            Template="{StaticResource ComboBoxTextBox}" 
            HorizontalAlignment="Left" 
            VerticalAlignment="Center" 
            Margin="3,3,23,3"
            Focusable="True" 
            Background="Transparent"
            Visibility="Hidden"
            IsReadOnly="{TemplateBinding IsReadOnly}"/>
                            <Popup
            Name="Popup"
            Placement="Bottom"
            IsOpen="{TemplateBinding IsDropDownOpen}"
            AllowsTransparency="True" 
            Focusable="False"
            PopupAnimation="Slide">
                                <Grid 
              Name="DropDown"
              SnapsToDevicePixels="True"                
              MinWidth="{TemplateBinding ActualWidth}"
              MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                    <Border 
                x:Name="DropDownBorder"
                Background="{StaticResource WindowBackgroundBrush}"
                BorderThickness="1"
                BorderBrush="{StaticResource SolidBorderBrush}"/>
                                    <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
                                        <WrapPanel Width="220" IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
                                    </ScrollViewer>
                                </Grid>
                            </Popup>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="HasItems" Value="false">
                            <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                        </Trigger>
                        <Trigger Property="IsGrouping" Value="true">
                            <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
                        </Trigger>
                        <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true">
                            <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4"/>
                            <Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/>
                        </Trigger>
                        <Trigger Property="IsEditable"
               Value="true">
                            <Setter Property="IsTabStop" Value="false"/>
                            <Setter TargetName="PART_EditableTextBox" Property="Visibility"    Value="Visible"/>
                            <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="ItemContainerStyle">
            <Setter.Value>
                <Style TargetType="ComboBoxItem">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="ComboBoxItem">
                                <ContentPresenter/>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="InsideComboBoxStyle" TargetType="ComboBox">
        <Setter Property="SnapsToDevicePixels" Value="true"/>
        <Setter Property="Margin" Value="5"/>
        <Setter Property="MaxDropDownHeight" Value="60"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBox">
                    <Border BorderBrush="Black" BorderThickness="1" CornerRadius="3">
                        <Grid>
                            <ToggleButton 
            Name="ToggleButton" 
            Template="{StaticResource ComboBoxToggleButton}" 
            Grid.Column="2" 
            Focusable="false"
            IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
            ClickMode="Press">
                            </ToggleButton>
                            <ContentPresenter
            Name="ContentSite"
            IsHitTestVisible="False" 
            Content="{TemplateBinding SelectionBoxItem}"
            ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
            ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
            Margin="3,3,23,3"
            VerticalAlignment="Center"
            HorizontalAlignment="Left" />
                            <TextBox x:Name="PART_EditableTextBox"
            Style="{x:Null}" 
            Template="{StaticResource ComboBoxTextBox}" 
            HorizontalAlignment="Left" 
            VerticalAlignment="Center" 
            Margin="3,3,23,3"
            Focusable="True" 
            Background="Transparent"
            Visibility="Hidden"
            IsReadOnly="{TemplateBinding IsReadOnly}"/>
                            <Popup 
            Name="Popup"
            Placement="Bottom"
            IsOpen="{TemplateBinding IsDropDownOpen}"
            AllowsTransparency="True" 
            Focusable="False"
            PopupAnimation="Slide">
                                <Grid 
              Name="DropDown"
              SnapsToDevicePixels="True"         
              MinWidth="{TemplateBinding ActualWidth}"
              MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                    <Border 
                x:Name="DropDownBorder"
                Background="{StaticResource WindowBackgroundBrush}"
                BorderThickness="1"
                BorderBrush="{StaticResource SolidBorderBrush}"/>
                                    <ScrollViewer SnapsToDevicePixels="True" Style="{StaticResource LeftScrollViewer}">
                                        <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
                                    </ScrollViewer>
                                </Grid>
                            </Popup>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                        </Trigger>
                        <Trigger Property="IsGrouping" Value="true">
                            <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
                        </Trigger>
                        <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true">
                            <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4"/>
                            <Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/>
                        </Trigger>
                        <Trigger Property="IsEditable" Value="true">
                            <Setter Property="IsTabStop" Value="false"/>
                            <Setter TargetName="PART_EditableTextBox" Property="Visibility"    Value="Visible"/>
                            <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

 

這裏用到的樣式其實就兩個，但是我懶得去找了，就全部搬過來。

（3）後臺代碼

因爲只是簡單的示例，所以最後綁定的代碼很簡單：

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            addressCondition = new UserAddress();
            List<County> countys = new List<County>()
                        {
                            new County("縣")
                        };
            List<City> citys = new List<City>()
                        {
                            new City("市",countys)
                        };
            List<Province> proivnces = new List<Province>()
                        {
                            new Province("省",citys)
                        };
            List<Country> countrys = new List<Country>()
                        {
                            new Country("國",proivnces)
                        };
            country.ItemsSource = countrys;
            addr.DataContext = addressCondition;
        }

然後是這裏用到的一個值轉換器

<Window.Resources>
    <converter:CountryToProvincecs x:Key="Convert"/>
</Window.Resources>

    [ValueConversion(typeof(object), typeof(List<Province>))]
    public class CountryToProvincecs : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (value == null) return null;
            string key = parameter as string;
            switch (key)
            {
                case "province":
                    Country country = value as Country;
                    return country.ProvinceList;
                case "city":
                    Province province = value as Province;
                    return province.CountyList;
                case "county":
                    City city = value as City;
                    return city.CountyList;
                default:
                    return null;
            }
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }