FineUI布局应用(二)_weixin_30767921的博客-程序员宅基地

 

一、FineUI页面布局分为

    1、Fit布局

 1   <f:Panel ID="Panel1" Title="布局Fit(Layout=Fit)" runat="server" Layout="Fit" Height="300px" EnableFrame="true" EnableCollapse="true"
 2             BodyPadding="5px" Width="850px" ShowBorder="True"
 3             ShowHeader="True">
 4             <Items>
 5                 <f:Form ID="Form2" runat="server" ShowBorder="True" BodyPadding="5px" ShowHeader="false" Title="表单">
 6                     <Rows>
 7                         <f:FormRow>
 8                             <Items>
 9                                 <f:Label ID="Label1" Label="文本" Text="文本内容" runat="server">
10                                 </f:Label>
11                             </Items>
12                         </f:FormRow>
13                         <f:FormRow>
14                             <Items>
15                                 <f:TextBox ID="TextBox1" Label="输入框" runat="server">
16                                 </f:TextBox>
17                                 <f:Button ID="Button1" Text="按钮" runat="server">
18                                 </f:Button>
19                             </Items>
20                         </f:FormRow>
21                     </Rows>
22                 </f:Form>
23             </Items>
24         </f:Panel>

    2、Anchor布局方式

 1 <f:Panel ID="Panel2" runat="server" Height="300px" Width="850px" ShowBorder="True" EnableFrame="true" EnableCollapse="true"
 2             BodyPadding="5px" Layout="Anchor" ShowHeader="True" Title="布局Anchor(Height=300px Width=750px Layout=Anchor)">
 3             <Items>
 4                 <f:Panel ID="Panel4" AnchorValue="60% 30%" runat="server"
 5                     BodyPadding="5px" ShowBorder="True" ShowHeader="false">
 6                     <Items>
 7                         <f:Label ID="Label3" ShowEmptyLabel="false" Text="AnchorValue=60% 30%" runat="server">
 8                         </f:Label>
 9                     </Items>
10                 </f:Panel>
11                 <f:Form ID="Form2" AnchorValue="100% 70%" runat="server"
12                     BodyPadding="5px" ShowBorder="True" ShowHeader="false">
13                     <Rows>
14                         <f:FormRow>
15                             <Items>
16                                 <f:Label ID="Label1" ShowEmptyLabel="false" Text="AnchorValue=100% 70%" runat="server">
17                                 </f:Label>
18                             </Items>
19                         </f:FormRow>
20                         <f:FormRow>
21                             <Items>
22                                 <f:TextBox ID="TextBox1" Label="输入框" runat="server">
23                                 </f:TextBox>
24                                 <f:Button ID="Button7" Text="按钮" runat="server">
25                                 </f:Button>
26                             </Items>
27                         </f:FormRow>
28                     </Rows>
29                 </f:Form>
30             </Items>
31         </f:Panel>

 

    3、Column

 <f:Panel ID="Panel2" runat="server" Height="250px" Width="850px" ShowBorder="True" EnableFrame="true" EnableCollapse="true"
            BodyPadding="5px" Layout="Column" ShowHeader="True" Title="布局Column(Height=250px Width=750px Layout=Column)">
            <Items>
                <f:Panel ID="Panel1" Width="200px" Height="150px"
                    runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label runat="server" Text="Width=200px Height=150px">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel4" ColumnWidth="60%" runat="server"
                    BodyPadding="5px" ShowBorder="true" ShowHeader="false" Layout="Fit">
                    <Items>
                        <f:Label ID="Label1" runat="server" Text="ColumnWidth=60%<br />长长的文本1<br />长长的文本2<br />长长的文本3<br />长长的文本4"
                            EncodeText="false">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel3" ColumnWidth="40%" runat="server"
                    BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label2" runat="server" Text="ColumnWidth=40%">
                        </f:Label>
                    </Items>
                </f:Panel>
            </Items>
        </f:Panel>

 

    4、Absolute

<f:Panel ID="Panel2" runat="server" Height="450px" Width="850px" ShowBorder="True" EnableFrame="true" EnableCollapse="true"
            Layout="Absolute" ShowHeader="True" Title="布局Absolute(Height=450px Width=750px Layout=Absolute)">
            <Items>
                <f:Panel ID="Panel1" Width="300px" Title="Panel1" Height="300px" AbsoluteX="100px"
                    BodyPadding="5px" AbsoluteY="50px" runat="server"
                    ShowBorder="True" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label3" EncodeText="false" Text="Width=300px <br/>Height=300px <br/>AbsoluteX=100px <br/>AbsoluteY=50px"
                            runat="server">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel3" Title="Panel2" Width="150px" Height="150px" AbsoluteX="450px"
                    BodyPadding="5px" AbsoluteY="150px" runat="server"
                    ShowBorder="True" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label1" EncodeText="false" Text="Width=150px <br/>Height=150px <br/>AbsoluteX=450px <br/>AbsoluteY=150px"
                            runat="server">
                        </f:Label>
                    </Items>
                </f:Panel>
            </Items>
        </f:Panel>

 

    5、Table

