WPF Как создать такое боковое меню (Modern-UI)

Я новичок в WPF и хочу создать боковое меню для своего приложения. В поисках идей я нашел эту картинку:

Моя идея состоит в том, чтобы добавить кнопки, как на картинке один ниже другого. Когда пользователь нажимает кнопку, он раскрывает кнопку, чтобы показать опции подменю. Только одно меню должно быть расширено за один раз. Мой первый тест - использовать список, внутри использовать Expander для каждой кнопки, а затем использовать стековую панель для добавления опций подменю. Это выглядит так:

Это мой XAML:

<Window x:Class="InterfazOhmio.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525" Background="Gray">    
    <Grid>       
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <ListBox>
            <ListBox.Resources>
                <Style TargetType="{x:Type Expander}">
                    <Setter Property="IsExpanded"
           Value="{Binding Path=IsSelected, RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}}}"/>
                </Style>
            </ListBox.Resources>
            <ListBox.Template>
                <ControlTemplate TargetType="{x:Type ListBox}">
                    <ItemsPresenter/>
                </ControlTemplate>
            </ListBox.Template>
            <ListBox.ItemContainerStyle>
                <Style TargetType="{x:Type ListBoxItem}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                <ContentPresenter Content="{TemplateBinding Content}"/>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </ListBox.ItemContainerStyle>

            <Expander Background="GreenYellow"  Width="243" Header="Pedidos">                
                <StackPanel>                    
                    <RadioButton Margin="20,5,5,5" Content="Nuevo Pedido" GroupName="Two"/>
                    <RadioButton Margin="20,5,5,5" Content="Consultar Pedidos" GroupName="Two"/>
                    <RadioButton Margin="20,5,5,5" Content="Pedidos Pendientes" GroupName="Two"/>
                </StackPanel>
            </Expander>
            <Expander Background="BurlyWood" Width="243" Header="Remitos" Expanded="Expander_Expanded">
                <StackPanel>
                    <RadioButton Content="Nuevo Remito" GroupName="Two"/>
                    <RadioButton Content="Consulta de Remitos" GroupName="Two"/>
                    <RadioButton Content="Remitos Pendientes de Facturar" GroupName="Two"/>
                </StackPanel>
            </Expander>
            <Expander Background="OrangeRed" Width="243" Header="Facturas de Ventas">
                <StackPanel>
                    <RadioButton Content="Nueva Factura" GroupName="Two"/>
                    <RadioButton Content="Consulta Facturas" GroupName="Two"/>                    
                </StackPanel>
            </Expander>
        </ListBox>        
    </Grid>    
</Window>

Таким образом, у меня есть поведение, которое я хотел, но не очень похоже на внешний вид Как я могу улучшить это, чтобы оно больше походило на первое изображение? Спасибо!

ОБНОВИТЬ

Я хочу добавить значок рядом с каждым заголовком группы, например, те кнопки, которые расположены выше, и в идеале заменить значок расширителя, а затем заменить радиокнопки на гиперссылки. Спасибо!

Ответы на вопрос(1)

Ваш ответ на вопрос