如何创建通用ListBox对话框控件

Question

的 Skip to answer to see how to implement the ListDialogBox

我有一个可重复使用的对话框/窗口，提示用户从列表框中选择一个项目，然后点击确定＆＃39; OK＆＃39;确认选择。

效果很好;但是，列表框并不知道它提前处理的数据类型。因此，列表绑定到ObservableCollection<Object>，可以由对话框的调用者设置。

此外，列表框还有一个自定义项模板，允许用户从列表中删除项目。

以下是我所描述的对话框：

理想情况下，我想利用DisplayMemberPath列表框，但我不允许，因为我正在创建自己的项目模板。这是一个问题，因为调用者应该能够指定他/她想要绑定到我已设置的自定义项模板的属性。

由于这种方法不起作用，我的第一个问题是：

1。我可以在运行时指定数据绑定值的路径吗？

在XAML中，我希望看到类似的东西，但这是错误的：

<ListBox.ItemTemplate>
    <Label Content="{Binding Path={Binding CustomPath}}"/>
    <Button Width="20" Height="20" FontWeight="Bold" Content="×"/>
</ListBox.ItemTemplate>

（为简洁起见省略了一些属性）

假设第一个问题已经解决，我还有另外一个问题。列表框使用非泛型类型Object，它不具有调用者想要绑定的属性。列表框无法将对象强制转换为自定义类型并访问所需的属性。这引出了我的第二个问题。

2。如何指示ListBox能够使用未知数据类型，但能够选择数据绑定值的路径？

也许这应留给SO上的另一个问题，但是能够指定绑定是否使用ToString()或属性是很好的。

---

我能想到的唯一解决方案是创建一个具有调用者必须使用的属性（名为DisplayText）的接口。然后该列表将绑定到ObservableCollection<CustomInterface>的实例。

但是，不希望将现有的数据类型包装到此接口中，这样才能正常工作。有更好的方法吗？

---

编辑：实施者如何使用ListDialogBox

以下是我希望调用者能够设置对话框（或类似简单的东西）：

public CustomItem PromptForSelection()
{
    ListDialogBox dialog = new ListDialogBox();
    dialog.Items = GetObservableCollection();
    dialog.ListDisplayMemberPath = "DisplayName";
    dialog.ShowDialog();
    if(!dialog.IsCancelled)
    {
        return (CustomItem) dialog.SelectedItem;
    }
}

public ObservableCollection<Object> GetObservableCollection()
{
    ObservableCollection<Object> coll = new ObservableCollection<Object>();

    CustomItem item = new CustomItem(); 
    item.DisplayName = "Item1";
    CustomItem item2 = new CustomerItem();
    item2.DisplayName = "Item2";
    //...

    coll.Add(item);
    coll.Add(item2);
    //...

    return coll;
}

代码无效，因为如果ObservableCollection<Object>用于ListDialogBox， DisplayName 属性没有意义。 这是因为Object没有定义该属性。

在ListDialogBox类中，我想将项目模板的标签绑定到 DisplayName 属性，因为这是提供的ListDisplayMemberPath值

我怎样才能克服这个？

Answer 1

此答案旨在解决原始问题中的问题，并提供了如何为将来的读者实施ListDialogBox的示例。

原始问题中的问题涉及能够指定如何在ListBox中显示信息。由于ListBox不知道它在运行时显示的数据类型，因此没有直接的方法来指定＆＃34;路径＆＃34;这指向所显示的所需属性。

这个问题的最简单的解决方案是创建一个ListDialogBox独占使用的接口，然后调用者只需要创建该接口的实例来自定义信息的显示方式。

此解决方案的唯一缺点是呼叫者需要提供他/她的数据以符合ListDialogBox;但是，这很容易实现。

<小时/>

如何创建和实施ListDialogBox：

ListDialogBox的目标是使OpenFileDialog或SaveFileDialog类似于初始化对话框，提示结果，然后处理结果。

首先，我将展示＆amp;解释ListDialogBox的代码（XAML和代码隐藏）。
下面的XAML已经过修剪，只显示对话框的结构和必要的属性。

<Window
    //You must specify the namespace that contains the the converters used by
    //this dialog
    xmlns:local="clr-namespace:<your-namespace>"
    //[Optional]: Specify a handler so that the ESC key closes the dialog.
    KeyDown="Window_KeyDown">
