码迷,mamicode.com
首页 > 其他好文 > 详细

smartClient 3--布局

时间:2017-11-25 23:40:46      阅读:166      评论:0      收藏:0      [点我收藏+]

标签:在线   str   title   otto   win   star   page   tac   大小   

一、组件的布局(如何将组件按照想要的方式进行布局,如左右布局,上下布局等等,这里是大框架下的整体布局)
  1. HLayout  水平
  2. VLayout   垂直
  3. HStack     水平但是width不管
  4. VStack     垂直但是width不管
    isc.HLayout.create({
       ID: "pageLayout",
       width: "100%",
       height: "100%",
       membersMargin: 10,        //members之间的margin
       layoutMargin: 10,         //layout周围的margin
       members: [                                                      //members可以是组件的引用,也可以是在线create,组件成员也可以嵌套layout布局
          isc.Label.create({
              layoutAlign: "left | right | top | bottom | center",    //member(这里指组件)对其方式
              showResizeBar: true | false,                            //member之间是否显示 调整大小栏
              width: 100,        
    //注意,layout管理器不会根据layout自身大小(即container大小)自动调整members的大小(即不会自适应)
    //如果内容(这里指members)撑开layout,将会自然状态撑开,所以可以根据所需设置overflow(hidden | visible | scroll | auto)
    height: 100 }), isc.Button.create() ] });

     

members中的容器组件(container components)
    a.    SectionStack    是分装用户可扩展、可折叠的组件的容器
    b.    TabSet            是分装tabs组件的容器
    c.    Window           是分装模拟window特性(可拖动,可resize)的组件的容器
 
二、表单的布局(如何进行表单中label、controls的行列布局)注意:这里表单布局类似HTML中的table,分成行和列,以grid网格的形式呈现
    1、表单布局属性    
     numCols    总列数(label和控件各占一列呈水平布局,所以通常设置总列数是 2*n)
        titleWidth    title 即 label 的宽度
        colWidths    可选,所有列的宽度(数组形式),如果设置,则会覆盖表单布局自动计算的每个col的宽度    

 

   
    2、field字段属性
        colSpan                                // int,跨列 
        rowSpan                               //int,跨行
        startRow: true | false              //是否应该开始新行
        endRow: true | false               //是否应该结束行
        showTitle: true | false             //控件是否显示label
        align: "left | right | center"       //控件对齐方式    

 

       
 
 
 
 

smartClient 3--布局

标签:在线   str   title   otto   win   star   page   tac   大小   

原文地址:http://www.cnblogs.com/hihao/p/7896956.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!