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自定义控件库和引用