FineUI布局里面的简单问题

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了FineUI布局里面的简单问题相关的知识,希望对你有一定的参考价值。

<f:PageManager ID="pmg1" runat="server" AutoSizePanelID="RegionPanel1"/>
<f:RegionPanel runat="server" ID="RegionPanel1" ShowBorder="true" >
<Regions>
<f:Region Position="Top" Layout="Fit" runat="server" ShowHeader="true" Title ="面板一" BodyPadding="10px">
<Items>
<f:Toolbar runat="server">
</f:Toolbar>
</Items>
<Items>
<f:ContentPanel runat="server"></f:ContentPanel>
</Items>
</f:Region>

<f:Region ID="Region1" Position="Left" Layout="Fit" runat="server" ShowHeader="true" Title ="面板二" BodyPadding="10px">
<Items>
<f:Tree runat="server"></f:Tree>
</Items>
</f:Region>

<f:Region ID="Region2" runat="server" Position="Center" Layout="Fit" ShowHeader="true" Title ="面板三" BodyPadding="10px">
<Items>
<f:ContentPanel ID="ContentPanel1" runat="server">
<f:Label ID="Label1" Text="这是正文 " runat="server"></f:Label>
</f:ContentPanel>
</Items>
</f:Region>
</Regions>
</f:RegionPanel>
生成的网页是这样的

怎样才能变成这样的布局

参考技术A 这个你要在左边添加树
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mypage.aspx.cs" Inherits="EmptyProjectNet20_FineUI.mypage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<f:PageManager ID="PageManager1" runat="server" AutoSizePanelID="RegionPanel1" />
<f:RegionPanel ID="RegionPanel1" ShowBorder="false" runat="server">
<Regions>
<f:Region ID="Region1" ShowBorder="false" Height="50px" ShowHeader="false"
Position="Top" Layout="Fit" runat="server">
<Items>
<f:ContentPanel ShowBorder="false" ShowHeader="false" ID="ContentPanel1" CssClass="header"
runat="server">
<div class="title">
<a href="mypage.aspx" style="color: #fff;">链接1</a>
</div>
</f:ContentPanel>
</Items>
</f:Region>
<f:Region ID="Region2" Split="true" Width="200px" ShowHeader="false" Title="菜单"
EnableCollapse="true" Layout="Fit" Position="Left" runat="server">
<Items>
<f:Tree ID="Tree1" runat="server" Title="区域选择" AutoScroll="true" Width="300px" OnNodeCommand="treenodecommand">
</f:Tree>
</Items>
</f:Region>
<f:Region ID="mainRegion" ShowHeader="false" Layout="Fit" Position="Center"
runat="server">
<Items>

<f:TabStrip ID="TabStrip1" runat="server" ActiveTabIndex="0" ShowBorder="True" Width="850px" Height="450px">
<Tabs>
<f:Tab ID="Tab1" runat="server" BodyPadding="5px" Title="Tab1">
<Items>

<f:Label Text="区域信息:"></f:Label>

<f:Label Text="地区ID:"></f:Label>
<f:Label runat="server" ID="MyLabel1">
</f:Label>
<f:Label ID="Label1" runat="server">
</f:Label>
<f:Label Text="地区数据:"></f:Label>
<f:TextBox ID="MyTextBox1" runat="server">
</f:TextBox>
<f:Label Text="地区描述:"></f:Label>
<f:TextBox ID="MyTextBox2" runat="server">
</f:TextBox>

<f:Label Text="如需修改,输入数据后,点击修改按钮"></f:Label>
<f:Button ID="MyButton1" runat="server" Text="修改" OnClick="btnMyButton1Click">
</f:Button>
</Items>
</f:Tab>
<f:Tab ID="Tab2" runat="server" BodyPadding="5px" Title="Tab2" EnableAjax="true">
<Items>
<f:Grid ID="MyGrid1" runat="server" Title="动态创建表格" Width="650px" EnableCheckBoxSelect="true">
</f:Grid>
</Items>
</f:Tab>
</Tabs>
</f:TabStrip>
</Items>
</f:Region>
</Regions>
</f:RegionPanel>

<f:Window ID="Window1" runat="server" BodyPadding="5px" Height="350px"
IsModal="true" Title="Window" Width="500px" Hidden="true">
</f:Window>
</form>
</body>
</html>本回答被提问者和网友采纳

以上是关于FineUI布局里面的简单问题的主要内容,如果未能解决你的问题,请参考以下文章

FineUI十周年纪念版即将发布(基于像素的响应式布局,独此一家)!

IOS开发之UI布局

几个ui显示在一个窗口里

iOS自动布局——Masonry详解

CSS杂谈——flex布局里面的auto到底多长

cocosStudio2.x怎么进行相对布局编辑