.NET WPF教程(7)——布局介绍WrapPanel与StackPanel(②)
三. WrapPanel
WrapPanel布局面板将各个控件从左至右按照行或列的顺序罗列,当长度或高度不够是就会自动调整进行换行,后续排序按照从上至下或从右至左的顺序进行。
Orientation——根据内容自动换行。当 Horizontal选项看上去类似于Windows资源管理器的缩略图视图:元素是从左向右排列的,然后自上至下自动换行。Vertical 选项看上去类似于Windows资源管理器的列表视图:元素是从上向下排列的,然后从左至右自动换行。
ItemHeight——所有子元素都一致的高度。每个子元素填充高度的方式取决于它的VerticalAlignment属性、Height属性等。任何比ItemHeight高的元素都将被截断。
ItemWidth——所有子元素都一致的宽度。每个子元素填充高度的方式取决于它的VerticalAlignment属性、Width属性等。任何比ItemWidth高的元素都将被截断。
本次的示例,效果图如下2图,图1是宽度比较小,图2就是拉长了宽度后的结果。大家可以在实际做出来之后,自行拉动窗体的宽度:
图1
图2
上面两图的XAML代码实现:
<Window x:Class="WpfApp1.WindowWrap"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"Title="WindowWrap" Height="300" Width="400"><Grid><WrapPanel Orientation="Horizontal"> <TextBlock Name="textBlock_CityID" Text="CityID:" /><TextBox Name="textBox_CityID" MinWidth="100" /><TextBlock Name="textBlock_CityName" Text="CityName:" /><TextBox Name="textBox_CityName" MinWidth="100" /> <TextBlock Name="textBlock_ZipCode" Text="ZipCode:" /><TextBox Name="textBox_ZipCode" MinWidth="100" /> <TextBlock Name="textBlock_ProvinceID" Text="ProvinceID:" /><TextBox Name="textBox_ProvinceID" MinWidth="100" /> <TextBlock Name="textBlock_DateCreated" Text="DateCreated:" /><TextBox Name="textBox_DateCreated" MinWidth="100" /><TextBlock Name="textBlock_DateUpdated" Text="DateUpdated:" /><TextBox Name="textBox_DateUpdated" MinWidth="100" /> </WrapPanel></Grid>
</Window>
C#代码实现上图示例:
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.Shapes;namespace WpfApp1
{/// <summary>/// WindowWrap.xaml 的交互逻辑/// </summary>public partial class WindowWrap : Window{public WindowWrap(){InitializeComponent();}private void btnAddByCode_Click(object sender, RoutedEventArgs e){WrapPanel wp = new WrapPanel();//把wp添加为窗体的子控件this.Content = wp;wp.Margin = new Thickness(0, 0, 0, 0);wp.Background = new SolidColorBrush(Colors.White);//遍历增加TextBlockTextBlock block;for (int i = 0; i <= 10; i++){block = new TextBlock();block.Text = "后台代码添加控件:" + i.ToString();block.Margin = new Thickness(10, 10, 10, 10);block.Width = 160;block.Height = 30;wp.Children.Add(block);} }}
}
四. StackPanel
StackPanel就是将控件按照行或列来顺序排列,但不会换行。通过设置面板的Orientation属性设置了两种排列方式:横排(Horizontal默认的)和竖排(Vertical)。纵向的StackPanel默 认每个元素宽度与面板一样宽,反之横向亦然。如果包含的元素超过了面板空间,它只会截断多出的内容。 元素的Margin属性用于使元素之间产生一定得间隔,当元素空间大于其内容的空间时,剩余空间将由HorizontalAlignment和 VerticalAlignment属性来决定如何分配。
本示例要实现的效果如下2图,图1是横排,图2是竖排。
图1
图2
上两图的XAML代码实现:
<Window x:Class="WpfApp1.WindowStack"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"Title="WindowStack" Height="400" Width="500"><Grid><StackPanel Name="stackPanel" Margin="0,0,0,0" Background="White" Orientation="Vertical"><Button Content="第一个"/><Button Content="第二个"/><Button Content="第三个"/><Button Content="第四个"/><Button Content="第五个,改变排列方式" Click="Button_Click"/><Button Content="后台代码实现" Click="Button_Click_1"/> </StackPanel></Grid>
</Window>
上图示例的C#代码实现:
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.Shapes;namespace WpfApp1
{/// <summary>/// WindowStack.xaml 的交互逻辑/// </summary>public partial class WindowStack : Window{public WindowStack(){InitializeComponent(); } private void Button_Click(object sender, RoutedEventArgs e){stackPanel.Orientation=Orientation.Horizontal;}private void StackPanels(){StackPanel sp = new StackPanel();//把sp添加为窗体的子控件this.Content = sp;sp.Margin = new Thickness(0, 0, 0, 0);sp.Background = new SolidColorBrush(Colors.White);sp.Orientation = Orientation.Vertical;//Button1Button b1 = new Button();b1.Content = "后台代码,第一个";sp.Children.Add(b1); //Button2Button b2 = new Button();b2.Content = "后台代码,第二个";sp.Children.Add(b2);//Button3Button b3 = new Button();b3.Content = "后台代码,第三个";sp.Children.Add(b3); }private void Button_Click_1(object sender, RoutedEventArgs e){StackPanels();}}
}
注: 当把StackPanel的FlowDirection属性设置为RightToLeft,Orientation属性设置为Horizontal,StackPanel将从右向左排列元素。
续
续:.NET WPF教程(8)——布局介绍Grid与UniformGrid(③)
.NET WPF教程(7)——布局介绍WrapPanel与StackPanel(②)相关推荐
- (转)WPF面板布局介绍Grid、StackPanel、DockPanel、WrapPanel
回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的使用经验,可能还存在错误之处,还请大家指出. 本 ...
- ( 转)WPF面板布局介绍Grid、StackPanel、DockPanel、WrapPanel
回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的使用经验,可能还存在错误之处,还请大家指出. 本 ...
- WPF入门教程系列七——布局之WrapPanel与StackPanel(二)
三. WrapPanel WrapPanel布局面板将各个控件从左至右按照行或列的顺序罗列,当长度或高度不够是就会自动调整进行换行,后续排序按照从上至下或从右至左的顺序进行. Orientation- ...
- .NET WPF教程(6)——布局介绍与Canvas(①)
从这篇文章开始是对WPF中的界面如何布局做一个较简单的介绍,大家都知道:UI是做好一个软件很重要的因素,如果没有一个漂亮的UI,功能做的再好也无法吸引很多用户使用,而且没有漂亮的界面,那么普通用户会感 ...
- WPF教程三:布局之WrapPanel面板(转 )
WPF教程三:布局之WrapPanel面板 WrapPanel:环绕面板 WrapPanel布局面板将各个控件从左至右按照行或列的顺序罗列,当长度或高度不够时就会自动调整进行换行,后续排序按照从上至下 ...
- WPF教程六:布局之Grid面板(转)
WPF教程六:布局之Grid面板 Grid:网格面板 Grid顾名思义就是"网格",以表格形式布局元素,对于整个面板上的元素进行布局,它的子控件被放在一个一个事先定义好的小格子里面 ...
- 第14课 Altium Designer20(AD20)+VESC6.4实战教程:PCB总体布局介绍(北冥有鱼)
第14课 Altium Designer20(AD20)+VESC6.4实战教程:PCB总体布局介绍(北冥有鱼)
- WPF编程基础入门 ——— 第三章 布局(五)布局面板WrapPanel
WPF布局--布局面板WrapPanel WPF--WrapPanel布局控件 WrapPanel实例--十个按钮 WPF--WrapPanel布局控件 WrapPanel(自动折行面板),允许任意多 ...
- 第二章:WPF常用控件介绍
前言 总目录 在上一章中,初步的认识了WPF,那么这一章将逐个的认识一些常用的控件以及这些控件的常用属性,这对于我们我们后续开发WPF程序是非常有必要的. 一.Window窗体 1.Window基本用 ...
最新文章
- 十年老码农吐血经验:跳槽千万不能选高年终低base的公司,超过15薪就要慎重!...
- 【部分原创】python实现视频内的face swap(换脸)
- SpringCloud Zuul初体验
- Flex与.NET互操作(二):基于WebService的数据访问(上)
- [转]自定义ASP.NET MVC Html辅助方法
- Java ByteArrayInputStream reset()方法及示例
- BugkuCTF-Crypto题贝斯家
- ★深入探讨高维宇宙【二】
- SSH实现一个简单的权限控制实例(一)
- 大麦盒子(domybox)无法进入系统解决方案!【简单几步】
- H5调用摄像头拍照并下载照片
- 南方cass简码识别大全_南方CASS简码成图的方法
- vscode 未使用变量置灰
- oracle 11g crsd ocssd,[Oracle 11g r2(11.2.0.4.0)]集群守护进程gipc介绍
- 苏格拉底与失恋者的对话(教你怎么安慰失恋的朋友)
- TortoiseGit(乌龟)------安装教程
- 通过海康sdk实现指定时间段内的录像文件下载
- 域名劫持定义及原理、域名被劫持解决办法有那些
- CS231n_learn
- swagger中没有新加的实体类属性(新加的属性在swagger中不显示)问题