列表框具有单选，并且在单击时也取消选择...? [英] ListBox with single select and also unselect on click...?

问题描述

我需要一个在第一次单击时选择并在第二次单击时取消选择的列表框，以便在任何时候都只能选择零或一项.

I need a listbox that selects on first click and un-selects on second click, so that only zero or one item is selected at any time.

当您按住crtl时，将在列表框中实现select/unselect(带有SelectionMode ="Single")，但不幸的是，我的所有用户都无法知道这一点.

The select/unselect is implemented in the listbox (with SelectionMode="Single") when you hold down crtl, but unfortunately, none of my users can be expected to know that.

使用SelectionMode ="Multiple"，我们具有所需的确切功能，除了可以选择多个项目之外...

With SelectionMode="Multiple" we have the exact functionality I want, except that you can select more than one item...

更多背景: 我希望用户首先选择要登录的安装，然后提供凭据(以及其他一些选择)

More background: I want the user to first choose which installation to log into, then to give credentials (and some other choices)

为实现此目的，我使用了具有扩展内容的列表框.为了帮助扩展，我在listboxitem的左侧制作了一个三角形，该三角形在未扩展时指向右侧，在选择了listbox项时指向下方.

To achieve this I have used a listbox with expanding content. To aid the expansion I have on the left side of the listboxitem made a triangle that points right when unexpanded that turns to point down when you have selected the listbox item.

因此，首先，用户会看到安装中的列表，然后，当他通过选择选择了想要的项目时，listboxitem会扩展到他需要输入的其余信息.很好，而且效果很好，但是测试报告说他们希望第二次单击三角形以取消选择(并因此折叠展开的部分).而且我必须承认我已经点击了¤％&箭头也一样，希望动作会导致崩溃... :-(

So, first the user see the list over the installations, and then, when he has chosen the item he wants by selecting it, the listboxitem expands to the rest of the info he need to enter. It's quite nice, and works well, but testing reports that they want a second click to the triangle to unselect (and thus collapse the expanded section). And I must admit that I have clicked the ¤%& arrow too, expecting the action to result in a collapse... :-(

任何人都知道如何实现这一目标(最好没有代码)?

Anyone has an idea how this can be achieved (preferably without code behind)?

推荐答案

尝试:

您将ToggleButton用作详细内容的扩展器". 您可以将切换按钮的"IsChecked"属性绑定到该项目的IsSelected属性

you use a ToggleButton as the "Expander" of the detailed content. The "IsChecked" Property of the toggle Button you can bind to the IsSelected Property of the item

此处是代码:

<ListBox SelectionMode="Single">
   <ListBox.ItemsSource>
      <x:Array Type="{x:Type sys:String}">
         <sys:String>test1</sys:String>
         <sys:String>test2</sys:String>
         <sys:String>test3</sys:String>
         <sys:String>test4</sys:String>
         <sys:String>test5</sys:String>
         <sys:String>test6</sys:String>
      </x:Array>
   </ListBox.ItemsSource>
   <ListBox.ItemTemplate>
      <DataTemplate>
         <StackPanel Orientation="Horizontal">
            <ToggleButton IsChecked="{Binding 
                          RelativeSource={RelativeSource FindAncestor, 
                          AncestorType={x:Type ListBoxItem}},
                          Path=IsSelected}"
            >btn</ToggleButton>
         </StackPanel>
      </DataTemplate>
   </ListBox.ItemTemplate>
</ListBox>

它是如何工作的: 在列表框中只能选择一项.当我们选择一个项目时，Toggler会展开，因为他的IsChecked绑定到其父ListBoxItem的ListBoxItem.IsSelected(ListBoxItem是一个控件，该控件被包裹在每个Item的内容周围). 由于selectionMode是单一的，因此一旦选择了另一个项目，就会发生以下情况:

how it works: In the Listbox can only one item be selected. As we select an item the Toggler gets expanded cause his IsChecked is bound to ListBoxItem.IsSelected (ListBoxItem is a Control which gets wrapped around the Content of each Item) of his parent ListBoxItem. As the selectionMode is single as soon as another item gets selected the following happens:

• 取消选择实际选择的项目
• 通过绑定，Toggler也变得不受控制
• 选择新项目
• 新商品"切换器通过绑定进行检查

如果仅选中了实际选择的项目的切换器，则该项目将通过绑定取消选择自身...

and if just the actually selected item's toggler gets unchecked the item deselects itself through the binding...

这篇关于列表框具有单选，并且在单击时也取消选择...?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！