WPF基础五:UI①布局元素WrapPanel[通俗易懂]

2022-09-15 10:05:41 浏览数 (1)

大家好,又见面了,我是你们的朋友全栈君。

目录

WrapPanel

WrapPanel类

XAML范例:

C#代码


WrapPanel

按从左到右的顺序位置定位子元素,在包含框的边缘处将内容切换到下一行。 后续排序按照从上至下或从右至左的顺序进行,具体取决于 Orientation 属性的值。

WrapPanel包含UIElement对象的集合 ,这些对象位于 Children 属性中。

WrapPanel 的所有子元素都接收ItemWidth 与ItemHeight大小相乘的布局分区 。


WrapPanel类

名称

备注

权限

ItemHeightProperty

标识 ItemHeight 依赖项属性

public

ItemWidthProperty

标识 ItemWidth 依赖项属性

public

OrientationProperty

标识 Orientation 依赖项属性

public

名称

备注

权限

ItemHeight

获取或设置一个值,该值指定 WrapPanel 中所含全部项的高度

public

ItemWidth

获取或设置一个值,该值指定 WrapPanel 中所含全部项的宽度

public

Orientation

获取或设置一个值,该值指定子内容的排列方向

public

名称

备注

权限

ArrangeOverride

获取或设置网格中的列数

public

MeasureOverride

获取或设置网格第一行中前导空白单元格的数量

public


XAML范例:

代码语言:javascript复制
<Window x:Class="WrapPanel.MainWindow"
        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:WrapPanel"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <WrapPanel ItemHeight="120" ItemWidth="200" Orientation="Vertical">
            <Button Content="Btn1" />
            <Button Content="Btn2" />
            <Button Content="Btn3" />
            <Button Content="Btn4" />
        </WrapPanel>
    </Grid>
</Window>

Orientation=”Horizontal”


当宽度或长度不一的时候,可以利用HorizontalAlignment或VerticalAlignment。

代码语言:javascript复制
<Window x:Class="WrapPanel.MainWindow"
        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:WrapPanel"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <WrapPanel ItemHeight="120" ItemWidth="200" Orientation="Vertical">
            <Button Content="Btn1" />
            <Button Content="Btn2" Width="100" HorizontalAlignment="Left"/>
            <Button Content="Btn3" Width="100" HorizontalAlignment="Right"/>
            <Button Content="Btn4" />
        </WrapPanel>
    </Grid>
</Window>

C#代码

代码语言:javascript复制
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WrapPanelDemo
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            WrapPanel wrapPanel = new WrapPanel();

            for (int i = 1; i < 9; i  )
            {
                Button button = new Button();
                button.Content = "Btn"   (i);
                wrapPanel.Children.Add(button);
            }
            wrapPanel.Orientation = Orientation.Horizontal;
            wrapPanel.ItemHeight = 120;
            wrapPanel.ItemWidth = 200;

            ((this as Window).Content as Grid).Children.Add(wrapPanel);
        }
    }
}

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/163345.html原文链接:https://javaforall.cn

0 人点赞