天天看點

easyui自定義皮膚及缺陷修改

引言:

  一個商業項目的需要,又因為時間緊迫的關系,準備購買一套簡潔,易用,可定制化強的UI,經過對國内外多家UI産品進行了對比,

  包括:FineUI, EasyUI, EXT.NET, EXTJS, jQueryUI, jQuery MiniUI, ligerUI, kendo-ui, uikit, hplus, uimaker 。

      最後選擇了uimaker的一個模闆。

      Ⅰ 優點:

        1)示例不依賴于.net,java, php等伺服器平台,隻需要電腦有一個浏覽器即可進行示例浏覽。

            2)在easyui的基礎上進行定制,使用方法與easyui具有100%的相似度。

            3)已有多套ui皮膚,減少了皮膚定制的工作量。

      經過UI的功能測試,性能測試,相容性測試,發現有如下缺點:

     Ⅱ  缺點:

           1)js的文法錯誤。

           2)個别頁面,加載的資料太多,影響了軟體的性能。

           3)對bootstrap的部份不相容性。

           4)作者服務不到位,承諾的3月份更新,現在都6月10号了

     對于一個10來年的程式員,這些問題都不是問題,唯一的問題,就是時間不夠,不過這是商業項目,必須得解決。

     Ⅲ 撸起袖子幹:

           1)修改js的文法錯誤。

           2)修改部份邏輯,提高UI性能。

           3)因為我的項目要與bootstrap相容,是以對bootstrrap做了大量的相容。

           4)與font awesome圖示,layer彈出框的相容。

           5)內建百度的上傳控件webuploader,替換為百度的編輯器Ueditor 等控件的。

     一些圖檔賞析:

     比如:未經過修改時的UI -  Error 錯誤

easyui自定義皮膚及缺陷修改

一,在以前的基礎上新增了7套皮膚,隻需要動态切換一下皮膚路徑即可。

easyui自定義皮膚及缺陷修改

二,簡潔美觀的登入頁面。

easyui自定義皮膚及缺陷修改

三,以圖文并茂的方式顯示系統的主要資訊。

easyui自定義皮膚及缺陷修改

四,頁面樹形菜單,Tab的運用。

easyui自定義皮膚及缺陷修改

五,清單頁的顯示(異步加載)

easyui自定義皮膚及缺陷修改

六,導航菜單,以及彈出視窗的示例。

easyui自定義皮膚及缺陷修改

微信:xichji