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

智能推荐

ArcEngine制作专题地图(上,标题、图例)(20190920)_冉总的博客-程序员宅基地_arcengine专题地图

1、需求为地图添加地图的基本要素(图例、比例尺、指北针)及相关注记,并将地图导出为图片。2、解决方案(1)创建地图的基本要素主要用到IMapFrame接口中的CreateSurroundFrame方法;(2)控制地图的基本要素主要用到IMapSurround接口;(3)还有一个IMapSurroundFrame接口,这个是做什么的我也不知道怎么表达,代码中慢慢意会吧;(4)通过一个标志...

原始dao的开发和mapper代理开发_猩猩之火的博客-程序员宅基地

一:原始dao开发方法  概要:1.在上篇中搭建好的框价中编写dao接口和dao实现类     2.向dao接口实现类中注入SqlSessionFactory,在方法体内通过SqlSessionFactory创建sqlSession.DAO接口类UserDAO.java   package com.mybatis.dao;import java.util.List;

国产麒麟系统初始化达梦数据库8_西城十七妹的博客-程序员宅基地

国产麒麟系统安装达梦数据库初始化数据库注册服务初始化数据库进入到数据库的安装目录的bin下[[email protected] bin]# cd /opt/dmdbms/bin/bin运行dminit文件[[email protected] bin]# ./dminit填写参数# 数据库文件的存放路径input system dir: /dm8/dmdbms# 数据库名input db name: TESTDB# 监听端口号(5236)input port num: 5236#

navicat链接oracle数据库的时候 报错:Oracle net admin error_ListenForcsdn的博客-程序员宅基地

连接oracle数据库报错:解决方式:1:https://www.oracle.com/technetwork/database/database-technologies/instant-client/downloads/index.html下载,对应版本重新启动

SpringBoot返回枚举对象中的指定属性_GoslingWu的博客-程序员宅基地

枚举package com.meeno.boot.oa.employee.enums;import com.alibaba.fastjson.annotation.JSONType;import com.meeno.boot.oa.common.BaseEnum;import com.meeno.boot.oa.common.json.EnumSerializer;import co...

随便推点

(K8S实践0)Centos7.6部署k8S(v1.14.2)集群_MJ-ZJK的博客-程序员宅基地

Centos7.6部署k8S(v1.14.2)集群系统环境说明:一、docker安装1.安装依赖包[[email protected] ~]# yum install -y yum-utils device-mapper-persistent-data lvm22.设置Docker源[[email protected] ~]# yum-config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo3.Docker

【Flink】Object Reuse 数据重用 深拷贝 一些坑_九师兄的博客-程序员宅基地

1.概述我们为了提高程序的性能使用了 Object Reuse 数据重用,这个东西的介绍请参考 【Flink】Object Reuse 模式(Stream API) 性能优化 chain 数据重用 不深拷贝 ,然后因为数据重用,一直没有出现问题。因此也没考虑。但是今天出了问题。大概意思是在chain模式下,在算子c中对一个数据进行更改,那么在B中,可以看到更改后的数据,在B中修改C也能看到。在非Chain模式下,是没有这个问题的。这就比较有意思了,必须去看看呀。2.场景再现2.1 ch

度量学习——总结_不说话装高手H的博客-程序员宅基地_基于度量学习

传统方法User guide: contents — metric-learn 0.6.2 documentation深度学习基于深度学习的度量学习方法大都由两个部分组成:特征提取模块和距离度量模块。距离度量模块的任务是使同一类样本间的距离更靠近,而不同类样本间的距离更远离。这一模块更多的实现方法是改进损失函数,对模型的学习更加“赏罚分明”。基于正负样本对的方法也可以称为基于对比学习的方法,抽出正负样本对学习。对比学习的方法现在正广泛的应用于学习更好的特征提取模块,即用自监督学习的方法来

vue实现番茄钟_不见蝴蝶不见君。的博客-程序员宅基地_vue 番茄钟

随笔 - 40  文章 - 0  评论 - 0vue 实现 tomato timer(蕃茄钟)近期在学习【时间管理】方面的课程,其中有一期讲了蕃茄工作法,发现是个好多东西。蕃茄工作法核心思想就是:工作25分钟,休息5分钟。如果您好了解更多可以自行度娘。 在加上本人是一个程序猿,就想用程序的方式来表达对此工作法的敬意。因此就产生了用vue实现一个tomato timer的想法。演示地址 ...

记一次truelicense安装证书报stream close()异常_Min_Monk的博客-程序员宅基地_de.schlichtherle.license

背景近期,由于工作需要研究了下truelicense,给xxx添加一个证书,限制产品的使用期限。前期将truelicense整合到spring-boot项目中很容易,过程中没有出现问题,但是同样的代码在整合到osgi容器中的时候,出现了异常,异常如下:de.schlichtherle.xml.PersistenceServiceException: java.lang.reflect.UndeclaredThrowableException at de.schlichtherle.xml.Per

ASP.NET中MVC添加Controller以及访问其Action_霸道流氓气质的博客-程序员宅基地

场景ASP.NET中MVC编程模式简介与搭建HelloWorld项目:https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/106795640在上面搭建起MVC的项目后,怎样添加一个Controller并访问其中的方法。注:博客:https://blog.csdn.net/badao_liumang_qizhi关注公众号霸道的程序猿获取编程相关电子书、教程推送与免费下载。实现右击Controller目录-新建控制

推荐文章

热门文章

相关标签