如果扩展一个扩展器，则多个扩展器必须折叠

Question

我有 4 个扩展器控件。

当一个扩展器扩展时，如何使所有其他扩展器折叠/关闭？

Answer 1

尝试以下代码：

XAML:

        <StackPanel Name="StackPanel1">
            <StackPanel.Resources>
                <local:ExpanderToBooleanConverter x:Key="ExpanderToBooleanConverter" />
            </StackPanel.Resources>
            <Expander Header="Expander 1"
                      IsExpanded="{Binding SelectedExpander, Mode=TwoWay, Converter={StaticResource ExpanderToBooleanConverter}, ConverterParameter=1}">
                <TextBlock>Expander 1</TextBlock>
            </Expander>
            <Expander Header="Expander 2"
                      IsExpanded="{Binding SelectedExpander, Mode=TwoWay, Converter={StaticResource ExpanderToBooleanConverter}, ConverterParameter=2}">
                <TextBlock>Expander 2</TextBlock>
            </Expander>
            <Expander Header="Expander 3"
                      IsExpanded="{Binding SelectedExpander, Mode=TwoWay, Converter={StaticResource ExpanderToBooleanConverter}, ConverterParameter=3}">
                <TextBlock>Expander 3</TextBlock>
            </Expander>
            <Expander Header="Expander 4"
                      IsExpanded="{Binding SelectedExpander, Mode=TwoWay, Converter={StaticResource ExpanderToBooleanConverter}, ConverterParameter=4}">
                <TextBlock>Expander 4</TextBlock>
            </Expander>
        </StackPanel>

Converter:

public class ExpanderToBooleanConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (value == parameter);
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (System.Convert.ToBoolean(value)) return parameter;
        return null;
    }
}

ViewModel:

public class ExpanderListViewModel
{
    public Object SelectedExpander { get; set; }
}

Initialization

StackPanel1.DataContext = new ExpanderListViewModel();

---

说明：

在 XAML 中，我们有 4 个扩展器。它们都从容器 StackPanel 通过 DataContext 继承了 ViewModel（类型为 ExpanderListViewModel）。

它们都绑定到 ViewModel 类上的单个属性。并在绑定中使用 ConverterParameter 为自己定义了唯一索引。每当您展开扩展器时，该索引都会保存在 SelectedExpander 属性中。使用该索引，如果存储的索引与给定索引匹配，则 Converter 返回 true；如果存储的索引不匹配，则返回 false。

在 Converter 类的 Convert 和 ConvertBack 方法中放置断点，您将看到发生了什么。

Answer 2

我就是这样做的：

1）添加了一个 StackPanel 并且必须添加一个名称标签属性（因为这是主面板）。

StackPanel名称=“StackPanel1”

2) 根据需要添加任意数量的扩展器（如果需要，可添加 1 到 100 个），每个扩展器必须具有：-

扩展=“Expander_Expanded”

（注意所有措辞 100% 相同）。

3）没有其他细节需要匹配（不需要身高的名字等）。

XML：

<StackPanel Name="StackPanel1">
<Expander Header="Expander 1" Expanded="Expander_Expanded">
    <TextBlock>Expander 1</TextBlock>
</Expander>
<Expander Header="Expander 2" Expanded="Expander_Expanded">
    <TextBlock>Expander 2</TextBlock>
</Expander>
<Expander Header="Expander 3" Expanded="Expander_Expanded" >
    <TextBlock>Expander 3</TextBlock>
</Expander>
<Expander Header="Expander 4" Expanded="Expander_Expanded" >
    <TextBlock>Expander 4</TextBlock>
</Expander>

4) 要控制名为“StackPanel1”的StackPanel 上所有“Expander”的打开/关闭，您只需添加以下代码一次。

VB 代码隐藏：

Private Sub Expander_Expanded(sender As Object, e As RoutedEventArgs)
    For Each exp As Expander In StackPanel1.Children
        If exp IsNot sender Then
            exp.IsExpanded = False
        End If
    Next
