`

块布局(constraintColumns、constrainRows)

    博客分类:
  • Flex
阅读更多

label控件不支持换行,text控件支持换行,text控件设置left top right buttom属性后,文本可换行。
控件要基于浏览器的中央显示,设置horizontalCenter和verticalCenter为0

 

块布局:

块标记ConstraintColumn和ConstraintRow

使用方法:

<mx:constraintColumns>
	<mx:ConstraintColumn id="column1" width="33%"/>
	<mx:ConstraintColumn id="column2" width="33%"/>
	<mx:ConstraintColumn id="column3" width="33%"/>
</mx:constraintColumns>
<mx:constrainRows>
	<mx:ConstrainRow id="row1" height="60%"/>
	<mx:ConstrainRow id="row1" height="40%"/>
</mx:constrainRows>
<mx:Text height="100%" left="20" right="column1:20" top="20" bottom="row1:20">
	<mx:text>this is text1 text</mx:text>
</mx:Text>
<mx:Text height="100%" left="column2:20" right="column2:20" top="row2:20" bottom="20">
	<mx:text>this is text2 text</mx:text>
</mx:Text>
<mx:Text height="100%" left="column3:20" right="20">
	<mx:text>this is text3 text</mx:text>
</mx:Text>
 
分享到:
评论

相关推荐

    40种网页布局源代码

    8. Grid布局属性:`display: grid`创建Grid容器,`grid-template-columns/rows`定义列/行的数量,`grid-gap`设置网格间距,`grid-template-areas`用于创建自定义的网格模板,`grid-auto-flow`控制自动放置的模式。...

    winform VS窗口布局的框架 灵活拖拽布局

    在Windows Forms(Winform)开发中,创建美观且可自定义布局的用户界面是一项重要的任务。Visual Studio(VS)提供了一种强大的工具,允许开发者构建这样的界面,但是默认的布局管理有时并不能满足所有复杂的需求。...

    div+css布局大全

    6. **Flexbox布局**:弹性盒模型(Flexbox)是现代CSS布局的一个重要工具,适用于单一维度的布局(如行或列)。它简化了对元素的对齐、排序和分配空间的操作,尤其适合响应式设计。 7. **Grid布局**:CSS网格布局...

    table布局网页转换为div+CSS布局的转换软件

    在网页设计领域,传统的`table`布局曾是构建网页结构的主要方式,但随着Web标准的发展,`div`结合`CSS`布局(层叠样式表)逐渐成为主流。`table`布局虽然简单易用,但在复杂性和可维护性上存在诸多问题,如不易控制...

    简单的JSP页面布局

    它可以用来设置字体、颜色、间距等样式属性,同时也可以实现更复杂的布局模式,如流式布局、网格布局和Flexbox布局。通过CSS,我们可以精确控制元素的位置和大小,实现响应式设计,让页面在不同设备上都能良好展示。...

    网络拓扑自动布局算法

    网络拓扑自动布局算法是计算机科学领域中网络可视化的一个重要组成部分,主要目的是将复杂的网络结构以清晰、有组织的方式呈现出来。在实际应用中,如网络监控、系统管理、网络安全分析等,网络拓扑图的可视化能帮助...

    liferay布局的制作

    在 Liferay 中,布局(Layout)是指页面的结构和组织方式,包括不同区域(columns)和行(rows)的配置,用于定义用户界面的显示样式。制作 Liferay 布局是自定义门户体验的关键步骤。以下将详细介绍在 Liferay 6 中...

    android自定义圆形布局CircleLayout

    在Android开发中,自定义布局是提升应用独特性和用户体验的重要手段。`CircleLayout`就是一种特殊的自定义布局,它使得内部的子视图按照圆形排列,增强了界面的视觉效果。本篇文章将深入探讨如何实现这样一个自定义...

    Div自定义页面布局

    可以通过设置`display`属性将其变为行内块元素或灵活的布局元素。例如: ```html ;"&gt; ``` 在自定义页面布局中,我们通常会结合CSS来定位和调整`Div`的尺寸。使用`width`、`height`、`margin`、`padding`等属性可以...

    html网站布局典型模板

    `开启网格布局,`grid-template-columns`和`grid-template-rows`定义网格的列数和行数,`grid-gap`设置间距,`grid-template-areas`则允许自定义区域名称。 7. 经典模板:这个压缩包可能包含如“三栏布局”、“头尾...

    HTML5全兼容九宫格布局

    这种布局方式常用于展示图片、卡片或信息块,如社交媒体网格、产品目录等,其核心是将屏幕划分为9个相等大小的单元格,每个单元格可以独立展示内容。 九宫格布局的关键在于如何实现跨浏览器的兼容性和适应不同屏幕...

    android框架布局demo

    在Android开发中,布局(Layout)是构建用户界面的核心元素,它定义了屏幕上各个组件的排列方式和相互关系。本示例"android框架布局demo"旨在帮助开发者更好地理解和运用Android中的布局管理技术。通过这个简单易懂...

    移动端布局之流式布局(百分比布局)

    在移动端开发中,布局设计是至关重要的一个环节,它直接影响到应用或网站在不同设备上的显示效果和用户体验。本文将深入探讨“流式布局”这一主题,它是一种基于百分比的布局方式,能够灵活适应不同屏幕尺寸,实现...

    边界布局——BorderLayout

    例如,`add(Component comp, String constraint)`方法中的`constraint`参数就是区域名,如`BorderLayout.NORTH`。 3. **尺寸调整**: - **North**和**South**区域的组件高度固定,不会随着容器大小改变而伸缩。 -...

    duilib入门和xml培训 布局案例

    - **控件(Widget)**: Duilib中的基本构建块,包括按钮、文本框等常见的界面元素。 - **窗口(Window)**: 控件的容器,可以包含多个控件,构成复杂的界面层次结构。 - **布局(Layout)**: 控制控件在窗口中的...

    iframe网页上下左右布局模板

    iframe网页上下左右布局模板,可以修改里面的css代码来更改各个模块的大小,位置。很基本使用的网页布局模板

    Div+CSS 3.0网页布局案例精粹

    Grid提供了`grid-template-columns`、`grid-template-rows`、`gap`等属性,让布局变得简单而强大。 6. **浮动和清除**:在CSS 3.0之前,浮动(float)常被用来实现流式布局,但这种方法存在一些局限性。书中可能会...

    等高响应布局实现

    等高响应布局是一种网页设计技术,它旨在确保页面上的元素,如图片或内容块,能够根据屏幕尺寸自动调整高度,保持一致的视觉效果,无论在桌面还是移动设备上浏览。这种布局方式尤其适用于展示类网站,例如摄影展览,...

    MasonryIOS自动布局框架

    7. **嵌套布局**:支持嵌套布局,可以在一个布局块内嵌套另一个布局块,使布局逻辑更加清晰。 ### 使用 Masonry 的基本步骤 1. 引入库:首先,你需要将 Masonry 项目添加到你的 Xcode 项目中,可以通过 CocoaPods ...

    Fragment实现横竖屏布局

    Fragment的设计使得应用在不同设备和屏幕尺寸上表现得更加灵活,尤其在处理横竖屏切换时,可以实现不同布局的适配。在本案例中,“Fragment实现横竖屏布局”主要是指如何利用Fragment来设计适应横竖屏切换的应用界面...

Global site tag (gtag.js) - Google Analytics