WPF TextBox 中的 ListBox - 芯片答案

【问题标题】：ListBox within WPF TextBox - ChipsWPF TextBox 中的 ListBox - 芯片
【发布时间】：2016-08-23 11:15:02
【问题描述】：

我需要在 TextBox 中添加 ListBox，即 CHIPS

参考屏幕截图：（期望）

只考虑视图模型：

public class Person
{
    private ObservableCollection<string> _personList = new ObservableCollection<string>();

    public ObservableCollection<string> PersonList
        {
            get { return _personList; }
            set
            {
                _personList = value;
                if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs("PersonList"));
            }
        }

    private string _personStr = String.Empty;

    public string PersonStr
        {
            get { return _personStr; }
            set
            {
                _personStr = value;
                if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs("PersonStr"));
            }
        }

    public Person()
        {
            PersonList.Add("IR-Punch");
            PersonList.Add("Stack-Overflow");
        }

    public ICommand BTextCommand
        {
            get
            {
                return new DelegateCommand(AppendString);
            }
        }

    public void AppendString()
        {
            PersonList.Add(PersonStr);
        }
}

有效的 XAML 源代码：

<ItemsControl ItemsSource="{Binding PersonList}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding }" TextWrapping="Wrap"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

<TextBox Text="{Binding PersonStr}" Width="160" VerticalAlignment="Center" />

<Button Command="{Binding BTextCommand}" Content="Add" />

请帮助我如何在TextBox 中添加ListBox。我照顾赛特尔。我期待核心思想。

【问题讨论】：

您可以尝试从代码后面并以编程方式在文本框中添加列表框
这就是我要问的想法如何写...
有点不清楚你在这里要求什么。您是说要开始在文本框中输入内容并在下拉菜单中显示选项列表吗？

标签： wpf xaml listbox wpf-controls custom-controls

【解决方案1】：

不要尝试在 TextBox 中嵌入额外的控件，而是将 ItemsControl 和 TextBox 嵌入到堆栈面板中，如下所示：

<Border BorderThickness="1">
    <ScrollViewer VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto">
        <StackPanel Orientation="Horizontal">
            <ItemsControl ItemsSource="{Binding PersonList}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding}"/>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
            <TextBox MinWidth="100" BorderBrush="Transparent" BorderThickness="0" Text="{Binding PersonStr}" />
        </StackPanel>
    </ScrollViewer>
</Border>

您需要将外部边框设置为看起来像一个文本框（几乎只是找到正确的 BorderBrush），但根据要求，我已将样式留给您。

请注意，我实际上并没有尝试过这个解决方案，只是把它写成一种应该可行的方法。如果您有任何问题，请告诉我。

【讨论】：

谢谢。我试试这个。