End Sub

5）现在您可以更改/添加内容、按钮、文本框等。您只需要不要更改 2 件事 1、“StackPanel 名称”2、“Expander Expanded”，而无需更新其他代码隐藏内容不会起作用。

希望这些信息对您有帮助。

发生什么事了？

1) 所有面板都是父面板，该面板上的所有控件都是子面板，

2) 所有控件都是父面板的子面板。

3) 一个类一次处理一个调用。

4）班级与孩子打交道。

6) 班级移至下一个孩子。

7) 一旦所有孩子都被问到，就停止。

所以伪代码是这样的：

1) 监听一个孩子的名字 x

2) 询问孩子父母列表中的每个孩子

3) 如果孩子没有打电话，那么

4) 孩子展开是假的

5) 结束询问孩子

6) 移动到下一个孩子并再次询问

7) 直到所有孩子都被问过

Answer 3

只需设置“失去焦点”似乎是最简单的方法。

XAML：

<Expander LostFocus="CollapseExpander" ExpandDirection="Down" Width="175">
    <ListBox Height="265" Margin="0,5,0,10">
    </ListBox>
</Expander>

VB：

Private Sub CollapseExpander(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)

 sender.IsExpanded = False

End Sub

Answer 4

使用 MVVM 并将 IsExpanded 属性绑定到视图模型上的布尔标志。当其中一个更新为 true 时，将所有其他设置为 false。

Answer 5

@wassim-azirar 询问已接受的答案：

如何在应用程序启动时扩展“Expander 1”？

我在 ViewModel 中添加：

SelectedExpander = "1";

因为事实上，“1”与 XAML 中的“1”不是同一个对象，所以这是行不通的，所以我改变了 decyclone 的答案，如下所示：

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
    return (string)value == (string)parameter;
}

decyclone 的答案对我来说非常有帮助- 谢谢。
所以我想分享一下我的经验，如果有人需要的话。

Answer 6

尝试 WPF 工具包 - 2010 年 2 月发布

http://www.dotnetspark.com/kb/1931-accordion-wpf-toolkit-tutorial.aspx

示例代码：

<my:Accordion  x:Name="accordion1" VerticalAlignment="Top" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" SelectionMode="ZeroOrOne">
        <my:AccordionItem Header="First Header" Content="First Content"/>
        <my:AccordionItem Header="Second Header">
            <StackPanel Height="300">
            <TextBlock Text="Second Content" /></StackPanel>
        </my:AccordionItem>
        <my:AccordionItem>
            <my:AccordionItem.Header>
                <TextBox Text="Third Item" />
            </my:AccordionItem.Header>
            <StackPanel Height="300">
                <TextBlock Text="Third Item" />
            </StackPanel>
        </my:AccordionItem>
        <my:AccordionItem>
            <my:AccordionItem.Header>
                <TextBlock Text="Fourth Item" />
            </my:AccordionItem.Header>
            <StackPanel Height="300">
                <TextBlock Text="Third Item" />
            </StackPanel>
        </my:AccordionItem>
    </my:Accordion>

Answer 7

我也需要这个，但在我看来，所有答案都太费力了。
我是这样做的：

1. 添加了 StackPanel（子对齐设置为垂直）。
2. 添加了 3 个扩展器。 （需要 3）
3. 将 Expanders 的高度设置为 120px 以向其添加元素。
4. 每个扩展器称为 ex1..3。

5. 每人有 2 个事件

   private void ex1_Collapsed(对象发送者, RoutedEventArgs e)  
   {  
       ex1.高度 = 23.0;  
   }  
   
   私人无效 ex1_Expanded（对象发送者， RoutedEventArgs e）    
   {  
       ex1.高度 = 120.0;  
       ex2.IsExpanded = false;  
       ex3.IsExpanded = false;  
   }  
   

6. 将所有应该折叠高度的 Expander 重置回 window_loaded 时的 23px。

那个它。