<Window.Resources>
    //These converters are used to control the dialog box.
    <BooleanToVisibilityConverter x:Key="BoolToVisibility"/>
    <local:NullToBooleanConverter x:Key="NullToBool"/>
</Window.Resources>
<Grid>
     //This displays a custom prompt which can be set by the caller.
    <TextBlock Text="{Binding Prompt}" TextWrapping="Wrap" />

    //The selection button is only enabled if a selection is made (non-null)
    <Button IsEnabled="{Binding Path=SelectedItem, 
                                ElementName=LstItems,
                                Converter={StaticResource NullToBool}}" 
        //Display a custom message for the select button.
        Content="{Binding SelectText}" 
        //Specify a handler to close the dialog when a selection is confirmed.
        Click="BtnSelect_Click" Name="BtnSelect" />

    //The cancel button specifies a handler to close the dialog.
    <Button Content=" Cancel" Name="BtnCancel" Click="BtnCancel_Click" />

    //This list box displays the items by using the 'INamedItem' interface
    <ListBox ItemsSource="{Binding Items}" Name="LstItems"        
             ScrollViewer.HorizontalScrollBarVisibility="Disabled">
        <ListBox.ItemContainerStyle>
            <Style TargetType="ListBoxItem">
                <Setter Property="HorizontalContentAlignment"  Value="Stretch"/>
            </Style>
        </ListBox.ItemContainerStyle>
        <ListBox.ItemTemplate>
            <DataTemplate>
                <DockPanel>

            <Button DockPanel.Dock="Right" 

            //The delete button is only available when the 'CanRemoveItems'
            //property  is true.  See usage for more details.
            Visibility="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, 
                                    Path=CanRemoveItems, 
                                    Converter={StaticResource BoolToVisibility}}" 
            //Visual properties for correctly displaying the red 'x'.
            //The 'x' is actually the multiplication symbol: '×'
            FontFamily="Elephant" Foreground="Red" FontWeight="Bold" FontStyle="Normal" 
            FontSize="18" Padding="0,-3,0,0" Content="×" 
            //[Optional]: Align button on the right end.
            HorizontalAlignment="Right" 
            //Specify handler that removes the item from the list (internally)
            Click="BtnRemove_Click" />

            //The DockPanel's last child fills the remainder of the template
            //with the one and only property from the INamedItem interface.
            <Label Content="{Binding DisplayName}"                          
                //[Optional]: This handler allows double-clicks to confirm selection.
                MouseDoubleClick="LstItem_MouseDoubleClick"/>

                </DockPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
</Grid>

NullToBooleanConverter与SO上的this answer基本相同。它用于根据ListBox.SelectedItem是null来启用/禁用确认选择按钮。此转换器的不同之处在于，当转换后的值为 NOT true时，它会返回null。

ListDialogBox Code-Behind：

此类定义调用者可以修改的所有属性以自定义方式 显示的ListDialogBox及其具有的功能。

