Skip to answer to see how to implement the ListDialogBox
我有一个可重用的对话框/窗口,提示用户从列表框中选择一个项目,然后单击“确定”以确认选择。
效果很好;但是,列表框不知道提前处理的是哪种数据类型。因此,列表绑定(bind)到可由对话框的调用者设置的ObservableCollection<Object>
。
此外,列表框还具有一个自定义项目模板,该模板允许用户从列表中删除项目。
这是我正在描述的对话框:
理想情况下,我想利用列表框的DisplayMemberPath
,但是由于我正在创建自己的项目模板,因此我是不允许的。这是一个问题,因为调用者应该能够指定他/她想绑定(bind)到我设置的自定义项目模板的哪个属性。
由于这种方法行不通,所以我的第一个问题是:
1.我可以在运行时指定数据绑定(bind)值的路径吗?
在XAML中,我期望会看到类似这样的内容,但这是错误的:
<ListBox.ItemTemplate>
<Label Content="{Binding Path={Binding CustomPath}}"/>
<Button Width="20" Height="20" FontWeight="Bold" Content="×"/>
</ListBox.ItemTemplate>
(为简洁起见,省略了一些属性)假设第一个问题已解决,我仍然有另一个问题。列表框正在使用非通用类型
Object
,它将不具有调用者想要绑定(bind)到的属性。列表框无法将对象转换为自定义类型并无法访问所需的属性。这使我想到了第二个问题。2.如何指示ListBox能够使用未知数据类型,但能够选择数据绑定(bind)值的路径?
也许应该在SO上留下另一个问题,但是能够指定绑定(bind)是使用
ToString()
还是使用属性,将是一个很好的选择。我能想到的唯一解决方案是创建一个接口(interface),该接口(interface)具有调用者必须使用的属性(名为
DisplayText
)。然后,该列表将绑定(bind)到ObservableCollection<CustomInterface>
的实例。但是,不希望将已经存在的数据类型包装到此接口(interface)中,这样才能正常工作。有一个更好的方法吗?
编辑:实现者如何使用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
类中,我想将项目模板的标签绑定(bind)到DisplayName属性,因为这是所提供的ListDisplayMemberPath
值。我该如何克服呢?
最佳答案
该答案旨在解决原始问题中的问题,并为以后的读者提供有关如何实现ListDialogBox
的示例。
原始问题中的问题涉及能够指定如何在ListBox
中显示信息。由于ListBox
直到运行时才知道其显示的数据类型,因此没有一种直接的方法来指定指向要显示的所需属性的“路径”。
解决该问题的最简单方法是创建一个ListDialogBox
独占使用的接口(interface),然后调用方只需创建该接口(interface)的实例即可自定义信息的显示方式。
该解决方案的唯一缺点是,调用者需要满足他/她的数据以符合ListDialogBox
的要求;但是,这很容易实现。
如何创建和实现ListDialogBox
:ListDialogBox
的目标是类似于 OpenFileDialog
或 SaveFileDialog
,因为您初始化对话框,提示输入结果,然后处理结果。
首先,我将展示和解释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
背后的代码:此类定义了调用者可以修改以自定义方式的所有属性
显示的
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
接口(interface):现在已经介绍了
ListDialogBox
,我们需要看看调用者如何使用它。如前所述,最简单的方法是创建一个接口(interface)。INamedItem
接口(interface)仅提供一个属性(称为DisplayName
),而ListDialogBox
需要这些属性的列表才能显示信息。 ListDialogBox
取决于调用方来为此属性设置有意义的值。界面非常简单:
public interface INamedItem
{
string DisplayName { get; set; }
}
用法:
至此,已经涵盖了与
ListDialogBox
功能有关的所有类,现在是时候在程序中查找和实现它了。为此,我们需要实例化
ListDialogBox
,然后设置custom任意所需的属性。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
类,该类实现INamedItem
并将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
:同样,当单击意大利辣香肠上的“x”时,也会显示提示: