如何在带数据绑定的ComboBox中嵌入TextBox以支持自定义输入？

嗨，我来帮你搞定这个ComboBox支持自定义输入的需求！你已经设置了IsEditable="True"，这其实已经让ComboBox自带了可输入的TextBox，但可能需要调整绑定逻辑，确保用户输入的自定义值能正确同步到你的DesiredVersion属性里。下面是具体的优化方案：

1. 调整ComboBox的绑定配置 #

修改你的ComboBox代码，把Text属性和DesiredVersion做双向绑定（同时保留SelectedValue的单向绑定来兼容下拉选项选择），因为Text属性会直接反映用户输入的内容——不管这个值是否在Info数组里：

<ComboBox 
    ItemsSource="{Binding Info}" 
    DisplayMemberPath="Key" 
    SelectedValuePath="Key" 
    IsEditable="True" 
    SelectedIndex="{Binding SelectedIndex, Mode=OneWay}"
    Text="{Binding DesiredVersion, UpdateSourceTrigger=PropertyChanged}"
    SelectedValue="{Binding DesiredVersion, Mode=OneWay}"
>
</ComboBox>

这里的核心细节：

• Text="{Binding DesiredVersion, UpdateSourceTrigger=PropertyChanged}"：确保用户输入时实时更新DesiredVersion属性，不用等失去焦点才同步
• 保留SelectedValue的单向绑定，是为了当用户选择下拉列表里的选项时，也能把选中值同步到DesiredVersion

2. ViewModel层的逻辑处理 #

在你的ViewModel里，当DesiredVersion属性变化时，你可以判断这个值是否存在于Info数组中，从而区分是选择了预设值还是输入了自定义值：

private string _desiredVersion;
public string DesiredVersion
{
    get => _desiredVersion;
    set
    {
        if (_desiredVersion != value)
        {
            _desiredVersion = value;
            OnPropertyChanged(nameof(DesiredVersion));
            
            // 判断输入值是否在预设的Info数组中
            var isInPresetList = Info.Any(item => item.Key == value);
            if (!isInPresetList)
            {
                // 这里写自定义值的处理逻辑，比如保存到临时变量、触发自定义操作等
                Console.WriteLine($"用户输入了自定义版本：{value}");
            }
        }
    }
}

3. 可选：自定义ComboBox模板（个性化UI需求） #

如果默认的可编辑样式不符合你的UI设计，你可以自定义ComboBox的ControlTemplate，手动嵌入TextBox来完全控制样式：

<ComboBox 
    ItemsSource="{Binding Info}" 
    DisplayMemberPath="Key" 
    SelectedValuePath="Key" 
    IsEditable="True" 
    SelectedIndex="{Binding SelectedIndex, Mode=OneWay}"
    Text="{Binding DesiredVersion, UpdateSourceTrigger=PropertyChanged}"
>
    <ComboBox.Template>
        <ControlTemplate TargetType="ComboBox">
            <Grid>
                <!-- 必须保留PART_EditableTextBox这个命名元素，否则ComboBox编辑功能失效 -->
                <TextBox 
                    x:Name="PART_EditableTextBox"
                    Text="{TemplateBinding Text}"
                    Margin="2"
                    BorderThickness="1"
                    BorderBrush="#ccc"
                />
                <!-- 必须保留PART_Popup这个命名元素，否则下拉弹窗功能失效 -->
                <Popup
                    x:Name="PART_Popup"
                    Placement="Bottom"
                    IsOpen="{TemplateBinding IsDropDownOpen}"
                    AllowsTransparency="True"
                >
                    <Border 
                        Background="White"
                        BorderBrush="#ccc"
                        BorderThickness="1"
                        Width="{TemplateBinding ActualWidth}"
                        CornerRadius="0 0 4 4"
                    >
                        <ScrollViewer MaxHeight="200">
                            <ItemsPresenter />
                        </ScrollViewer>
                    </Border>
                </Popup>
            </Grid>
        </ControlTemplate>
    </ComboBox.Template>
</ComboBox>

这样调整后，用户既可以选择下拉列表里的预设选项，也能输入不在列表中的自定义值，并且输入的内容会正确同步到你的DesiredVersion属性中。

内容的提问来源于stack exchange，提问作者Schulze