TabStrip和MultiPage的使用

TabStrip和MultiPage联合使用后就是标准的选项卡,效果和mblogger的管理页面一样。

1、安装:必须下载安装iewebcontrols.msi后才可以使用,在工具箱中“添加/移除项”,添加TabStrip和MultiPage项,如果用得着TreeView(树状图),也可以一并添加上。TabStrip用于选项卡的卡头,MultiPage用于选项卡的容纳页面。

2、TabStrip:添加、修改、删除卡头可以使用其Items属性,操作方式和TreeView的操作方式一致,在控件上击右键,也可以添加Tab或TabSeperator(分隔)。它最重要的属性是TargetID,应指向它所对应的MultiPage的ID。另外卡头的颜色、鼠标移过颜色、当前卡头颜色在其Tab Defaults属性组中修改。

3、MultiPage:这个控件的使用就没有那么简单了,需要在HTML页中添加。每个<iewc:pageview></iewc:pageview>标签对应一页,顺序和TabStrip中的顺序应一致。页中的控件及事件代码写好后,可以剪切到<iewc:pageview></iewc:pageview>之间即可。

4、何处使用:看了一下输出页的HTML源码,它是把MultiPage中所有的页面中的控件全部加载,然后选择显示某个页面,这样就会选成不必要的资源消耗。如果想把卡头文字显示为超链接,可以把Text属性设为如<a href='http://www.mblogger.cn'>链接文字</a>即可。

下面是一个完整的例子:

<iewc:TabStrip id="TabStrip1" runat="server" DESIGNTIMEDRAGDROP="49" TabSelectedStyle="background-color:#ffffff;color:#000000"
TabHoverStyle="background-color:#777777" TabDefaultStyle="background-color:#000000;font-family:verdana;font-weight:bold;font-size:8pt;color:#ffffff;width:79;height:21;text-align:center"
TargetID="mpDemo">
<iewc:Tab Text="Tab 1"></iewc:Tab>
<iewc:TabSeparator></iewc:TabSeparator>
<iewc:Tab Text="Tab 2"></iewc:Tab>
<iewc:TabSeparator></iewc:TabSeparator>
<iewc:Tab Text="Tab 3"></iewc:Tab>
</iewc:TabStrip>
<iewc:MultiPage id="mpDemo" runat="server">
<iewc:pageview>
<asp:Label id="Label1" runat="server">Label</asp:Label>
<asp:Button id="Button1" runat="server" Text="Button"></asp:Button>
</iewc:pageview>
<iewc:pageview>
<INPUT type="button" value="警告窗口" onclick="alert('给你一个警告。');"></iewc:pageview>
<iewc:pageview>33333333333333333333</iewc:pageview>
</iewc:MultiPage>

你可能感兴趣的:(page)