天天看點

FineUI開源版(ASP.Net)初學手冊

女朋友鄙視我原創少...

1.下載下傳

進入官方論壇:

http://www.fineui.com/bbs/

要用到下載下傳源代碼和空項目下載下傳

FineUI開源版(ASP.Net)初學手冊
http://fineui.codeplex.com/ http://fineui.com/bbs/forum.php?mod=viewthread&tid=2123 http://pan.baidu.com/s/1bntUOr1

源代碼直接下載下傳,注意FineUI版本

FineUI開源版(ASP.Net)初學手冊

空項目裡下載下傳 對應版本的空項目,注意.NET版本,與VS版本相關。_V後是FineUI的版本号。

最新的在網盤裡

FineUI開源版(ASP.Net)初學手冊
FineUI開源版(ASP.Net)初學手冊

注意看.net版本,

FineUI開源版(ASP.Net)初學手冊

解壓,現在得到兩個檔案

FineUI開源版(ASP.Net)初學手冊

第二個是源碼,第一個是空項目。把空項目裡的extjs包複制到源碼 FineUI_v4.2.0_source_all/FineUI.Examples 目錄裡,

FineUI開源版(ASP.Net)初學手冊

這時源代碼就可以生成運作了。

注意FineUI開發環境,比如,我電腦上是VS2010,打不開現在的最新項目4.2.+,其實就是解決方案打不開,會出現輕按兩下沒反應情況。我用VS2010先建個空解決方案,再把項目加進去就可以了。

最新的有個test直接扔,不知道幹啥的,

有些Vs2010 會出現 找不到 控件的問題,

 解決辦法就是 建立個工具箱 把DLL添加到工具箱裡面 然後随便拖一個控件到窗體上 再把控件删掉 @北京-磚家

或者更新vs更新檔 @沈陽-Sunday

2.學習FineUI

解決方案包含兩個項目 FineUI FineUI.Examples ,FineUI 項目生成FineUI為FineUI背景源碼,生成對應的FineUI.dll, FineUI.Examples為例子程式,對應官方線上示例

http://fineui.com/demo/

default.aspx為啟動頁,是個母版頁式的頁面,其他頁面以頁簽形式展現,頁面打開後上邊是logo,左邊是目錄樹,右邊是顯示區域。

生成項目成功後初學者應當對照項目檢視官方教程

http://www.fineui.com/doc/

,對整個教程檢視之後(最少看完前四章)對FineUI開發有個初步了解。

項目運作後可以點選 源代碼 檢視目前頁面源代碼 友善學習。位址欄會給出目前頁面的位址

http://fineui.com/demo/#/demo/grid/grid_groupheader.aspx

即FineUI.Examples 目錄下grid/grid_groupheader.aspx檔案,VS中搜尋grid_groupheader.aspx.cs即可。

FineUI開源版(ASP.Net)初學手冊

注意打開解決方案跟蹤活動項。

FineUI開源版(ASP.Net)初學手冊

所有方法屬性(不包括js)都可以在官方API查找 

http://www.fineui.com/api/

 ,提供了解屬性的意義。

FineUI開源版(ASP.Net)初學手冊

加入QQ群 158028499  友善解答各種問題,裡面的保姆很專業,而且群共享裡還有好多資源。

3.源代碼分析

注意檢視Web.config學習dll的引用。

AssemblyInfo.cs配置版本和頁面資訊。

FineUI開源版(ASP.Net)初學手冊

CommonResourceHelper.RegisterCommonResource可配置頁面加載引用的js,js目錄在FineUI.Examples\extjs 可以自己添加必備的js。

FineUI開源版(ASP.Net)初學手冊

其中string metaContent 參數配置網頁資訊。

ResourceManager提示為找到extjs錯誤的資訊。

FineUI開源版(ASP.Net)初學手冊

所有配置頁面都繼承自PageBase

其中繪制頁面時通過Cookie判斷頁面樣式。表格的建立(即模拟資料)及其他頁面需要的方法。

控件的所有方法都可以找到對應源碼(F12)供學習參考。

FineUI開源版(ASP.Net)初學手冊

extjs為整個FineUI開源版基礎,FineUI優化成了兩個js檔案,

FineUI開源版(ASP.Net)初學手冊

,其中ext-part2.js未壓縮,可以參考學習一些基礎用法。ext-part1可以搜尋解壓軟體解壓檢視,也可參考extjs源碼下的ext-4.2.1-gpl\ext-4.2.1.883\ext-all-debug.js檔案。

FineUI是開源的,直接用的程式員不是好廚子。

繼續閱讀