<f:Panel ID="Panel2" runat="server" Height="450px" Width="850px" ShowBorder="True" EnableFrame="true" EnableCollapse="true"
            Layout="Table" TableConfigColumns="3" ShowHeader="True" Title="布局Table(Height=450px Width=750px Layout=Table)">
            <Items>
                <f:Panel ID="Panel1" Title="Panel1" Width="300px" Height="210px"
                    TableRowspan="2" runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label1" runat="server" Text="Width=300px Height=210px TableRowspan=2">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel3" Title="Panel2" Width="430px" Height="100px"
                    TableColspan="2" runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label2" runat="server" Text="Width=430px Height=100px TableColspan=2">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel4" Title="Panel3" Width="200px" Height="100px"
                    runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label3" runat="server" Text="Width=200px Height=100px">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel5" Title="Panel4" Width="220px" Height="100px"
                    runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label4" runat="server" Text="Width=220px Height=100px">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel6" Title="Panel5" Width="300px" Height="100px"
                    runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label5" runat="server" Text="Width=300px Height=100px">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel7" Title="Panel6" Width="200px" Height="100px"
                    runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label6" runat="server" Text="Width=200px Height=100px">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel8" Title="Panel6" Width="220px" Height="100px"
                    runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label7" runat="server" Text="Width=220px Height=100px">
                        </f:Label>
                    </Items>
                </f:Panel>
            </Items>
        </f:Panel>

 

    6、HBox

<f:Panel ID="Panel2" runat="server" Height="250px" Width="850px" ShowBorder="True" EnableFrame="true" EnableCollapse="true"
            Layout="HBox" BoxConfigAlign="Stretch" BoxConfigPosition="Start" BoxConfigPadding="5"
            BoxConfigChildMargin="0 5 0 0" ShowHeader="True"
            Title="面板(Layout=HBox BoxConfigAlign=Stretch BoxConfigPosition=Start BoxConfigPadding=5 BoxConfigChildMargin=0 5 0 0)">
            <Items>
                <f:Panel ID="Panel1" Title="面板1" BoxFlex="1" runat="server"
                    BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label1" runat="server" Text="BoxFlex=1">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel3" Title="面板2" Width="150px"
                    runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label2" runat="server" Text="Width=150px">
                        </f:Label>
                    </Items>
                </f:Panel>
                <f:Panel ID="Panel4" Title="面板3" BoxFlex="2" runat="server"
                    BodyPadding="5px" BoxMargin="0" ShowBorder="true" ShowHeader="false">
                    <Items>
                        <f:Label ID="Label3" runat="server" Text="BoxFlex=2 BoxMargin=0">
                        </f:Label>
                    </Items>
                </f:Panel>
            </Items>
        </f:Panel>

 

    7、VBox

 1 <f:Panel ID="Panel2" runat="server" Height="450px" Width="850px" ShowBorder="True" EnableFrame="true" EnableCollapse="true"
 2             Layout="VBox" BoxConfigAlign="Stretch" BoxConfigPosition="Start" BoxConfigPadding="5"
 3             BoxConfigChildMargin="0 0 5 0" ShowHeader="True" Title="面板(Layout=VBox BoxConfigAlign=Stretch BoxConfigPosition=Start BoxConfigPadding=5 BoxConfigChildMargin=0 0 5 0)">
 4             <Items>
 5                 <f:Panel ID="Panel1" Title="面板1" BoxFlex="1" runat="server"
 6                     BodyPadding="5px" ShowBorder="true" ShowHeader="false">
 7                     <Items>
 8                         <f:Label ID="Label1" runat="server" Text="BoxFlex=1">
 9                         </f:Label>
10                     </Items>
11                 </f:Panel>
12                 <f:Panel ID="Panel3" Title="面板2" Height="100px" runat="server"
13                     BodyPadding="5px" ShowBorder="true" ShowHeader="false">
14                     <Items>
15                         <f:Label ID="Label2" runat="server" Text="Height=100px">
16                         </f:Label>
17                     </Items>
18                 </f:Panel>
19                 <f:Panel ID="Panel4" Title="面板3" BoxFlex="2" BoxMargin="0"
20                     runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="false">
21                     <Items>
22                         <f:Label ID="Label3" runat="server" Text="BoxFlex=2 BoxMargin=0">
23                         </f:Label>
24                     </Items>
25                 </f:Panel>
26             </Items>
27         </f:Panel>

转载于:https://www.cnblogs.com/1312mn/p/3590233.html

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_30767921/article/details/98794918

智能推荐

第八届蓝桥杯-2017-决赛A组-c++题解②路径之谜_志远1997的博客-程序员宅基地