public partial class ListDialogBox : Window, INotifyPropertyChanged
{   
    /* The DataContext of the ListDialogBox is itself.  It implements
     * INotifyPropertyChanged so that the dialog box bindings are updated when
     * the caller modifies the functionality.
     */
    public event PropertyChangedEventHandler PropertyChanged;
    protected void RaisePropertyChanged(string name)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(name));
        }
    }

    /* Optionally, the ListDialogBox provides a callback mechanism that allows
     * the caller to cancel the removal of any of the items.
     * See usage for more details.
     */
    public event RemoveItemEventHandler RemoveItem;
    protected void RaiseRemoveItem(RemoveItemEventArgs args)
    {
        if (RemoveItem != null)
        {
            RemoveItem(this, args);
        }
    }

    //Local copies of all the properties. (with default values)
    private string prompt = "Select an item from the list.";
    private string selectText = "Select";
    private bool canRemoveItems = false;
    private ObservableCollection<INamedItem> items;
    private INamedItem selectedItem = null;

    public ListDialogBox()
    {
        InitializeComponent();
        DataContext = this;  //The DataContext is itself.
    }

    /* Handles when an item is double-clicked.
     * The ListDialogBox.SelectedItem property is set and the dialog is closed.
     */
    private void LstItem_MouseDoubleClick(object sender, MouseButtonEventArgs e)
    {
        SelectedItem = ((FrameworkElement)sender).DataContext as INamedItem;
        Close();
    }

    /* Handles when the confirm selection button is pressed.
     * The ListDialogBox.SelectedItem property is set and the dialog is closed.
     */        
    private void BtnSelect_Click(object sender, RoutedEventArgs e)
    {
        SelectedItem = LstItems.SelectedItem as INamedItem;
        Close();
    }

    /* Handles when the cancel button is pressed.
     * The lsitDialogBox.SelectedItem remains null, and the dialog is closed.
     */
    private void BtnCancel_Click(object sender, RoutedEventArgs e)
    {
        Close();
    }

    /* Handles when any key is pressed.  Here we determine when the user presses
     * the ESC key.  If that happens, the result is the same as cancelling.
     */
    private void Window_KeyDown(object sender, KeyEventArgs e)
    {   //If the user presses escape, close this window.
        if (e.Key == Key.Escape)
        {
            Close();
        }
    }

    /* Handles when the 'x' button is pressed on any of the items.
     * The item in question is found and the RemoveItem event subscribers are notified.
     * If the subscribers do not cancel the event, then the item is removed.
     */
    private void BtnRemove_Click(object sender, RoutedEventArgs e)
    {   //Obtain the item that corresponds to the remove button that was clicked.
        INamedItem removeItem = ((FrameworkElement)sender).DataContext as INamedItem;

        RemoveItemEventArgs args = new RemoveItemEventArgs(removeItem);
        RaiseRemoveItem(args);

        if (!args.Cancel)
        {   //If not cancelled, then remove the item.
            items.Remove(removeItem);
        }
    }

    //Below are the customizable properties.

    /* This property specifies the prompt that displays at the top of the dialog. */
    public string Prompt
    {
        get { return prompt; }
        set
        {
            if (prompt != value)
            {
                prompt = value;
                RaisePropertyChanged("Prompt");
            }
        }
    }

    /* This property specifies the text on the confirm selection button. */
    public string SelectText
    {
        get { return selectText; }
        set
        {
            if (selectText != value)
            {
                selectText = value;
                RaisePropertyChanged("SelectText");
            }
        }
    }

    /* This property controls whether or not items can be removed.
     * If set to true, the the 'x' button appears on the ItemTemplate.
     */
    public bool CanRemoveItems
    {
        get { return canRemoveItems; }
        set
        {
            if (canRemoveItems != value)
            {
                canRemoveItems = value;
                RaisePropertyChanged("CanRemoveItems");
            }
        }
    }

    /* This property specifies the collection of items that the user can select from.
     * Note that this uses the INamedItem interface.  The caller must comply with that
     * interface in order to use the ListDialogBox.
     */
    public ObservableCollection<INamedItem> Items
    {
        get { return items; }
        set
        {
            items = value;
            RaisePropertyChanged("Items");
        }
    }

    //Below are the read only properties that the caller uses after
    //prompting for a selection.

    /* This property contains either the selected INamedItem, or null if
     * no selection is made.
     */
    public INamedItem SelectedItem
    {
        get { return selectedItem; }
        private set
        {
            selectedItem = value;
        }
    }

    /* This property indicates if a selection was made.
     * The caller should check this property before trying to use the selected item.
     */
    public bool IsCancelled
    {   //A simple null-check is performed (the caller can do this too).
        get { return (SelectedItem == null); }
    }
}

//This delegate defines the callback signature for the RemoveItem event.
public delegate void RemoveItemEventHandler(object sender, RemoveItemEventArgs e);

/* This class defines the event arguments for the RemoveItem event.
 * It provides access to the item being removed and allows the event to be cancelled.
 */  
public class RemoveItemEventArgs
{
    public RemoveItemEventArgs(INamedItem item)
    {
        RemoveItem = item;
    }

    public INamedItem RemoveItem { get; private set; }
    public bool Cancel { get; set; }
}

INamedItem接口：

现在已经呈现了ListDialogBox，我们需要了解调用者如何使用它。如前所述，最简单的方法是创建一个接口。

INamedItem接口仅提供一个属性（称为DisplayName），ListDialogBox需要这些属性的列表才能显示信息。 ListDialogBox取决于调用者为此属性设置有意义的值。

界面非常简单：

public interface INamedItem
{
    string DisplayName { get; set; }
}

用法：

此时，涵盖了与ListDialogBox功能相关的所有类，现在是时候在程序中查看和实现它了。

为此，我们需要实例化ListDialogBox，然后设置自定义任何所需的属性。

ListDialogBox dialog = new ListDialogBox();
dialog.Prompt = "Select a pizza topping to add from the list below:";
dialog.SelectText = "Choose Topping";
dialog.CanRemoveItems = true; //Setting to false will hide the 'x' buttons.

