云原生社区 > 容器服务 > 正文

ext-js中的容器和布局(介绍)

简介:
+关注继续查看

 什么是容器(Container)

Extjs被称为是最强大的前端组件库,组件,也就是Component,是可以复用的代码块,并且直接可以和浏览器配合形成最终外观。而容器,是一种特殊的组件,说白了就是用来包含其他组件的组件。而我们的extjs的应用是由若干的组件,以及组件的排列组合嵌套共同组成。

什么是容器布局(Layout):

因为容器是用包含其他组件的,所以容器肯定有一种机制来管理在其中的各个组件,包括它内部的各个组件的尺寸和位置,这时候,布局(Layout)就闪亮登场了

布局生效时间:

一旦设定好了值之后,当初始化组件时,extjs会自动调用容器的doLayout方法,这个方法的作用是计算出所有子组件的尺寸和位置,并且更新到DOM树。doLayout是一种递归调用机制,所以会层层计算直到最底部,一般开发时候程序员不用主动去调用,extjs框架会自动调用。

当我们对于组件进行了任何添加删除或者容器被resize的时候,会触发容器的redoLayout,从而重新计算各个组件的尺寸和位置。我们可以用suspendLayout方法+手动调用doLayout来阻止容器自动布局,而是我们自己来负责布局。

什么是组件布局:

如果是extjs自带的预定义组件,那么我们无需去担心布局问题,因为框架设计者已经为我们做好了一切,但是如果是自己定义的组件,那么我们需要给一个布局方式参数,用componentLayout,否则,它会自动的使用默认的auto的方式进行布局。

 





本文转自 charles_wang888 51CTO博客,原文链接:http://blog.51cto.com/supercharles888/1192044,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
翻阅必备,一看必知——Java -GUI界面设计(容器,布局,监听,事件 API大全
翻阅必备,一看必知——Java -GUI界面设计(容器,布局,监听,事件 API大全
26 0
flex布局之容器元素属性
flex布局之容器元素属性
85 0
Java GUI 容器与布局
Java GUI 容器与布局
80 0
连续三年入围 Gartner 容器竞争格局,阿里云容器服务新布局首次公开
近日,国际知名信息技术咨询机构 Gartner 发布 2021 年容器竞争格局报告,阿里云成为国内唯一连续三年入选的中国企业,产品丰富度与成熟度持续保持全球领先水平。
730 0
连续三年入围 Gartner 容器竞争格局,阿里云容器服务新布局首次公开
阿里云连续三年国内唯一入围Gartner容器竞争格局,解读业界‘顶流’的产品布局。
1399 0
赛题解析 | 初赛赛道2:实现规模化容器静态布局和动态迁移
参赛者需要实现两个功能,一个用于实现规模化的容器静态布局功能,一个用于实现规模化的容器动态迁移功能。
748 0
Flex 布局 - 容器
版权声明:本文首发 http://asing1elife.com ,转载请注明出处。 https://blog.csdn.net/asing1elife/article/details/82862174 ...
961 0
容器服务
+关注
国内唯一 Forrester 公共云容器平台领导者象限。
+关注
余二五
文章
问答
视频
相关电子书
更多
阿里巴巴集团容器技术现状与未来路线
立即下载
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
相关实验场景
更多