wpf 实现combox 下拉展示和选中后的展示不同的效果
wpf样式代码
效果展示


样式代码
点击查看代码
<!-- 🔥 两列展示 + 可输入 + 无匹配保留 -->
<Style x:Key="TwoColumnComboBoxStyle" TargetType="ComboBox"
BasedOn="{StaticResource {x:Type ComboBox}}">
<Setter Property="IsEditable" Value="True"/>
<Setter Property="SelectedValuePath" Value="HgQydm"/>
<!-- 下拉项两列 -->
<Setter Property="ItemTemplate">
<Setter.Value>
<DataTemplate>
<Grid Margin="5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="130" />
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding HgQydm}" />
<TextBlock Grid.Column="1"
Text="{Binding ChangeDate, StringFormat=\{0:yyyy-MM-dd\}}" />
</Grid>
</DataTemplate>
</Setter.Value>
</Setter>
<!-- 自定义外观 -->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ComboBox">
<Grid>
<!-- 显示输入或选中的内容:用 Text -->
<Border Background="White"
BorderBrush="#CCC"
BorderThickness="1"
CornerRadius="3"
Padding="6">
<TextBlock Text="{Binding Text,
RelativeSource={RelativeSource TemplatedParent}}" />
</Border>
<!-- ▼ 按钮 -->
<ToggleButton x:Name="ToggleButton"
HorizontalAlignment="Right"
Width="18"
IsChecked="{Binding IsDropDownOpen,
RelativeSource={RelativeSource TemplatedParent}}"
ClickMode="Press"/>
<!-- Popup 保留 WPF 官方逻辑 -->
<Popup x:Name="PART_Popup"
Placement="Bottom"
AllowsTransparency="True"
Focusable="False"
IsOpen="{TemplateBinding IsDropDownOpen}">
<Border Background="White"
BorderBrush="#CCC"
BorderThickness="1">
<ScrollViewer>
<ItemsPresenter/>
</ScrollViewer>
</Border>
</Popup>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
model 以及 viewmodel
点击查看代码
using System;
using System.Collections.ObjectModel;
using System.ComponentModel;
using WpfApp45;
public class MainViewModel : INotifyPropertyChanged
{
private CompanyInfo _selectedCompany;
private string _selectedHgQydm;
private string _inputHgQydm;
public ObservableCollection<CompanyInfo> CompanyList { get; set; }
public CompanyInfo SelectedCompany
{
get => _selectedCompany;
set
{
_selectedCompany = value;
OnPropertyChanged(nameof(SelectedCompany));
}
}
public string SelectedHgQydm
{
get => _selectedHgQydm;
set
{
_selectedHgQydm = value;
OnPropertyChanged(nameof(SelectedHgQydm));
}
}
public string InputHgQydm
{
get => _inputHgQydm;
set
{
_inputHgQydm = value;
OnPropertyChanged(nameof(InputHgQydm));
}
}
public MainViewModel()
{
CompanyList = new ObservableCollection<CompanyInfo>()
{
new CompanyInfo{ HgQydm="342341211", ChangeDate=DateTime.Parse("2025-11-11").ToString(), ChangeOperator="Tom"},
new CompanyInfo{ HgQydm="888888888", ChangeDate=DateTime.Parse("2025-10-01").ToString(), ChangeOperator="Jerry"},
};
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string name)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
}
}
点击查看代码
public class CompanyInfo
{
public string HgQydm { get; set; }
public string ChangeDate { get; set; }
public string ChangeOperator { get; set; }
}

浙公网安备 33010602011771号