之前發表過一篇文章:TinyAdmin前端展示框架,其在線演示路徑爲:http://www.tinygroup.org/tinyadmin/,應該說有許多人仍是感受興趣的,可是因爲這個是基於SmartAdmin框架改寫的,雖然咱們本身買了SmartAdmin的受權,可是廣大用戶若是要用的時候,就會有受權相關的問題,這會大大影響一些人的使用決策--尤爲是會再發行的朋友。前端
再一個緣由是SmartAdmin初看不是不錯的,可是實際用起來,裏面的問題比較多,對IE8基本上能夠說是不兼容,雖然咱們努力進行了必定的修正,可是仍是兼容性不夠好。有些用戶體驗方面也有改進的空間,這就愈來愈讓我思考,是否是要有更好的解決方案?git
直到AJian和密緣之友加入個人團隊以後,我以爲是時候比較完全的解決這個問題了。果真,在風淡芸輕、AJian、密緣之友的通力合做下,只用了一個月左右的時間,就拿出一TinyUI的初始版本,目前已經基本完善,固然咱們還在進行系統性的測試,相信還存在一些小問題(有些咱們本身已經發現,正在修正中),歡迎感興趣的同窗們一塊兒來參與改進。web
在線演示地址:http://ui2.tinygroup.org/瀏覽器
源碼地址(必須託管在高大上的開源中國GIT倉庫):http://git.oschina.net/tinyframework/TinyUiEnterprise框架
開發環境構建,須要有GIT,MAVEN(3.1.x),JDK1.6:佈局
git clone https://git.oschina.net/tinyframework/TinyUiEnterprise.git cd TinyUiEnterprise mvn install cd *web mvn jetty:run
在執行mvn install的時候,第一次時間比較長,由於要從中央倉庫下載一些資源包,能夠抽支菸、喝杯茶、走走步啥的。測試
若是走完最後一步,就能夠啓動起一個本地環境(注意,沒有別的應用佔用8080端口),這個時候起個瀏覽器,輸入:ui
http://localhost:8080/tinyuiweb/
注意,請在IE9以上瀏覽器、Chrome、FireFox等瀏覽器上瀏覽,目前IE8還在做適應性調整。spa
一些說明,本UI框架中,有一些內容取自H-UI,這個咱們和H-UI源創團隊進行過溝通,他們容許咱們複用他們框架中的內容。
本UI框架中,在某些外在實現方面參考了SmartAdmin的一些特性,可是沒有複用它的源碼。
本UI框架中,集成了一些開源的JQuery插件,可是不改變原來插件的受權方式,請使用者在使用時查看原始插件的受權方式。.net
TinyUI的一些特性說明:
下面我經過一些圖形了作一個展現:
上面是其中的一個頁面,組件包列表是根據實際加載的組件包數量實時計算出來的,所以不須要人爲進行修改---這個就是依賴TinyUiEngine的強大支持了。
點擊設置按鈕,會顯示界面調整面板,在這裏能夠對導航條、菜單欄、導般菜單等進行固定與否的調整,也能夠調整菜單的位置。還能夠選擇是採用全屏仍是固定寬度的設置,值得一提的是若是選擇固定寬度,會根據頁面的寬度在970與1170寬度之間自動適應。再下面就是各類各樣的主題風格了。呵呵,如今的主題風格只是簡單調整了一下,用於測試,後面會請專業的美工同窗進行系統性的調整。
而後,裏面就是幾十個組件的實際示例,我敢保證你想用的多大多組件都已經包含在內了。若是你認爲還不夠,請到www.tinygroup.org社區中留言,只要提的合理,咱們會以你想象不到的速度快速進行添加。
下面我展現一個流式佈局的示範:
一開始是整頁寬度的固定寬度顯示,還能夠看到兩邊的陰影,如今固定寬度爲1170像素。
咱們減小它的寬度
它的寬度已經變成970像素寬。
再把它的寬度減小,
能夠看到兩邊的隱藏已經沒有了。
因爲寬度實在是小,菜單就再也不完整顯示,而是隻顯示圖標了。
嗯嗯,效果不錯,已經完整的展現了整個過程。
上面是菜單顯示方式,能夠看到是很是適合手機等觸摸屏上操做的。
Tiny出品,必是精品,小夥伴們一塊兒參與或加入咱們吧!!!