锚点布局的典型结构:

<x:Panel Layout="Anchor" runat="server">

             <Items>
                 <x:Panel runat="server" AnchorValue="100% 30%"></x:Panel>
                   <x:Panel runat="server" AnchorValue="100% 70%"></x:Panel>
             </Items>

6         </x:Panel>

有两个关键点:

1.父容器的LayOut属性设置为anchor

2.每个子容器控件设置AnchorValue属性,用来子控件的锚点布局参数。

AnchorValue的取值

有两个值组成,中间空格分割。也可以由一个值,第二个值就是默认值了。

这两个值分布表示水平的锚点值和垂直的锚点值。就是宽度和高度、

AnchorValue可以由百分值或者整形值构成。

  • 百分值
    • AnchorValue="100% 60%",表示此控件占据全部的宽度和60%的高度。
    • AnchorValue="100%",此控件占据全部的宽度,高度自动。
  • 整型值(可以是正值或者负值)
    • AnchorValue="-100 -20",表示此控件右边框距离父控件右边框100px,此控件下边框距离父控件下边框20px。
    • AnchorValue="100 20",表示此控件右边框超出父控件右边框100px,此控件下边框超出父控件下边框20px。

也可以如此:

AnchorValue="100% -20",表示此控件占据父控件全部宽度,此控件下边框距离父控件下边框20px。

FineUI第十二天---锚点布局的更多相关文章

  1. FineUI第十四天---布局之垂直布局和水平布局

    布局值水平布局和垂直布局 垂直盒子布局和水平盒子布局非常灵活易用,在很大程度上能够取代锚点布局,行布局和列布局. 1.垂直盒子布局: BoxConfigAlign:控制子容器的的尺寸 Start:位于 ...

  2. FineUI第十三天---`列布局

    这是经典的列布局:                  <x:Panel runat=                     <Items>                      ...

  3. ExtJs 添加员工 实例 ---- 锚点布局 anchor 可自动伸缩

    代码如下: <script type="text/javascript"> Ext.onReady(function () { // 创建一条记录行, job 为 di ...

  4. 锚点布局anchorlayout在kv中的引用

    from kivy.app import App from kivy.uix.anchorlayout import AnchorLayout from kivy.uix.button import ...

  5. FineUI页面布局

    使用布局的优势 相对于为控件设置固定的宽度和高度,布局的重要意义在于子控件可以根据父控件的尺寸自动设置自己的尺寸,在页面尺寸改变时同样有效.如果你在项目中遇到类似如下的需求,就需要考虑布局了: 面板填 ...

  6. 第五篇:在SOUI中使用XML布局属性指引(pos, offset, pos2type)

    窗口布局的概念 每一个UI都是由大量的界面元素构成的,在Windows编程,这些界面元素的最小单位通常称之为控件. 布局就是这些控件在主界面上的大小及相对位置. 传统的布局一般使用一个4个绝对坐标来定 ...

  7. 深入浅出ExtJS 第六章 布局

       6.1 布局的用途 6.1 布局的用途 //决定把什么东西放到什么位置; var vieport = new Ext.Viewport({ layout:'border', //使用Border ...

  8. Ext.Net 布局

    Ext.Net 布局 Panel布局类有10种:容器布局,自适应布局,折叠布局,卡片式布局,锚点布局,绝对位置布局,表单布局,列布局,表格布局,边框布局       1,Ext.layout.Cont ...

  9. FineUI属性的简单总结

    .PageManager控件— 页面级别的控制(包括主题.语言 等等) 覆盖web.config中自定义结点的配置 EnablePageLoading:是否启用页面的第一次加载提示,默认居中显示加载图 ...

随机推荐

  1. photoshop工具使用的简单介绍

    photoshop工具使用的简单介绍 我所用PhotoShop版本号是cs6,这里对其主要功能做一个简单介绍. 第一部分: 首先,ps的界面主要分为了6部分: 一.最上面的一行的菜单栏,菜单中有:文件 ...

  2. MySql视图、存储过程、函数、索引

    一.视图 视图是查询命令结果构成的一个虚拟表(非真实存在),其本质是[根据SQL语句获取动态的数据集,并为其命名],用户使用时只需使用[名称]即可获取结果集合,并可以当作表来查询使用. 1创建视图 - ...

  3. 二维码(QRcode)容量的计算与版本

    4.版本信息:即二维码的规格,QR码符号共有40种规格的矩阵(一般为黑白色),从21x21(版本1),到177x177(版本40),每一版本符号比前一版本每边增加4个模块. 177 = 21+(40- ...

  4. libuv(不断更新)

    /* * Initialize the uv_async_t handle. A NULL callback is allowed. * * Note that uv_async_init(), un ...

  5. ubuntu-E:Encountered a section with no Package: header的解决办法 (转)

    E:Encountered a section with no Package: header, E:Problem with MergeList /var/lib/apt/lists/cn.arch ...

  6. Java TCP编程

    Java编写TCP编程--回射信息实例 注:简单的tcp联系,还存在问题,readUTF()为阻塞型,如果之前的用户一直不输入,则一直阻塞,之后的用户再连接会出现问题. import java.io. ...

  7. Python之路【第四篇】:模块

    什么是模块: 模块就是一个功能的集合. 模块就和乐高积木差不多,你用这些模块组合出一个模型,然后也可以用这个模块加上其他的模块组合成一个新的模型 模块的种类: 1.内置模块(python自带的比如os ...

  8. line-height:150%和 line-height:1.5 的区别

    父元素line-height为150%或1.5em时,依据父元素的字体大小计算出行高值让子元素继承父元素line-height为1.5时,依据子元素字体大小计算其行高值.

  9. aop测试jdk代理机制

    //测试jdk代理机制 @Test public void testProxy(){ final UsbDisk usbDisk = new UsbDisk(); //类加载器,接口,匿名内部类 // ...

  10. 做技术最自由,在IT最幸福!

    这些天来,一直感觉"做技术最自由,在IT最幸福!" 在IT最幸福 一直感觉从事IT行业最幸福,想想那些干机械的.干汽修.地勤的,让我干那些工作,对我来说真是折磨! 大体总结以下几点 ...