修改ComboBox控件模板实例

<iframe align="top" marginwidth="0" marginheight="0" src="http://www.zealware.com/46860.html" frameborder="0" width="468" scrolling="no" height="60"></iframe>

WPF中自定义控件是可以通过修改控件模板很容易实现的，下面是一个ComboBox控件模板的实例。

定义一个SolidColorBrush

<solidcolorbrush x:key="SolidBorderBrush" color="#888"></solidcolorbrush>

定义ComboBox控件中TextBox控件的模板
<controltemplate x:key="ComboBoxTextBox" targettype="{x:Type TextBox}"><br><border x:name="PART_ContentHost" focusable="False" background="{TemplateBinding Background}"></border><br></controltemplate>

定义ComboBox控件中ToggleButton控件的模板
<controltemplate x:key="ComboBoxToggleButtonStyle" targettype="{x:Type ToggleButton}"><br><grid><br><grid.columndefinitions><br><columndefinition></columndefinition><br><columndefinition width="19"></columndefinition><br></grid.columndefinitions><br><border></border> x:Name="Border" <br> Grid.ColumnSpan="2"<br> CornerRadius="0"<br> BorderThickness="0"<br> BorderBrush="White"<br> FocusVisualStyle="{x:Null}" &gt;<br><border.background><br><solidcolorbrush color="#0000FF00"></solidcolorbrush><br></border.background><br><br><border></border> Grid.Column="0"<br> CornerRadius="0,0,0,0" <br> Margin="1" <br> BorderThickness="0" /&gt;<br><image></image> x:Name="Arrow"<br> Grid.Column="1"<br> Width ="14"<br> Height ="13" <br> Margin="6,6,0,0"<br> HorizontalAlignment="Left"<br> VerticalAlignment="Top"<br> /&gt;<br></grid><br></controltemplate>

定义ComboBox的风格，应用上面定义的各个模板
<style x:key="ComboBoxStyle" targettype="{x:Type ComboBox}"><br /> <Setter Property="SnapsToDevicePixels" Value="true"/><br /> <Setter Property="OverridesDefaultStyle" Value="true"/><br /> <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/><br /> <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/><br /> <Setter Property="ScrollViewer.CanContentScroll" Value="true"/><br /> <Setter Property="MinWidth" Value="120"/><br /> <Setter Property="MinHeight" Value="20"/><br /> <Setter Property="Template"><br /> <Setter.Value><br /> <ControlTemplate TargetType="{x:Type ComboBox}"><br /> <Grid><br /> <ToggleButton <br /> Name="ToggleButton" <br /> Template="{StaticResource ComboBoxToggleButtonStyle}" <br /> Grid.Column="2" <br /> Focusable="false"<br /> IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"<br /> ClickMode="Press"><br /> </ToggleButton><br /> <ContentPresenter<br /> Name="ContentSite"<br /> IsHitTestVisible="False" <br /> Content="{TemplateBinding SelectionBoxItem}"<br /> ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"<br /> ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"<br /> Margin="3,3,23,3"<br /> VerticalAlignment="Center"<br /> HorizontalAlignment="Left" /><br /> <TextBox x:Name="PART_EditableTextBox"<br /> Style="{x:Null}" <br /> Template="{StaticResource ComboBoxTextBox}" <br /> HorizontalAlignment="Left" <br /> VerticalAlignment="Center" <br /> Margin="3,3,23,3"<br /> Focusable="True" <br /> Background="White" <br /> Visibility="Visible" <br /> IsReadOnly="False"<br /> /><br /> <!--="{TemplateBinding IsReadOnly}"--><br /> <Popup <br /> Name="Popup"<br /> Placement="Bottom"<br /> IsOpen="{TemplateBinding IsDropDownOpen}"<br /> AllowsTransparency="True" <br /> Focusable="False"<br /> PopupAnimation="Slide"><br /> <Grid <br /> Name="DropDown"<br /> SnapsToDevicePixels="True" <br /> MinWidth="{TemplateBinding ActualWidth}"<br /> MaxHeight="{TemplateBinding MaxDropDownHeight}"><br /> <Border <br /> x:Name="DropDownBorder"<br /> BorderThickness="1"<br /> BorderBrush="{StaticResource SolidBorderBrush}"><br /> <Border.Background><br /> <SolidColorBrush Color="#cc336699" /><br /> </Border.Background><br /> </Border><br /> <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True"><br /> <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" /><br /> </ScrollViewer><br /> </Grid><br /> </Popup><br /> </Grid><br /> </ControlTemplate><br /> </Setter.Value><br /> </Setter><br /> <Style.Triggers><br /> <br /> </style>

使用上面定义的Style生成一个ComboBox控件

<combobox name="comboBoxNetwork" height="24" margin="50,50,0,0" verticalalignment="Top" width="204" borderthickness="0" fontfamily="Square721 Ex BT" fontsize="14" foreground="White" style="{StaticResource ComboBoxStyle}"></combobox>

Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1586159