使用StackPanel进行简单地布局
尽管StackPanel非常简单,但是其实用性也非常强 ,Stackpanel将子元素以堆叠的形式 排列在一行或一列。通常建议使用该控件对于一些小范围内的控件进行布局。
如果要架设用户控件的框架结构,则建议使用其他控件。
Stackpanel示例
先举一个示例程序来看下Stackpanel控件的运行效果,
<Grid>
<StackPanel Orientation="Horizontal" >
<Button Name="button" Content="按钮1" />
<Button Name="button4" Content="按钮2" />
<Button Name="button1" Content="按钮3"/>
<Button Name="button2" Content="按钮4" />
<Button Name="button3" Content="按钮5"/>
</StackPanel> </Grid>
默认情况下,Stackpanel从上到下排列控件,控件的高度与其内容的高度想匹配,可以使用Orientation(方向)属性设置其属性为Horizontal(水平)使其从左到右排列,这个属性的默认值为vertical(垂直)


HorizontalAlignment 枚举属性:获取或设置在父元素中构成次元素时应用于此元素的水平对齐特征
VerticalAlignment 枚举属性:获取或设置在父元素中构成次元素时应用于此元素的垂直对齐特征
也就是文本的对齐方式
<Grid>
<StackPanel Orientation="Vertical" >
<Button Name="button" Content="按钮1" HorizontalAlignment="Left" />
<Button Name="button4" Content="按钮2" HorizontalAlignment="Right"/>
<Button Name="button1" Content="按钮3" HorizontalAlignment="Center"/>
<Button Name="button2" Content="按钮4" VerticalAlignment="Top" />
<Button Name="button3" Content="按钮5"/>
</StackPanel>
</Grid>
Stackpanel布局属性
Stackpanel提供了一些用于设定子元素在父元素中呈现方式的属性,使用这些属性,开发人员可以控制 子元素在Stackpanel中的布局 方式。除了前面介绍的对齐属性以外,Stackpanel 中还具有如下的布局属性
Margin 可以在子元素四周添加空白,Margin是System.Windows.thickness结构的属性,该结构分为上、下、左、右4边,可以分别指定4个边的属性,也可以只指定一个值,则上下左右都具有相同的空白
MinWidth和NibHeight:并
使用StackPanel进行简单地布局的更多相关文章
- swing实现QQ登录界面1.0( 实现了同一张图片只加载一次)、(以及实现简单的布局面板添加背景图片控件的标签控件和添加一个关闭按钮控件)
swing实现QQ登录界面1.0( 实现了同一张图片只加载一次).(以及实现简单的布局面板添加背景图片控件的标签控件和添加一个关闭按钮控件) 代码思路分析: 1.(同一张图片仅仅需要加载一次就够了,下 ...
- css+html简单的布局demo
于html介绍css作风.可以改变html块状布局,局更加美观.接下来看一个基础布局的小样例: <html> <head> <meta http-equiv=" ...
- 简单CSS 布局
CSS Layout CSS Layout 是对上下左右布局的一个简单封装,主要针对自己项目里面方便使用. 坚持组合大于继承的原则,复杂的布局也是由简单布局组成的. 所以不习惯margin/paddi ...
- 简单CSS布局留用
1.导航栏固定显示代码,文字居中,z-index header{ position: fixed; top: 0px; left: 10%; width: 80%; height: 80px; bor ...
- 一个好用简单的布局空间EasyUI
之前项目中都是前端来新写的页面,对于很多后台管理系统来说,新写页面其实比较麻烦. 最近看到一款还是不错的开源页面框架EasyUi http://www.jeasyui.com/index.php 这是 ...
- bootstrap简单使用布局、栅格系统、modal标签页等常用组件入门
<!DOCTYPE html> <html> <head> <title>bootstrap</title> <!-- 引入boots ...
- Flex Box 简单弹性布局
弹性盒子模型有两种规范:早起的display:box 和后期的display:flex.它可以轻易的实现均分.浮动.居中等灵活布局,在移动端只考虑webkit内核时很实用. 一.display:box ...
- HTML与CSS绘制简单DIV布局
HTML代码<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF ...
- python之pyqt4的简单窗口布局以及信号和槽(上代码)
#-*- coding: utf-8 -*- import sys reload(sys) sys.setdefaultencoding('utf8') from PyQt4 import QtGui ...
随机推荐
- django系列3.1--url路由配置, 正则, 分发include, 分组命名匹配
一.url配置 在django项目中urls.py文件中就是为这个url调用的view(视图)函数之间的映射表,来配置访问的一个url执行什么代码 默认的基本格式: from django.conf. ...
- Android Studion有用的快捷键
注释:ctrl+/ 如果代码未添加注释,则添加注释上去:否则取消已经注释. 格式化代码:ctrl+alt+L l键不需要大写锁定,这里只是为了更清楚表示是L键.
- DOS磁盘操作类命令
外部命令 formAT---磁盘格式化命令 格式:formAT<盘符:>[/S][4][/Q] 1)命令收的盘符不可缺省,若对硬盘进行格式化,则会有如下提示:WARNING:ALL DA ...
- 【OCP-12c】2019年CUUG OCP 071考试题库(80题)
80.View the exhibit and examine the structure in ORDERS and ORDER_ITEMS tables. You need to create a ...
- Java面试题(全)--视频系列
此系列为面试笔试题的视频讲解,以下均为超链接,点击即可进入每个知识点的讲解. Java面试题01.面试的整体流程 Java面试题02.java的垮平台原理 Java面试题03.搭建一个java的开发环 ...
- 获取 input type="file" 标签的内容,并使用ajax进行请求到服务器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- elasticsearch-5.1.1 安装的问题
elasticsearch 5.1 安装过程中遇到了一些问题做一些记录. 问题一:警告提示 [2016-12-20T22:37:28,543][INFO ][o.e.b.BootstrapCheck ...
- Elastic Search 5.x Nest Multiple Queries C#
I'm using C# with those nuget packeges; <package id="Elasticsearch.Net" version="5 ...
- JavaScript求数组Array的并集(javascript面试常见题目)
var Utils = { joinArray:function(source,target){ for(var i = 0;i<source.length;i++){ var oa = sou ...
- Objective-C Associated Objects 的实现原理
我们知道,在 Objective-C 中可以通过 Category 给一个现有的类添加属性,但是却不能添加实例变量,这似乎成为了 Objective-C 的一个明显短板.然而值得庆幸的是,我们可以通过 ...