asp.net控件库FineUI使用入门图解

FineUI是一个基于 jQuery / ExtJS 的 ASP.NET 控件库，其宣传语是：
创建 No JavaScript，No CSS，No UpdatePanel，No ViewState，No WebServices 的网站应用程序

官网首页和空项目模板地址：

http://www.fineui.com/

http://fineui.com/bbs/forum.php?mod=viewthread&tid=2123

下载其空项目模板，运行，效果如下；

下面看下其代码；

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="EmptyProjectNet20._default" %><!DOCTYPE html><html>
<head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>FineUI（开源版）空项目</title><style>.header .title a,.header .pro a {font-weight: bold;font-size: 24px;text-decoration: none;line-height: 50px;margin-left: 10px;}.header .pro {position: absolute;top: 0;right: 10px;}.bottomtable {width: 100%;font-size: 12px;}/* 主题相关样式 - neptune */.f-theme-neptune .header,.f-theme-neptune .bottomtable,.f-theme-neptune .x-splitter {background-color: #1475BB;color: #fff;}.f-theme-neptune .header a,.f-theme-neptune .bottomtable a {color: #fff;}.f-theme-neptune .header .x-panel-body {background-color: transparent;}</style>
</head>
<body><form id="form1" runat="server"><f:PageManager ID="PageManager1" AutoSizePanelID="RegionPanel1" runat="server"></f:PageManager><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="./default.aspx" style="color: #fff;">FineUI（开源版）空项目</a></div><div class="pro"><a href="http://fineui.com/demo_pro/" target="_blank" style="color: #fff;">专业版示例</a></div></f:ContentPanel></Items></f:Region><f:Region ID="Region2" Split="true" Width="200px" ShowHeader="true" Title="菜单"EnableCollapse="true" Layout="Fit" Position="Left" runat="server"><Items><f:Tree runat="server" ShowBorder="false" ShowHeader="false" EnableArrows="true" EnableLines="true" ID="leftMenuTree"><Nodes><f:TreeNode Text="默认分类" Expanded="true"><f:TreeNode Text="开始页面" NavigateUrl="~/hello.aspx"></f:TreeNode><f:TreeNode Text="登录页面" NavigateUrl="~/login.aspx"></f:TreeNode></f:TreeNode></Nodes></f:Tree></Items></f:Region><f:Region ID="mainRegion" ShowHeader="false" Layout="Fit" Position="Center"runat="server"><Items><f:TabStrip ID="mainTabStrip" EnableTabCloseMenu="true" ShowBorder="false" runat="server"><Tabs><f:Tab ID="Tab1" Title="首页" Layout="Fit" Icon="House" runat="server"><Items><f:ContentPanel ID="ContentPanel2" ShowBorder="false" BodyPadding="10px" ShowHeader="false" AutoScroll="true"runat="server"><h2>FineUI（开源版）</h2>基于 ExtJS 的开源 ASP.NET 控件库<br /><h2>FineUI的使命</h2>创建 No JavaScript，No CSS，No UpdatePanel，No ViewState，No WebServices 的网站应用程序<br /><h2>支持的浏览器</h2>Chrome、Firefox、Safari、IE 8.0+<br /><h2>授权协议</h2>Apache License v2.0（ExtJS 库在 <a target="_blank" href="http://www.sencha.com/license">GPL v3</a> 协议下发布）<br /><h2>相关链接</h2>首页：<a target="_blank" href="http://fineui.com/">http://fineui.com/</a><br />论坛：<a target="_blank" href="http://fineui.com/bbs/">http://fineui.com/bbs/</a><br />示例：<a target="_blank" href="http://fineui.com/demo/">http://fineui.com/demo/</a><br />文档：<a target="_blank" href="http://fineui.com/doc/">http://fineui.com/doc/</a><br /><br /><br /><br /><hr /><br /><a target="_blank" href="http://fineui.com/pro/">企业用户推荐使用FineUI（专业版） - 更快、更强、更实惠！</a></f:ContentPanel></Items></f:Tab></Tabs></f:TabStrip></Items></f:Region><f:Region ID="bottomPanel" RegionPosition="Bottom" ShowBorder="false" ShowHeader="false" EnableCollapse="false" runat="server" Layout="Fit"><Items><f:ContentPanel ID="ContentPanel3" runat="server" ShowBorder="false" ShowHeader="false"><table class="bottomtable"><tr><td style="width: 300px;"> 版本：<a target="_blank" href="http://fineui.com/version">v<asp:Literal runat="server" ID="litVersion"></asp:Literal></a><a target="_blank" href="http://wp.qq.com/wpa/qunwpa?idkey=5a98eb42b742a1edaf22826648d5f61bc16ed08e0253976bc8d30f97508c09c7">QQ公开群</a></td><td style="text-align: center;">Copyright &copy; 2008-2015 合肥三生石上软件有限公司</td><td style="width: 300px; text-align: right;"> </td></tr></table></f:ContentPanel></Items></f:Region></Regions></f:RegionPanel></form><script>var menuClientID = '<%= leftMenuTree.ClientID %>';var tabStripClientID = '<%= mainTabStrip.ClientID %>';// 页面控件初始化完毕后，会调用用户自定义的onReady函数F.ready(function () {// 初始化主框架中的树(或者Accordion+Tree)和选项卡互动，以及地址栏的更新// treeMenu： 主框架中的树控件实例，或者内嵌树控件的手风琴控件实例// mainTabStrip： 选项卡实例// createToolbar： 创建选项卡前的回调函数（接受tabConfig参数）// updateLocationHash: 切换Tab时，是否更新地址栏Hash值// refreshWhenExist： 添加选项卡时，如果选项卡已经存在，是否刷新内部IFrame// refreshWhenTabChange: 切换选项卡时，是否刷新内部IFrameF.util.initTreeTabStrip(F(menuClientID), F(tabStripClientID), null, true, false, false);});</script>
</body>
</html>

可以看到<f:xxxxxx这些就是fineui的控件；

看前面的图；要添加FineUI的引用；

弹出对话框：

using FineUI;

......

Alert.Show("你好 FineUI！", MessageBoxIcon.Warning);

<f:Tree 定义树视图；
<Nodes>定义节点；
<f:TreeNode 定义具体节点；

asp.net控件库FineUI使用入门图解相关推荐

FineUI（专业版）v3.1发布（ASP.NET控件库）！
FineUI(专业版)v3.1 正式发布,60多项更新,官网示例多达 690 个,新增 30 个页面加载动画! 自 2008 年 4 月发布第一个版本,我们持续更新了 126 个版本,拥有 16000 ...
【番外篇】ASP.NET MVC快速入门之免费jQuery控件库（MVC5+EF6）
目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...
[原创]全球首款不使用ViewState的Asp.Net2.0控件库
首先来张效果图: ViewState在Asp.Net中举足轻重的作用: ViewState是Asp.Net的一个非常重要的特性,用来在页面回发过程中维护控件的服务器端状态,这样我们就能方便的在按钮的点 ...
FineUIPro控件库深度解析
FineUIPro控件库 FineUIPro是一套基于jQuery的专业ASP.NET控件库,始于2008年的开源版FineUI控件库. 当年为了提升项目的开发效率,降低代码复杂度,减少对CSS和Ja ...
[原创]基于Extjs的开源控件库 - http://extaspnet.codeplex.com/
ExtAspNet ExtAspNet - ExtJS based ASP.NET Controls with Full AJAX Support ExtAspNet是一组专业的Asp.n ...
通过标准的 ASP.NET 控件来使用 jQuery UI
jQuery UI 提供了强大的前端功能,包括基于脚本和样式表的日历,拖放等等非常酷的特性,但是,这些都是基于 javascript 编程的,对于不太属性这门语言的程序员来说,掌握 jQuery UI ...
06Prism WPF 入门实战 - Log控件库
1.概要源码及PPT地址:https://github.com/JusterZhu/wemail 视频地址:https://www.bilibili.com/video/BV1KQ4y1C7tg?s ...
java学习笔记(三)：前端miniUI控件库入门
java学习笔记(三):前端miniUI控件库入门最近在一家公司实习学习,一上来就需要学习了解相关的前端内容--miniUI.而这个内容自己本身并没有了解学习过,上手也是遇到了不少的问题,于是想把自 ...
asp.net控件本质
.net控件本质在我的一个项目中需要对于控件进行区分总结,我在网上找了找加上自己的实际测试总结如下:(如果有什么不正确的请即使指出,一起讨论,大家共同进步) asp.net之所以现在 ...

asp.net控件库FineUI使用入门图解

asp.net控件库FineUI使用入门图解相关推荐

最新文章

热门文章