MainWindow.xaml 分析 标题栏 最小化 最大化 关闭

MainWindow.xaml

<!-- 1. 使用一个 `Border` 控件作为最外层容器，设置了紫色背景（#7160E8）和圆角（10）。 -->
<Border Background="#7160E8" CornerRadius="10">
        <Grid>
 
            <!-- 2. 主要布局：
            - 在 `Border` 内使用 `Grid` 进行布局，将窗口分为两行：
                - 第一行高度固定为35（标题栏）
                - 第二行高度自适应（*） -->
            <Grid.RowDefinitions>
                <RowDefinition Height="35" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
 
            <!-- 3. 标题栏：
            - 位于第一行，使用另一个 `Border` 控件
            - 背景色与外层相同，但只有上方有圆角
            - 包含一个 `MouseLeftButtonDown` 事件，可能用于实现拖动窗口
            - 内部使用 `Grid` 布局：
                - 左侧是一个 `TextBlock`，显示标题栏文本（中文）
                - 右侧是一个 `StackPanel`，包含三个按钮（最小化、最大化、关闭） -->
            <Border
                Background="#7160E8" CornerRadius="10 10 0 0" MouseLeftButtonDown="MoveWindow_MouseLeftButtonDown">
                <Grid>
                    <TextBlock
                        Margin="10,10,5,5"
                        Foreground="White"
                        Text="这里是窗体标题栏，左侧可放Logo、标题，右侧放窗体操作按钮：最小化、最大化、关闭等" />
                    <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                        <Button Click="MinimizeWindow_Click" Content="―" />
                        <Button Click="MaximizeWindow_Click" Content="口" />
                        <Button Click="CloseWindow_Click" Content="X" />
                    </StackPanel>
                </Grid>
            </Border>
 
            <!-- 4. 内容区域：
            - 位于第二行，使用 `BlazorWebView` 控件
            - 指定了宿主页面为 "wwwroot\index.html"
            - 定义了一个根组件，类型为 `razorViews:Counter`，选择器为 "#app" -->
            <blazor:BlazorWebView Grid.Row="1" HostPage="wwwroot\index.html" Services="{DynamicResource services}">
                <blazor:BlazorWebView.RootComponents>
                    <blazor:RootComponent ComponentType="{x:Type razorViews:Counter}" Selector="#app" />
                </blazor:BlazorWebView.RootComponents>
            </blazor:BlazorWebView>
 
        </Grid>
    </Border>