WPF--布局控件

cs 复制代码
<Window x:Class="SSC.Views.ExcelPipe"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        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:local="clr-namespace:SSC.Views"
        mc:Ignorable="d"
        Title="ExcelPipe" Height="450" Width="800">
    <Grid ShowGridLines="true">
        <Grid.RowDefinitions >
            <RowDefinition Height="30"/>
            <RowDefinition Height="20"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="20"/>
        </Grid.RowDefinitions>

        <StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal">
            <Button Content="A" Click="LoadExcel_Click" Width="60" Height="30" BorderBrush="Blue"/>
            <Button Content="B" Click="ProcessData_Click" Width="60" Height="30"/>
            <Button Content="C" Click="ExportResults_Click" Width="60" Height="30"/>
        </StackPanel>

        <StackPanel Grid.Row="1" Grid.Column="0" Orientation="Horizontal">
            <TextBlock Text="1"  Width="20" Height="20" Background="LightBlue" TextAlignment="Center" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            <TextBlock Text="2"  Width="20" Height="20" Background="Orange" TextAlignment="Center" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            <TextBlock Text="3"  Width="20" Height="20" Background="PaleGoldenrod" TextAlignment="Center" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            <TextBlock Text="4"  Width="20" Height="20" Background="PaleGreen" TextAlignment="Center" VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </StackPanel>

        <Grid Grid.Row="2" Grid.Column="0">
            <Grid.ColumnDefinitions >
                <ColumnDefinition Width="50"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <StackPanel Grid.Column="0" Orientation="Vertical">
                <TextBlock Text="A"  Width="50" Height="30" Background="LightBlue" TextAlignment="Center" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                <TextBlock Text="B"  Width="50" Height="30" Background="Orange" TextAlignment="Center" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                <TextBlock Text="C"  Width="50" Height="30" Background="PaleGoldenrod" TextAlignment="Center" VerticalAlignment="Center" HorizontalAlignment="Center"/>

            </StackPanel>
        </Grid>

        <Grid Grid.Row="3">
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center">
                <Button Content="D" Click="LoadExcel_Click" Width="60" Height="30" BorderBrush="Blue"/>
                <Button Content="D" Click="LoadExcel_Click" Width="60" Height="30" BorderBrush="Blue"/>
                <Button Content="D" Click="LoadExcel_Click" Width="60" Height="30" BorderBrush="Blue"/>
                <Button Content="D" Click="LoadExcel_Click" Width="60" Height="30" BorderBrush="Blue"/>
                <Button Content="D" Click="LoadExcel_Click" Width="60" Height="30" BorderBrush="Blue"/>
            </StackPanel>
        </Grid>
    </Grid>
</Window>

1.运用Grid,StackPanel

cs 复制代码
//资源文件
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style TargetType="Button">
        <Setter Property="Background" Value="White"></Setter>
        <Setter Property="FontSize" Value="20"></Setter>
        <Setter Property="Margin" Value="5,10"></Setter>
    </Style>

    <Style x:Key="login" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
        <Setter Property="Background" Value="Green"></Setter>
    </Style>
    <Style x:Key="quit" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
        <Setter Property="Background" Value="Red"></Setter>
    </Style>
</ResourceDictionary>

//界面文件
<Window x:Class="SSC.Views.ExcelPipe"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        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:local="clr-namespace:SSC.Views"
        mc:Ignorable="d"
        Title="ExcelPipe" Height="450" Width="800">
    <Grid ShowGridLines="true">
        <StackPanel>
            <Button Style="{StaticResource login}" Content="登录"></Button>
            <Button Style="{StaticResource quit}" Content="退出"></Button>
            <Button Content="密码"></Button>
            <Button Content="忘记密码"></Button>
        </StackPanel>
    </Grid>
</Window>

//在app.xaml中全局引用资源文件
<Application x:Class="SSC.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:SSC"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Views/Button.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

运用style自定义控件库和引用

相关推荐
tedcloud12311 小时前
UI-TARS-desktop部署教程:构建AI桌面自动化系统
服务器·前端·人工智能·ui·自动化·github
ZC跨境爬虫15 小时前
跟着MDN学HTML_day_48:(Node接口)
前端·javascript·ui·html·音视频
为何创造硅基生物16 小时前
嵌入式 LVGL / SquareLine UI 标准命名规则(行业通用版)
windows·ui
AITOP1001 天前
高德联合千问开源AGenUI:让Agent UI同时跑在iOS、安卓和鸿蒙上
ui·ios·开源
UXbot1 天前
AI原型设计工具如何从PRD自动生成交互原型
前端·低代码·ui·交互·ai编程·原型模式
十五年专注C++开发1 天前
QFluentKit: 一个基于 Qt Widgets 的 Fluent Design 风格 UI 组件库
开发语言·c++·qt·ui·qfluentkit
ZC跨境爬虫1 天前
跟着MDN学HTML_day_47:(Document接口)
前端·javascript·ui·html·ecmascript·音视频
Ulyanov1 天前
《从质点到位姿:基于Python与PyVista的导弹制导控制全栈仿真》: 基石——3-DOF质点弹道的高保真建模与数值稳定性分析
开发语言·python·算法·ui·系统仿真
△曉風殘月〆1 天前
如何在WPF中使用 Fluent 主题
wpf
△曉風殘月〆1 天前
不同.NET版本中的WPF新增功能
.net·wpf