Ext.layout.VBoxLayout扩展自Ext.layout.BoxLayout,其xtype值为vbox。
主要配置项:
align:子元素在水平方式的对齐方式,可选值有left、center、stretch(水平伸展)、stretchmax,默认为left。
flex:垂直伸缩。将面板的body高减去不伸缩的子元素的高后剩余的高度等分成【flex和值】份,子元素伸缩后占的份数。默认为0,即不伸缩。
pack:子元素在垂直方向的包装方式,可选值有start、center、end,默认为start。
new Ext.Panel({
title: "垂直盒布局(VBoxLayout)",
width: 500,
height: 300,
renderTo: "div2",
frame: true,
layout: "vbox",
layoutConfig: {
align: "left",
pack: "start"
},
items: [
{xtype:"button", text:"按钮1", width:40, flex:1},
{xtype:"spacer", flex:1},
{xtype:"button", text:"按钮2", width:60, flex:1},
{xtype:"spacer", flex:1},
{xtype:"button", text:"按钮3", width:80, flex:1},
{xtype:"spacer", flex:1},
{xtype:"button", text:"按钮4", width:100, flex:1}
]
});


- 大小: 14 KB
分享到:
相关推荐
**垂直布局(VBoxLayout)**:控件按垂直方向排列。 **网格布局(GridLayout)**:控件按照网格的方式排列,可以指定控件所在的行列位置。 学习布局系统可以帮助你创建出更加美观和易用的用户界面。例如,使用网格...
- QDesigner提供了多种布局方式,包括水平布局(HBoxLayout)、垂直布局(VBoxLayout)、网格布局(GridLayout)等。 - 通过右键菜单可以为控件添加布局。 5. **信号与槽机制**: - 选中一个控件后,在“信号”选项卡...
SFML 小部件SFML 的简单 GUI 模块。...:ProgressBar : 一个简单的水平进度条gui::Slider : 提供垂直或水平滑块gui::TextBox : 单行文本编辑器布局: gui::HBoxLayout : 水平排列小部件gui::VBoxLayout : 垂直gu
通过VBoxlayout将控件垂直堆叠起来,创建了一个简单易懂的用户界面。 通过本例代码和知识点的学习,开发者可以了解到如何使用PyQt5创建一个带有暗黑风格的计时器应用程序,并掌握了多线程编程、定时器的使用以及QSS...
scratch少儿编程逻辑思维游戏源码-减压游戏.zip
少儿编程scratch项目源代码文件案例素材-英勇之鸟.zip
少儿编程scratch项目源代码文件案例素材-羊羊繁殖V2.5.zip
scratch少儿编程逻辑思维游戏源码-加特林混战 多人游戏.zip
少儿编程scratch项目源代码文件案例素材-西装英雄.zip
在使用 R 语言进行科研绘图时,颜色的选择是一件让人特别纠结的事情。本系列文章介绍了 R 语言科研绘图时常用的一些配色。本资源给大家提供了文章对应的 PPT。
scratch少儿编程逻辑思维游戏源码-海洋战争.zip
少儿编程scratch项目源代码文件案例素材-万圣夜惊魂.zip
HarmonyOS安全开发赋能,含有HarmonyOS多个场景的安全策略赋能
平台的服务端和客户端源码 整理出来的的游戏源码
scratch少儿编程逻辑思维游戏源码-街头霸王.zip
少儿编程scratch项目源代码文件案例素材-小船.zip
scratch少儿编程逻辑思维游戏源码-几何冲刺(4).zip
少儿编程scratch项目源代码文件案例素材-消灭病毒大作战.zip
scratch少儿编程逻辑思维游戏源码-功夫猫.zip
scratch少儿编程逻辑思维游戏源码-节奏积木 马里奥.zip