3. Encounter the form of handycontrol again

Preface ： Record HandyControl Custom form in NonClientAreaContent

One 、 Be careful

NonClientAreaContent Control in Window Under the namespace , You can customize the size of the title bar of the form 、 Content , But there are a few things to note

• Maximum 、 Minimum 、 Exit these three buttons and their positions cannot be edited , It will only expand and shrink with the custom title bar .
• This area , It's the blue one , Cannot be selected to drag , You need to drag in the custom title area .
• NonClientAreaContent No, Background This attribute , So the author here in the next level control --StackPanel Set up Background

<hc:Window x:Class="MDLTestMachine.Views.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:prism="http://prismlibrary.com/"
        prism:ViewModelLocator.AutoWireViewModel="True"
        xmlns:core="clr-namespace:MDLTestMachine.Core;assembly=MDLTestMachine.Core"
        xmlns:hc="https://handyorg.github.io/handycontrol"
        
        Title="{Binding Title}" Height="350" Width="525">

    <hc:Window.NonClientAreaContent>
        <StackPanel Orientation="Horizontal" Height="35" Height="35" Background="Blue">
            <Button Content="11" Background="Red"/>
            <Button Content="22" Background="Yellow"/>
            <Button Content="33" Background="Green"/>
        </StackPanel>
    </hc:Window.NonClientAreaContent>
    <Grid>
        <ContentControl prism:RegionManager.RegionName="{x:Static core:RegionNames.ContentRegion}" />
    </Grid>
</hc:Window>

Two 、 Official website

It's like this on the official website , It's more beautiful , Let's take a look at what it says on the official website

