惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

罗磊的独立博客
www.infosecurity-magazine.com
www.infosecurity-magazine.com
V
Visual Studio Blog
T
The Blog of Author Tim Ferriss
GbyAI
GbyAI
Y
Y Combinator Blog
雷峰网
雷峰网
Last Week in AI
Last Week in AI
Jina AI
Jina AI
月光博客
月光博客
G
Google Developers Blog
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
Webroot Blog
Webroot Blog
Google DeepMind News
Google DeepMind News
博客园 - 三生石上(FineUI控件)
Hacker News - Newest:
Hacker News - Newest: "LLM"
N
News | PayPal Newsroom
H
Heimdal Security Blog
Recorded Future
Recorded Future
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
腾讯CDC
AWS News Blog
AWS News Blog
NISL@THU
NISL@THU
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
博客园 - 【当耐特】
P
Privacy International News Feed
I
Intezer
V
Vulnerabilities – Threatpost
The GitHub Blog
The GitHub Blog
L
LINUX DO - 最新话题
S
Schneier on Security
C
CXSECURITY Database RSS Feed - CXSecurity.com
小众软件
小众软件
博客园 - 聂微东
V2EX - 技术
V2EX - 技术
W
WeLiveSecurity
Security Latest
Security Latest
PCI Perspectives
PCI Perspectives
The Hacker News
The Hacker News
T
Threatpost
C
Check Point Blog
Threat Intelligence Blog | Flashpoint
Threat Intelligence Blog | Flashpoint
Latest news
Latest news
L
LINUX DO - 热门话题
J
Java Code Geeks
A
Arctic Wolf
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
K
KPMG report finds enterprise disconnect between AI and its ROI | CIO
T
Troy Hunt's Blog

博客园 - Kenshin.L

[Flex]flex-htmlfilter swc complete [Flex]Adobe BrowserLabe [Flex]构建基于Flex技术的Blog程序(一) [Flex]Flex Ioc Framework - Parsley [Flex]用编程的方式来写CSS - LESS的应用(一) [Flex]Flex SDK 4(Gumbo)浅析ASDoc - ASDoc MXML应用篇 [Flex]Flex SDK 4(Gumbo)自定义皮肤 - SilverGreen(Spark) 下载 [Flex]Flex SDK 4(Gumbo)浅析ASDoc - ASDoc Tags参数篇 [Flex]Flex SDK 4(Gumbo)浅析ASDoc - Flash Builder 4配置篇 [Flex]Flex SDK 4(Gumbo)自定义皮肤 - SilverGreen(Spark和Halo)预览版 [Flex]Flex SDK 4(Gumbo)浅析SDK 4默认的Spark样式与Halo样式 [Flex]Flex SDK 4(Gumbo)更方便的自定义样式、自定义SparkSkin(三) [Flex]Flex SDK 4(Gumbo)改善的Layout和Scroller(二) [Flex]Flex编程注意之直接获取某个组件的对象(this[]用法) [Flex]Flex编程注意之自动获取焦点、监听全局键盘事件 [Flex]Flex SDK 4(Gumbo)更方便的自定义样式、自定义SparkSkin(二) [Flex]Flash Builder 4 编辑器配色方案 - 黑色系 [Flex]Flex SDK 4(Gumbo)更方便的自定义样式、自定义SparkSkin(一) [RIA]HTML5怎么就成了RIA“杀手”?
[Flex]Flex SDK 4(Gumbo)改善的Layout和Scroller(一)
Kenshin.L · 2009-07-15 · via 博客园 - Kenshin.L

详细请看:http://www.k-zone.cn/zblog/post/flex-gumbo-layout-scroller-1.html
Flex SDK 4(Gumbo)
在布局(Layout)和可视区域(Scroller)上面与Flex SDK 3还是有些差异性的,如果用户不了解这些差异性,会在实际相中出现奇怪的问题。
因此我们需要深入了解一下Flex SDK 4(Gumbo)的布局方式(Layout)和可视区域(Scroller)的事情。

本篇文章描述的内容是布局(Layout
Flex SDK 4(Gumbo)spark组件库里面增加了一个page:spark.layouts。
其中包括了比较重要的四个布局class,分别是:BasicLayout、HorizontalLayout、TileLayout、VerticalLayout

1、BasicLayout:(默认属性,当不指定定位后,则是绝对定位布局)
这是spark组件默认Flex SDK 3的布局方式,即绝对定位布局。
Flex SDK 3 里面对应的是:layout="absolute"
具体效果请看截图:

2、HorizontalLayout
这是spark组件库里面的水平布局方式。
在里面对应的是:layout="horizontal"
具体效果请看截图:

3、VerticalLayout
这是spark组件库里面的竖直布局方式。
Flex SDK 3 里面对应的是:layout="vertical"
具体效果请看截图:

4、TileLayout
这是spark组件库新增的布局方式,即格子布局方式。
TileLayout布局方式可以说是HorizontalLayout和VerticalLayout结合的方式。
具体效果请看截图:

还有一点是需要注意的:
paddingLeft、paddingRight、paddingTop、paddingBottom
这四个属性已经转移到了HorizontalLayout、VerticalLayout里面。这点也与Flex SDK 3有些区别。
也就是说,在spark组件中的容器,已经不具备paddingLeft、paddingRight、paddingTop、paddingBottom属性了。

关于如何使用布局功能:
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/halo" 
      width="100%" height="100%">

      <s:layout>
            <s:VerticalLayout horizontalAlign="center" paddingTop="30"/>
      </s:layout>
................................................................................

上面的布局解释为:
1、在s:Application下面的布局方式。
2、s:VerticalLayout指定为垂直布局。

如果将<s:layout>.....</s:layout>定义在某个容器里面,那么就是针对于某个容器而定义的布局。

例如:
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/halo" 
      width="100%" height="100%">

      <s:layout>
            <s:VerticalLayout horizontalAlign="center" paddingTop="30"/>
      </s:layout>

      <s:Panel width="400" height="400" title="Panle">

      <s:layout>
            <s:VerticalLayout horizontalAlign="center" paddingTop="30"/>
      </s:layout>
................................................................................

附录:Flex SDK 4(Gumbo) spark组件中比较常见的容器)
1、Group:
相当于Canvas、默认是BasicLayout方式)
2、HGroup:
相当于HBox,因此只有一种布局方式:HorizontalLayout布局。
3、VGroup:
相当于VBox,因此只有一种布局方式:VerticalLayout布局。
4、Panel:
Flex SDK 3的Panel在作用上是一样的,默认布局方式是BasicLayout布局。