bo/Workbench/QMonitor/qmonlib.ui/Views/MainView.axaml

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:vm="clr-namespace:qmonlib.ui.ViewModels"
             xmlns:vw-navigator="clr-namespace:qmonlib.ui.Views.Navigator"
             xmlns:vw-log="clr-namespace:qmonlib.ui.Views.Logs"
             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
             x:Class="qmonlib.ui.Views.MainView"
             x:DataType="vm:MainViewModel">
  <Design.DataContext>
    <!-- This only sets the DataContext for the previewer in an IDE,
         to set the actual DataContext for runtime, set the DataContext property in code (look at App.axaml.cs) -->
    <vm:MainViewModel />
  </Design.DataContext>
    <!--[+]Split LVL 0-->
    <SplitView IsPaneOpen="true"
               DisplayMode="CompactOverlay"
               CompactPaneLength="32"
               OpenPaneLength="296">
        <SplitView.Pane>
            <!--[+]Split LVL 0.1-->
            <SplitView IsPaneOpen="true"
                       DisplayMode="Inline"
                       OpenPaneLength="32"
                       PanePlacement="Right"
                       >
                <SplitView.Pane>
                    <!-- Filter section command buttons -->
                    <Grid VerticalAlignment="Top">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="32" />
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="35"/>
                            <RowDefinition Height="35"/>
                        </Grid.RowDefinitions>
                        <Button Width="32" Height="32" Grid.Column="0" Grid.Row="0">
                            <Button.Content>
                                <Image Source="/Images/32/adjust.png" />
                            </Button.Content>
                        </Button>
                        <Button Width="32" Height="32" Grid.Column="0" Grid.Row="1">
                            <Button.Content>
                                <Image Source="/Images/32/gear.png" />
                            </Button.Content>
                        </Button>
                    </Grid>
                </SplitView.Pane>
                <!-- Filter section -->
                <Panel>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                    <vw-navigator:NavFilter Grid.Column="0" Grid.Row="0" />
                    <vw-navigator:NavGeneralMetadata  Grid.Column="0" Grid.Row="1" />
                    </Grid>
                </Panel>
            </SplitView>
            <!--[-]Split LVL 0.1-->
        </SplitView.Pane>
        <!--[+]Split LVL 1-->
        <SplitView IsPaneOpen="true"
                   DisplayMode="Inline"
                   CompactPaneLength="32"
                   OpenPaneLength="296" HorizontalAlignment="Right">
            <SplitView.Pane>
               <Grid VerticalAlignment="Top">
                   <Grid.ColumnDefinitions>
                       <ColumnDefinition Width="32" />
                       <ColumnDefinition Width="Auto" />
                   </Grid.ColumnDefinitions>
                   <Grid.RowDefinitions>
                        <RowDefinition Height="32"/>
                        <RowDefinition Height="32"/>
                        <RowDefinition Height="Auto"/>
                   </Grid.RowDefinitions>
                   <Button VerticalAlignment="Top" Width="32" Height="32" HorizontalAlignment="Left"
                           Grid.Column="0" Grid.Row="0">
                    <Button.Content>
                        <Image Source="/Images/32/log.png" />
                    </Button.Content>
                    </Button>
                   <!-- Log section -->
                   <vw-log:LogCommandBar Grid.Column="1" Grid.Row="0" />
                   <vw-log:LogFilter Grid.Column="1" Grid.Row="1" />
                   <vw-log:LogView Grid.Column="1" Grid.Row="2" />
               </Grid>
            </SplitView.Pane>
            <!--[-]Split LVL 1-->

            <!-- Content section -->
            <Panel HorizontalAlignment="Stretch" VerticalAlignment="Top">
                <Panel.Background>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                        <GradientStop Color="#FF1E1E1E" Offset="0" />
                        <GradientStop Color="#FF2E2E2E" Offset="1" />
                    </LinearGradientBrush>
                </Panel.Background>
            </Panel>
        </SplitView>
        <!--[-]Split LVL 0-->
    </SplitView>
</UserControl>