ListDialogBox需要ObservableCollection<INamedItem>，因此我们必须在继续之前生成该StringItem。为此，我们创建了一个包装类＆＃39;对于我们想要使用的数据类型。在此示例中，我将创建一个实现INamedItem的{​​{1}}类，并将DisplayName设置为任意字符串。见下文：

public class StringItem : INamedItem
{    //Local copy of the string.
    private string displayName;

    //Creates a new StringItem with the value provided.
    public StringItem(string displayName)
    {   //Sets the display name to the passed-in string.
        this.displayName = displayName;
    }

    public string DisplayName
    {   //Implement the property.  The implementer doesn't need
        //to provide an implementation for setting the property.
        get { return displayName; }
        set { }
    }
}

然后StringItem用于创建ObservableCollection<INamedItem>：

ObservableCollection<INamedItem> toppings = new ObservableCollection<INamedItem>();
toppings.Add(new StringItem("Pepperoni"));
toppings.Add(new StringItem("Ham"));
toppings.Add(new StringItem("Sausage"));
toppings.Add(new StringItem("Chicken"));
toppings.Add(new StringItem("Mushroom"));
toppings.Add(new StringItem("Onions"));
toppings.Add(new StringItem("Olives"));
toppings.Add(new StringItem("Bell Pepper"));
toppings.Add(new StringItem("Pineapple"));

//Now we can set the list property:
dialog.Items = toppings;

此时已经设置了基本实现。我们只需要调用dialog.ShowDialog()，然后处理结果。但是，由于该示例允许用户从列表中删除项目，我们可能需要提示进行确认。为此，我们需要订阅RemoveItem事件。

RemoveItemEventHandler myHandler = (object s, RemoveItemEventArgs args) =>
{
    StringItem item = args.RemoveItem as StringItem;
    MessageBoxResult result = MessageBox.Show("Are you sure that you would like" + 
        " to permanently remove \"" + item.DisplayName + "\" from the list?",
        "Remove Topping?", 
        MessageBoxButton.YesNo, MessageBoxImage.Question);

    if (result == MessageBoxResult.No)
    {    //The user cancelled the deletion, so cancel the event as well.
        args.Cancel = true;
    }
};

//Subscribe to RemoveItem event.
dialog.RemoveItem += myHandler;

最后，我们可以显示ListDialogBox并处理结果。我们还必须记得取消订阅RemoveItem事件：

dialog.ShowDialog();
dialog.RemoveItem -= myHandler;

//Process the result now.
if (!dialog.IsCancelled)
{
    StringItem item = dialog.SelectedItem as StringItem;
    MessageBox.Show("You added the topping \"" + item.DisplayName +
        "\" to your pizza!");
}

剩下的就是将此代码放在您的应用程序中并自行运行。 上面的示例创建了以下ListDialogBox：

此外，点击＆＃39; x＆＃39;在意大利辣香肠上，会显示一个提示：

Answer 2

  

我可以在运行时指定数据绑定值的路径吗？在XAML中，我希望看到类似的东西，但这是错误的：

<ListBox.ItemTemplate>
     <Label Content="{Binding Path={Binding CustomerPath}}"/>
     <Button Width="20" Height="20" FontWeight="Bold" Content="×"/>
 </ListBox.ItemTemplate>

绑定已经错了。如果您的ListBox's ItemsSource为Customers，并且您想要绑定其内容，则只需使用{Binding Path=CustomerPath}。您的问题的答案是肯定的，您可以在运行时指定数据绑定值的路径。您必须为Template加载每个ListBox，然后在运行时设置bindings。

伪代码：

1. 加载项目模板
2. 获取标签控件
3. 将绑定设置为调用者设置属性以将其绑定到
的绑定

  

如何指示ListBox能够使用未知数据类型，但能够选择数据绑定值的路径？

绑定将在绑定的ToString()上调用class。因此，如果您的绑定是正确的并假设您有Customer作为对象

<Label Content="{Binding .}"/>

如果你没有覆盖ToString()对象的Customer，它将显示默认的ToString（），但是如果你这样做，那么它将会显示在{Label中。 1}}。这是一个丑陋的解决方案，只是替换DisplayMemberPath

给出的ListBox

理想情况下，我会在运行时设置绑定而不是创建一个接口，这不仅仅是因为您所说的内容，而且将用于此控件的后续对象必须实现该接口。