WPF開發(fā)者QQ群：?340500857?

有小伙伴需要實(shí)現(xiàn)ComboBox下拉框帶水印，并且選擇Item內(nèi)容后水印默認(rèn)從中間到頂部。Item需要展示圖文，選擇后的數(shù)據(jù)展示圖文。

歡迎轉(zhuǎn)發(fā)、分享、點(diǎn)贊，謝謝大家~。

效果如下：

一、Xaml代碼如下

<Window.Resources><Style TargetType="ToggleButton" x:Key="ComboxStyleBtn"><Setter Property="Template"><Setter.Value><ControlTemplate><Border x:Name="Back" Background="Transparent"><Path Name="PathFill" Fill="Black" Width="10" Height="6" StrokeThickness="0" Data="M5,0 L10,10 L0,10 z" RenderTransformOrigin="0.5,0.5" Stretch="Fill"><Path.RenderTransform><TransformGroup><ScaleTransform/><SkewTransform/><RotateTransform Angle="180"/><TranslateTransform/></TransformGroup></Path.RenderTransform></Path></Border><ControlTemplate.Triggers><Trigger Property="IsMouseOver" Value="True"><Setter TargetName="PathFill" Property="Fill" Value="gray"></Setter></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter> </Style><Style TargetType="ComboBox" x:Key="ComboBoxStyle"><Setter Property="ItemContainerStyle"><Setter.Value><Style TargetType="ComboBoxItem"><Setter Property="MinHeight" Value="22"></Setter><Setter Property="MinWidth" Value="60"></Setter><Setter Property="Foreground" Value="Black"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="ComboBoxItem"><Border Name="Back" Background="White" BorderThickness="0,0,0,0" BorderBrush="#81D779" ><ContentPresenter ContentSource="{Binding Source}" VerticalAlignment="Center" HorizontalAlignment="Left"></ContentPresenter></Border><ControlTemplate.Triggers><Trigger Property="IsHighlighted" Value="True"><Setter TargetName="Back" Property="Background" Value="Pink"></Setter></Trigger><Trigger Property="IsSelected" Value="True"><Setter Property="Background" Value="Red" /></Trigger><Trigger Property="IsMouseOver" Value="True"><Setter Property="Background" Value="AliceBlue" /></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter> </Style></Setter.Value></Setter><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="ComboBox"><Grid><Grid.ColumnDefinitions><ColumnDefinition Width="0.7*"/><ColumnDefinition Width="0.3*" MaxWidth="30"/></Grid.ColumnDefinitions><TextBlock x:Name="_watermark" Text="已選擇emoji" Margin="60,6,0,0" Foreground="Gray" Grid.Column="0" VerticalAlignment="Top"></TextBlock><ContentPresenter Grid.Column="0"ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" Content="{TemplateBinding SelectionBoxItem}"VerticalAlignment="Center" Margin="2,10,0,0"></ContentPresenter><Border Grid.ColumnSpan="2" BorderBrush="#abadb3" BorderThickness="1"/><ToggleButton Grid.Column="1" Style="{StaticResource ComboxStyleBtn}" IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press"></ToggleButton><Popup IsOpen="{TemplateBinding IsDropDownOpen}" Placement="Bottom" x:Name="Popup" Focusable="False" AllowsTransparency="True" PopupAnimation="Slide" ><Border CornerRadius="1" BorderBrush="#5A5A5A" BorderThickness="1,0,1,1" Background="White" MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{TemplateBinding ActualWidth}" x:Name="DropDown" SnapsToDevicePixels="True"><Border.Effect><DropShadowEffect Color="Gray" BlurRadius="2" ShadowDepth="0" Opacity="1"/></Border.Effect><ScrollViewer Margin="0,0,0,0" SnapsToDevicePixels="True" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"><VirtualizingStackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" /></ScrollViewer></Border></Popup></Grid><ControlTemplate.Triggers><Trigger Property="Text" Value="{x:Null}"><Setter TargetName="_watermark" Property="VerticalAlignment" Value="Center"/><Setter TargetName="_watermark" Property="Margin" Value="10,0,0,0"/><Setter TargetName="_watermark" Property="Text" Value="請選擇emoji"/></Trigger><Trigger Property="Text" Value=""><Setter TargetName="_watermark" Property="VerticalAlignment" Value="Center"/><Setter TargetName="_watermark" Property="Margin" Value="10,0,0,0"/><Setter TargetName="_watermark" Property="Text" Value="請選擇emoji"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter></Style><DataTemplate x:Key="comboBoxItemDataTemplate"><WrapPanel><Image Source="{Binding ImagesPath}" Width="60" Height="60"/><TextBlock Text="{Binding Text}" VerticalAlignment="Center" Padding="4,0"/></WrapPanel></DataTemplate></Window.Resources><Grid><ComboBox Name="comboBoxArray"Width="200"Height="100"Style="{StaticResource ComboBoxStyle}" ItemTemplate="{StaticResource comboBoxItemDataTemplate}"></ComboBox></Grid>

二、Xaml.cs代碼如下

public partial class MainWindow : Window{public MainWindow(){InitializeComponent();var array = new List<ItemModel>();for (int i = 0; i < 11; i++){array.Add(new ItemModel { ImagesPath = new BitmapImage(new Uri(string.Format("pack://application:,,,/WpfComboBox;component/Images/{0}.png", i.ToString()))), Text = "Item" + i.ToString() });}this.comboBoxArray.ItemsSource = array;}}public class ItemModel{public ImageSource ImagesPath { get; set; }public string Text { get; set; }}

源碼地址QQ群->“文件”->“開源項(xiàng)目”->" 【水印+圖文】WpfComboBox.rar“

WPF開發(fā)者QQ群：?340500857?

blogs：?https://www.cnblogs.com/yanjinhua

Github：https://github.com/yanjinhuagood

出處：https://www.cnblogs.com/yanjinhua

版權(quán)：本作品采用「署名-非商業(yè)性使用-相同方式共享 4.0 國際」許可協(xié)議進(jìn)行許可。

轉(zhuǎn)載請著名作者 出處 https://github.com/yanjinhuagood

總結(jié)

以上是生活随笔為你收集整理的WPF实现下拉框带图文和水印的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。