路径之谜小明冒充X星球的骑士,进入了一个奇怪的城堡。城堡里边什么都没有,只有方形石头铺成的地面。假设城堡地面是 n x n 个方格。【如图1.png】所示。按习俗,骑士要从西北角走到东南角。可以横向或纵向移动,但不能斜着走,也不能跳跃。每走到一个新方格,就要向正北方和正西方各射一箭。(城堡的西墙和北墙内各有 n 个靶子)同一个方格只允许经过一次。但不必走完所有的方格。如果只给出靶子上箭的数目,你能...

c/c++实现简单线性回归问题(机器学习入门实例)_diadestiny的博客-程序员宅基地_c++线性回归

线性回归问题简单分析个人简单分析,有问题欢迎评论讨论如果给出很多组数据(x,y),求拟合一条y=wx+b直线模拟问题,高中数学也有提到过,就是求w,b两个参数,使得拟合的直线可以近似穿过目标数据区域的中间位置,尽可以使得更多的真实数据点落在拟合的直线上。这个问题常常出现在机器学习,深度学习的入门教程的前几个例子中,然而无奈网上教程都是用机器学习常用的python进行实现,作为一个习惯c/c...

Centos系统修改为静态ip_liuzh2443的博客-程序员宅基地_centos修改静态ip

修改linux为静态ipcd /etc/sysconfig/network-scriptscat /etc/sysconfig/network-scripts/ifcfg-ens33vi /etc/sysconfig/network-scripts/ifcfg-ens33BOOTPROTO=“static” #设置网卡引导协议为 静态ONBOOT=“yes” ...

远程线程注入技术 屏蔽ctrl+alt+del_weixin_33734785的博客-程序员宅基地

在NT/2000中怎么禁用Ctrl+Alt+Delete?(不能用gina,键盘驱动)在Windows2000中Ctrl-Alt-Delete组合键的处理如下:Winlogon初始化的时候,在系统中注册了CTRL+ALT+DELSecure Attention Sequence(SAS)热键,并且在WinSta0 Windows 系统中创建三个桌面。...

matlab m文件下载,M文件合集 matlab算法_侯帅英的博客-程序员宅基地

【实例简介】好东西啊 M文件 各种算法 各种求下载 求积分【实例截图】【核心代码】m文件└── m文件├── 插值│ ├── Atken.m│ ├── BSample.m│ ├── DCS.m│ ├── DH.m│ ├── DL.m│ ├── DTL.m│ ├── FCZ.m│ ├── Gauss.m│ ├── Hermite.m│ ├── ID...

随便推点

zookeeper集群搭建及分布式锁场景学习_北有池鱼的博客-程序员宅基地

zookeeper集群搭建及分布式锁场景学习zookeeper集群搭建及分布式锁场景学习1. Zookeeper功能简介2. ZooKeeper基本概念2.1 zookeeper的集群角色2.2 zookeeper节点分工2.3 session2.4 数据节点2.5 状态信息2.6 事务操作2.7 Watcher(事件监听器)3. Zookeeper应用场景3.5 zookeeper的应用场景之...

ubuntu字体丑_改善Linux子系统字体太丑,界面太丑问题_乐居买房的博客-程序员宅基地

不少同学会选择虚拟机+ubuntu作为嵌入式的开发环境,有不少同学发现了windows10系统可以安装Linux子系统,也就是在windows下直接安装一个Linux系统,让许多朋友想要试一试,但是试了之后才发现,界面是真的丑,字体也是难看的不行,十分影响开发体验,附上一张图。这也太丑了吧!!!!!!!!!其实我们可以这样,加上另一个软件,让它变得不一样这个软件就是MobaXterm,我们可以通过...

MovieMator Video Editor Pro for Mac(专业视频编辑软件) v2.5.4中文激活版_KZ第一脸蛋的博客-程序员宅基地

MovieMator Video Editor Pro for Mac(剪大师专业版)破解版是一款非常不错的视频编辑软件。MovieMator Video Editor Pro 能够提供最直观,最简单的方式,实时预览功能可以确保您所看到的内容,对于视频编辑初学者也可以快速入门并随意编辑视频。MovieMator Video Editor Pro Mac 破解版不仅允许用户进行所有基本的编辑工作,如...

常见集合源码分析(基于jdk8)_weixin_34124651的博客-程序员宅基地

为什么80%的码农都做不了架构师?&gt;&gt;&gt; ...

正向传播forward propagation:神经网络的输出表示 及其 向量化与递推关系_Norstc的博客-程序员宅基地

正向传播就是输入x一步一步从输出层经过各隐层到达输出层的过程见下图笔记NN基本结构符号约定上角标[ ],代表层数;上角标(),代表不同样本;无括号下角标,代表不同特征。计算过程向量化(将多个样本写成矩阵) i层与i+1层的递推关系维数的对应关系Z^[i+1]: (n^[i+1], m)W^[i+1]: (n^[i+1], n^[i...

一段通讯传输的代码_hanabc12345678的博客-程序员宅基地

/没看懂,先标记了以后看/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*pack

推荐文章

热门文章

相关标签