Question

I´m working on a Gui project for a company and we are trying to create a navigational system using expanders and buttons.
The navagational pane is supposed to look something like this
Button
Expander
Button
Button
Expander
Button
Button
Button

The problem is that if i open expander it doesnt close if a push a button but it does close if i press another expander.

Answer 1

Combinding multiple buttons and expanders together requires you to synchronize all the controls.
You need the all buttons to close the open expander, and have the opening expander close the open expander.

You can do this from the code-behind fairly easily by naming the controls; however, to implement this
solution using MVVM (with binding) is a bit more tricky because the Expander IsExpanded property does not support two way binding.

The key is to implement a Converter used by the Expander against its IsExpanded state as follows:

IsExpanded="{Binding Path=IsButtonSelected, Converter={StaticResource expConv}}

Each button command sets the IsButtonSelected flag to true which closes the open Expander.
Because Expanders use a Converter you can use the ConvertBack method to close the open Expander from the opening Expander.

I’ve include the code to help you follow along.

Here is the View with 3 buttons and 2 Expanders:

<Window x:Class="Expander.Views.MainView"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  xmlns:Helpers="clr-namespace:Expander.Converters" 
  Title="Main Window" 
  Height="400" Width="800">
  <Window.Resources>
    <Helpers:ExpanderConverter  x:Key="expConv"/>
  </Window.Resources>
  <Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Button Grid.Row="0" Grid.Column="0" Command="{Binding Path=ButtonSelected}" Content="Command 1"/>
    <Button Grid.Row="1" Grid.Column="0" Command="{Binding Path=ButtonSelected}" Content="Command 2"/>
    <Expander ExpandDirection="Down" 
              Grid.Row="2" Grid.Column="0" 
              IsExpanded="{Binding Path=IsButtonSelected, Converter={StaticResource expanderConv}}" 
              Header="Details">
        <StackPanel Orientation="Horizontal">
        <Label Content="Name"/>
        <TextBox Width="100" />
        </StackPanel>
    </Expander>
    <Button Grid.Row="3" Grid.Column="0" Command="{Binding Path=ButtonSelected}" Content="Command 3"/>
    <Expander ExpandDirection="Down" 
              Grid.Row="4" Grid.Column="0" 
              IsExpanded="{Binding Path=IsButtonSelected, Converter={StaticResource expanderConv}}" 
              Header="Details">
        <StackPanel Orientation="Horizontal">
            <Label Content="Address"/>
            <TextBox Width="100"/>
        </StackPanel>
    </Expander>
  </Grid>
</Window>

Here is the Converter called from the Expander:

using System;
using System.Globalization;
using System.Windows.Data;

namespace Expander.Converters
{
  [ValueConversion(typeof(object), typeof(bool))]
  public sealed class ExpanderConverter : IValueConverter
  {
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
      bool result = (bool)value;
      return !result;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
      bool result =(bool)value;
      return result;
    }
  }
}

Here is the ViewModel:
I have not included the base class ViewModelBase and the Command code because you tagged MVVM so I’ll assume you have your own implementation for these.

using System.Windows.Input;
using Expander.Commands;

namespace Expander.ViewModels
{
  public class MainViewModel : ViewModelBase
  {
    public MainViewModel()
    {
      ButtonSelected = new DelegateCommand<object>(OnButtonSelected, CanButtonSelected);
    }

    public ICommand ButtonSelected { get; set; }
    private void OnButtonSelected(object obj)
    {
      IsButtonSelected = true;
    }

    private bool CanButtonSelected(object obj)
    {
      return true;
    } 

    private bool _isButtonSelected = true;
    public bool IsButtonSelected
    {
      get
      {
        return _isButtonSelected;
      }
      set
      {
        _isButtonSelected = value;
        OnPropertyChanged("IsButtonSelected");
      }
    }
  }
}