<Grid x:Class="HandyControlDemo.UserControl.NonClientAreaContent"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
      xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
      Height="29"
      DataContext="{Binding NoUser,Source={StaticResource Locator}}"
      xmlns:hc="https://handyorg.github.io/handycontrol"
      xmlns:data="clr-namespace:HandyControlDemo.Data" Background="Red">
     
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <StackPanel VerticalAlignment="Stretch" Orientation="Horizontal">
        <Menu Margin="10,0,0,0" Background="Transparent">
            <MenuItem Height="29" Header="{ex:Lang Key={x:Static langs:LangKeys.Repository}}">
                <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://github.com/NaBian/HandyControl" Header="GitHub">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource GithubGeometry}" Fill="{DynamicResource PrimaryTextBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://www.nuget.org/packages/HandyControl" Header="NuGet">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource NugetGeometry}" Fill="#30a5dd" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://marketplace.visualstudio.com/items?itemName=HandyOrg.HandyControl" Header="{ex:Lang Key={x:Static langs:LangKeys.Vsix}}">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource VisualStudioGeometry}" Fill="{DynamicResource PrimaryTextBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
            </MenuItem>
            <MenuItem Height="29" Header="{ex:Lang Key={x:Static langs:LangKeys.About}}">
                <MenuItem Command="{Binding OpenViewCmd}" CommandParameter="{x:Static data:MessageToken.ContributorsView}" Header="{ex:Lang Key={x:Static langs:LangKeys.Contributors}}">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource ContributorsGeometry}" Fill="#ef6c00" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="mailto:[email protected]" Header="{ex:Lang Key={x:Static langs:LangKeys.Email}}">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource EmailGeometry}" Fill="{DynamicResource WarningBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://join.slack.com/t/handycontrol/shared_invite/zt-sw29prqd-okFmRlmETdtWhnF7C3foxA" Header="{ex:Lang Key={x:Static langs:LangKeys.Chatroom}}">
                    <MenuItem.Icon>
                        <Image Width="16" Height="16" Source="/HandyControlDemo;component/Resources/Img/Slack.png" Stretch="None" StretchDirection="Both"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://www.cnblogs.com/nabian" Header="{ex:Lang Key={x:Static langs:LangKeys.Blog}}">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource CnblogsGeometry}" Fill="{DynamicResource PrimaryTextBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="{ex:Lang Key={x:Static langs:LangKeys.Demo}}">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource CodeGeometry}" Fill="{DynamicResource PrimaryTextBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                    <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://github.com/AFei19911012/HandyControl" Header="AFei19911012 / HandyControl">
                        <MenuItem.Icon>
                            <Path Data="{StaticResource CodeGeometry}" Fill="{DynamicResource PrimaryTextBrush}" Stretch="Uniform"/>
                        </MenuItem.Icon>
                    </MenuItem>
                </MenuItem>
                <MenuItem Header="{ex:Lang Key={x:Static langs:LangKeys.Documentation}}">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource DocGeometry}" Fill="{DynamicResource PrimaryBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                    <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://github.com/ghost1372/HandyControl/wiki/Documentation" Header="Wiki">
                        <MenuItem.Icon>
                            <Path Data="{StaticResource WikiGeometry}" Fill="{DynamicResource PrimaryTextBrush}" Stretch="Uniform"/>
                        </MenuItem.Icon>
                    </MenuItem>
                    <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://ghost1372.github.io" Header="{ex:Lang Key={x:Static langs:LangKeys.Doc_en}}">
                        <MenuItem.Icon>
                            <Path Data="{StaticResource LogoGeometry}" Fill="#ef6c00" Stretch="Uniform"/>
                        </MenuItem.Icon>
                    </MenuItem>
                    <MenuItem Command="hc:ControlCommands.OpenLink" CommandParameter="https://handyorg.github.io" Header="{ex:Lang Key={x:Static langs:LangKeys.Doc_cn}}">
                        <MenuItem.Icon>
                            <Path Data="{StaticResource LogoGeometry}" Fill="#ef6c00" Stretch="Uniform"/>
                        </MenuItem.Icon>
                    </MenuItem>
                </MenuItem>
                <MenuItem Header="{ex:Lang Key={x:Static langs:LangKeys.About}}" Click="MenuAbout_OnClick">
                    <MenuItem.Icon>
                        <Path Data="{StaticResource InfoGeometry}" Fill="{DynamicResource SuccessBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
            </MenuItem>
            <MenuItem Height="29" Header="{ex:Lang Key={x:Static langs:LangKeys.Recommendation}}">
                <MenuItem Header="{ex:Lang Key={x:Static langs:LangKeys.Project}}" Command="{Binding OpenViewCmd}" CommandParameter="{x:Static data:MessageToken.ProjectsView}" >
                    <MenuItem.Icon>
                        <Path Data="{StaticResource ProjectGeometry}" Fill="{DynamicResource PrimaryTextBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="{ex:Lang Key={x:Static langs:LangKeys.Blog}}" Command="{Binding OpenViewCmd}" CommandParameter="{x:Static data:MessageToken.BlogsView}" >
                    <MenuItem.Icon>
                        <Path Data="{StaticResource BlogGeometry}" Fill="{DynamicResource PrimaryBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="{ex:Lang Key={x:Static langs:LangKeys.Website}}" Command="{Binding OpenViewCmd}" CommandParameter="{x:Static data:MessageToken.WebsitesView}" >
                    <MenuItem.Icon>
                        <Path Data="{StaticResource WebsiteGeometry}" Fill="{DynamicResource WarningBrush}" Stretch="Uniform"/>
                    </MenuItem.Icon>
                </MenuItem>
            </MenuItem>
        </Menu>
        <Border Margin="10,0,0,0" VerticalAlignment="Center" CornerRadius="2" Padding="10,4" Background="{DynamicResource SecondaryRegionBrush}">
            <TextBlock FontWeight="Bold" Text="{Binding VersionInfo}" VerticalAlignment="Center" Foreground="{DynamicResource PrimaryTextBrush}"/>
        </Border>
    </StackPanel>
    <Button Grid.Column="1" Click="ButtonConfig_OnClick" Name="ButtonConfig" Style="{StaticResource ButtonIcon}" hc:IconElement.Geometry="{StaticResource ConfigGeometry}"/>
    <Popup AllowsTransparency="True" Grid.Column="1" PlacementTarget="{Binding ElementName=ButtonConfig}" HorizontalOffset="-28" Name="PopupConfig" VerticalOffset="6" StaysOpen="False">
        <Border Background="{DynamicResource SecondaryRegionBrush}" CornerRadius="4" Margin="16" Effect="{StaticResource EffectShadow2}">
            <StackPanel Orientation="Horizontal">
                <hc:UniformSpacingPanel Button.Click="ButtonLangs_OnClick" Orientation="Vertical" Margin="10" Spacing="10" ChildWrapping="Wrap" MaxHeight="134">
                    <Button Tag="zh-cn" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/cn.png"/>
                    </Button>
                    <Button Tag="en" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/en.png"/>
                    </Button>
                    <Button Tag="fa" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/fa.png"/>
                    </Button>
                    <Button Tag="fr" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/fr.png"/>
                    </Button>
                    <Button Tag="ca-ES" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/ca-Es.png"/>
                    </Button>
                    <Button Tag="ja" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/ja.png"/>
                    </Button>
                    <Button Tag="ko-KR" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/ko-KR.png"/>
                    </Button>
                    <Button Tag="ru" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/ru.png"/>
                    </Button>
                    <Button Tag="tr" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/tr.png"/>
                    </Button>
                    <Button Tag="pt-BR" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/pt-BR.png"/>
                    </Button>
                    <Button Tag="pl" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/pl.png" />
                    </Button>
                    <Button Tag="es" Style="{StaticResource ButtonCustom}">
                        <Image Width="32" Source="/HandyControlDemo;component/Resources/Img/Flag/es.png"/>
                    </Button>
                </hc:UniformSpacingPanel>
                <hc:Divider LineStrokeDashArray="2,2" Orientation="Vertical" Margin="0,20" LineStrokeThickness="2"/>
                <StackPanel Button.Click="ButtonSkins_OnClick"  Margin="10,10,10,10">
                    <Button Tag="{x:Static hc:SkinType.Default}" Style="{StaticResource ButtonCustom}">
                        <Border Background="White" Width="32" Height="21" CornerRadius="2" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}"/>
                    </Button>
                    <Button Tag="{x:Static hc:SkinType.Dark}" Style="{StaticResource ButtonCustom}" Margin="0,10,0,0">
                        <Border Background="Black" Width="32" Height="21" CornerRadius="2" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}"/>
                    </Button>
                    <Button Tag="{x:Static hc:SkinType.Violet}" Style="{StaticResource ButtonCustom}" Margin="0,10,0,0">
                        <Border Background="DarkViolet" Width="32" Height="21" CornerRadius="2" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}"/>
                    </Button>
                </StackPanel>
            </StackPanel>
        </Border>
    </Popup>
</Grid>

The official website wrote a UserControl, And then it is loaded in the background , As can be seen from the above , Mainly for menu To do the . Then it uses some resources .