Java教程

WPF-XMAL-布局和控件-布局

本文主要是介绍WPF-XMAL-布局和控件-布局，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

什么是布局

简单地说，布局是一个递归系统，实现对元素进行大小调整、定位和绘制。 更具体地说，布局描述测量和排列元素集合 Panel 的成员 Children 的过程。

为什么使用布局

不为啥，你所作的控件的的显示都是基于布局而来

怎么使用布局

可以使用派生自panel元素的子类

面板名称 说明
Canvas 定义一个可以按相对于该区域坐标显式定位子元素 Canvas 的区域。
DockPanel 定义一个区域，从中可以按相对位置水平或垂直排列各个子元素。
Grid 定义由列和行组成的灵活的网格区域。
StackPanel 将子元素排列成水平或垂直的一行。
VirtualizingPanel 为虚拟化其子数据集合的 Panel 元素提供一个框架。 这是一个抽象类。
WrapPanel 按从左到右的顺序位置定位子元素，在包含框的边缘处将内容切换到下一行。 后续排序按顺序从上到下或从右到左进行，具体取决于 Orientation 属性的值。

1.Grid

  <Title="MainWindow" Height="240" Width="400"
        MinHeight="200" MaxHeight="400" MinWidth="340" MaxWidth="600">
      <!--默认为240*400 最大为400*600 最小为200*340-->
    <Grid Margin="10">
        
        <Grid.ColumnDefinitions><!--列-->
            <ColumnDefinition Width="auto" />
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="80"/> 
            <ColumnDefinition Width="4"/>
            <ColumnDefinition Width="80"/>
            <!-- 80绝对值 1*比例值 auto自动值-->
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions><!--行-->
            <RowDefinition Height="25" />
            <RowDefinition Height="4" />
            <RowDefinition Height="*"/>
            <RowDefinition Height="4"/>
            <RowDefinition Height="25" />
        </Grid.RowDefinitions>
<!--VerticalAlignment="Center" 垂直对齐的特征-->
        <TextBlock Text="请选择则部门并留言" Grid.Row="0" Grid.Column="0" VerticalAlignment="Center"></TextBlock> 
        <ComboBox Grid.Row="0" Grid.Column="1" Grid.ColumnSpan="4"></ComboBox>
        <TextBox Grid.Row="2" Grid.ColumnSpan="5" BorderBrush="Black"></TextBox>
        <Button Content="提交" Grid.Column="2" Grid.Row="4"></Button>
        <Button Content="清除" Grid.Column="4" Grid.Row="4"></Button>
    </Grid>

image

适用于：

  1. UI框架的大体设计
  2. 大量的UI元素需要成行成列的对其
  3. UI整体尺寸改变时，元素要保持原有的高度和宽度比例

2.StackPanel 将子元素排列成水平或垂直的一行。

    <Title="MainWindow" Height="300" Width="600">
    <Grid Margin="10">
        
        <Grid.RowDefinitions>
            <RowDefinition Height="1*" />
            <RowDefinition Height="1*" />
        </Grid.RowDefinitions>

        <StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Row="0">
            <TextBox Height="80" Width="150" Background="AntiqueWhite" Margin="5">1</TextBox>
            <TextBox Height="80" Width="150" Background="AntiqueWhite" Margin="5">2</TextBox>
            <TextBox Height="80" Width="150" Background="AntiqueWhite" Margin="5">3</TextBox>
            <TextBox Height="80" Width="150" Background="AntiqueWhite" Margin="5">4</TextBox>
        </StackPanel>
        <StackPanel Orientation="Vertical" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Row="1">
            <TextBox Height="80" Width="125" Background="AntiqueWhite" Margin="5">1</TextBox>
            <TextBox Height="80" Width="125" Background="AntiqueWhite" Margin="5">2</TextBox>
            <TextBox Height="80" Width="125" Background="AntiqueWhite" Margin="5">3</TextBox>
        </StackPanel>
    </Grid>
这篇关于WPF-XMAL-布局和控件-布局的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航