flex容器解析
通常在Flex种有两种形式的容器:布局和导航。
在容器中我们可以同时设置一些空间和子容器,我们可以叫在容器内定义的任何组件为该容器的孩子。
在一个Flex程序的根部是一个叫做Application Container的容器,代表整个Flash Player的画图面板,这个容器用来装载该程序中其他所有的控件和子容器。
不同的容器定义了不同的布局规则:
除了Canvas容器外,其他所有的容器都自持自动(automatic)布局,在这种类型的布局中,我们不需要去举止指定一个组件的坐标(x,y),相反,我们可以通过调整容器的各种属性去布局,如调整子组件之间的位置顺序,如果设置一些容器得子属性,如gaps,或者设置一个Spacer子控件等。举个例子,我们可以用HBox来让子控件呈水平排列。
Canvas容器采用的是绝对布局形式,这样我们可以随意指定一个子组件的X和Y坐标,另外我们也可以用constraints-base布局来控制离父容器的边距,底线和中心点。
布局容器:用来控制子组件的大小和位置,比如Grid布局容器规定了其子组件的形式就像HTML中的table一样,而DividedBox容器在中间有一条分界线,可以让用户随意拖动分界线来改变分界线两侧区域的大小。而TitleWindow容器也提供一个bar,她能包含标题和状态的信息。
导航容器: 主要提供导航让用户选择各种功能,如菜单容器,tab容器等
|
容器名 |
类型 |
简介 |
|
Accordion |
导航 |
将不同类型的信息放入一系列定义好的panel中,在任何时间内总是有一个panel处在激活状态 |
|
ApplicationControlBar |
布局 |
用来存放子组件并提供全局导航和各种应用程序的命令。可以被放在一个Application容器的最顶端。 |
|
Box (HBox and VBox) |
布局 |
以水平或者垂直的方式布局子组件。 |
|
Canvas |
布局 |
该容器中的子组件必须明确的给定坐标位置。 |
|
ControlBar |
布局 |
可以将子组件放置在一个panel或者TitleWindow的下边缘。 |
|
DividedBox (HDividedBox VDividedBox) |
布局 |
水平或者垂直的布局其子组件,类似Box容器,只是其中多了一条水平或者垂直的分界线将容器分割成两个区域。 |
|
Form |
布局 |
可以用来设计一个表单 |
|
Grid |
布局 |
可以布局一个类似HTML table的形式 |
|
Panel |
布局 |
显示一个title bar,一些说明,边框和一些子组件 |
|
TabNavigator |
导航 |
可以设置许多tab,选择不同的tab选项卡可以切换到不同的内容区域。 |
|
Tile |
布局 |
有点类似grid 可以指定行数和列数。 |
|
TitleWindow container |
布局 |
类似一个window窗口,有关闭按钮,标题栏,菜单栏等。 |
|
ViewStack |
导航 |
一个类似栈的导航容器 |
flex容器解析的更多相关文章
- CSS3 flexbox 布局 ---- flex 容器属性介绍
flexbox布局是CSS3中新增的属性,它可以很轻松地帮我们解决掉一些常见的布局问题,比如导航栏. 我们用普通的方法写导航栏,通常会在ul, li 结构写好后,让li 元素左浮动,然后再给ul 清浮 ...
- Java容器解析系列(0) 开篇
最近刚好学习完成数据结构与算法相关内容: Data-Structures-and-Algorithm-Analysis 想结合Java中的容器类加深一下理解,因为之前对Java的容器类理解不是很深刻, ...
- 微信小程序flex容器属性详解
flex容器属性详解 flex-direction决定元素的排列方向 flex-wrap决定元素如何换行 flex-flow 是 flex-direction 和flex-wrap的简写 justif ...
- [CSS七分钟系列]都1902年了,还不知道用margin:auto给flex容器内元素分组?
最近看到几篇博文讲解margin:auto在flex容器中的使用,可惜的是大多讲解都浮于页面表现,没深究其中的作用机理,本文在此浅薄对其表现机理做简单探讨. 引子 日常业务迭代过程中,flex已经是前 ...
- flex容器属性(一)
一,概念 flexible box ,意为"弹性布局",用来为盒状模型提供最大的灵活性. 块级布局更侧重于垂直方向,行内布局更侧重于水平方向,于此相对的,弹性盒子布局算法是方向无关 ...
- Flex 容器基本概念
申明文章出处:http://www.adobe.com/cn/devnet/flex/articles/flex-containers-tips.html Flex 4 容器可以提供一套默认的布局:B ...
- weui.css中flex容器下子项目的水平和垂直居中
想用weui.css写微信平台的页面,发现没有让flex(weui-flex)容器下,子项目(weui-flex__item)居中的类. 百度了一下,是用justify-content:center; ...
- flex词法解析
例子1.从标准输入的字数.单词.行数统计 %{ #include <string.h> int chars = 0; int lines = 0; int words = 0; %} %% ...
- 小程序flex容器
flex:默认:水平方向是主轴,垂直方向是交叉轴,分布在第四象限,项目时在主轴方向上排列, 排满之后在交叉轴方向上换行: 1.设置容器的属性 display:flex 通过设置坐标轴来设置项目的排列方 ...
随机推荐
- Grid++Report支持CS/BS模式的表报插件
Grid++Report 可用于开发桌面C/S报表与WEB报表(B/S报表),C/S报表开发适用于VB.NET.C#.VB.VC.Delphi等.WEB报表开发适用于ASP.ASP.NET.JSP/J ...
- POJ1094 Sorting It All Out(拓扑排序)
Sorting It All Out Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 30110 Accepted: 10 ...
- Android,使用Json发送数据中,使用的Java转义字符 KanKan原创
kankan原创 与php后台发送数据的时候.要求用到这样的格式. private void sendJson(){ //初始化自己定义的handler CashHandler handler = n ...
- hdu 4930 Fighting the Landlords--2014 Multi-University Training Contest 6
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4930 Fighting the Landlords Time Limit: 2000/1000 MS ...
- Hacker(五)----黑客专用通道--->端口
计算机中,端口是计算机与外部进行通信交流的出口.计算机本身携带的物理端口(键盘.鼠标.显示器等输入/输出接口)已经无法满足网络通信的要求,因此TCP/IP协议就引入了一种称为Socket的应用程序接口 ...
- 安装sql server 2008 management studio时,提示升级VS2008 到 SP1
安装sql server 2008 management studio时,提示错误:此计算机上安装了 Microsoft Visual Studio 2008 的早期版本.请在安装 SQL Serve ...
- 【计算几何初步-凸包-Graham扫描法-极角序】【HDU1348】 WALL
Wall Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Submi ...
- HDU 5787 K-wolf Number
题意:l-r之间有多少个数,其连续k位不存在相同的数字 分析:数位dp,从高位开始向低位进行枚举.因为连续k个数字不相同,在枚举一个数字的时候, 要知道前k-1位的内容,这可以用一个4维的数组表示,再 ...
- 基于实际项目的SQL学习总结
青云 随笔 - 2, 文章 - 0, 评论 - 1, 引用 - 0 一个项目涉及到的50个Sql语句(整理版) /* 标题:一个项目涉及到的50个Sql语句(整理版) 说明:以下五十个语句都按照测 ...
- iOS中json解析出现的null,nil,NSNumber的问题
在iOS开发过程中经常需要与服务器进行数据通讯,Json就是一种常用的高效简洁的数据格式. 问题现象 但是几个项目下来一直遇到一个坑爹的问题,程序在获取某些数据之后莫名崩溃.其实很早就发现了原因:由于 ...