歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> ExtJS 6有什麼新東西?

ExtJS 6有什麼新東西?

日期:2017/3/1 9:30:11   编辑:Linux編程

ExtJS在Sencha框架中引入了許多新的和令人興奮的改進。這些變化為基於所有現代浏覽器、設備和屏幕尺寸帶來了新的功能和可用性。

工具包(ToolKits)

ExtJS 6最大的變化就是將ExtJS和Touch合並為一個單一的框架。之前的框架的核心(數據、控制器、模型等等)已被調和為一個單一的公共平台。這樣,數據和邏輯就能共享,從而幫助開發人員進一步去優化他們的應用程序。

那些具有獨特功能的東西將會被分解為兩個絕然不同的兩個工具包:古典(Classic)和現代(Modern)。這些工具包通過ExtJS和Touch的視圖層來進行劃分的。那些共享核心資源和邏輯,並使用這兩種工具包的應用程序被稱為通用(Universal)應用程序。

在使用Cmd生成應用程序的時候,需要選擇應用程序的工具包,這個可通過簡單調整應用程序的app.json來實現,如下所示:

"toolkit": "classic", // or "modern"

發布

由於框架結合為了單一實體,SDK的結構不得不根據classic、modern和common這三個區域進行重組。

同樣,生成和示例文件夾也包含classic和modern這兩個子目錄:

ext-all.js這個文件在build文件夾中依然存在。而ext-modern.js就相當於使用sencha-touch.js。兩者使用的是共同的核心。

在當前版本中,示例kitchensink就是所謂的通用應用程序,一個單一的結合了經典和現代兩個生成配置的應用程序。

包的命名

對於各種不同包中的前綴“ext-”和“sencha-”已經被刪除。這些前綴當初主要是用來區分Sencha Touch、ExtJS和公共庫的。而現在,他們不再需要進行這種區分了,所有這些代碼都已經包含到了ExtJS中。這意味著“sencha-charts”現在應為“charts”,而“ext-theme-neptune”則為“theme- neptune”。

正如你所想的哪樣,要從ExtJS 5升級到ExtJS 6,就需要在app.json文件中調整包的引用名稱。

Fashion

Fashion是Sencha推出的新的SASS編譯器,用於創建應用程序主題。它是使用Javascript編寫的,可在浏覽器中運行。結合 PhantomJS後,在Sencha Cmd中使用Fashion來創建SASS比app watch要好。這意味著Ruby不再是系統所需的!由於Fashion是運行在浏覽器的,因而能將SASS的構建減少到兩次(一次是進行切片(slicer),一次是最小化所需內容)。更重要的是,可以通過app watch迅速的以增量方式重建SASS,這給開發人員帶來了實實在在的好處。

對於app watch,使用Fashion還有一個更大的好處:在線更新!在(現代)浏覽器中打開一個應用程序並加載SASS文件來代替生成的CSS。Fashion無須刷新頁面就可更改並編譯SASS,並更新CSS。

如果要啟用在西安更新,可將“?platformTags=fashion:true”添加到URL。

由於不再使用Ruby,因而依賴Ruby代碼的Compass功能將不能再使用。這就不得不使用JavaScript來創建。我們將會盡快編寫如何為Fashion編寫自定義JavaScript擴展的文檔。有一些Compass中的SASS代碼已經遷移到了Fashion,因而並不是所有的 Compass功能都會受到應用。總的來說,如果不使用自定義的Compass功能,就不會體會到之間的差別。

重要的是,在線更新只有在頁面視圖是運行在Cmd Web server的時候才會工作。在ExtJS的classic工具包中,一些Sass的修改可能需要一個布局或整個頁面重新加載。對於modern工具包來說,很少會有這樣的問題,因為它很大程度上是基於CSS的,且更能適應積極的變化。

圖表

圖表包中最大的變化是在3D餅圖中,它現在支持標簽和可配置的3D方面。在圖表kitchensink中可以查看到這些示例。

ItemEdit插件

另一個最大最新的功能是itemEdit插件,它運行用戶通過拖動標記去修改圖表值。可通過查看Kitchen Sink中Scatter Chart的自定義圖標示例來查看itemEdit插件的行為。

序列標簽、條碼和提示信息的renderer現在支持通過ViewController的方法來命名(聲明式渲染)。軸標簽的renderer也即將到來。

值得注意的是,ExtJS 6已經遺棄舊的ext-charts包。任何使用ext-charts的都需要重構應用程序以使用sencha-charts包。

網格

電子表格

在ExtJS 5.1中引入的電子表格模型現在有了一些令人驚歎的新功能。選擇現在可通過設置extensible為true來設置為可擴展的,這樣,就可拖動右下角的拖動角指示器來添加選擇,從而對當前所選內容沿垂直方向或水平方向進行擴展。

這通常會結合使用當前選擇的插件來復制值到擴展區域,就像在一個典型的電子表格中所期望的哪樣。

可操作模式(Actionable Mode)和可訪問性

網格還支持ARIA的“可操作模式”,該模式是原始單元格編輯模式的延伸。這將允許所有類型的單元格內容能夠通過鍵盤獲取焦點或激活。這是對於可訪問性的巨大進步,這對於超級用戶來說,就可以無需鼠標就能導航到網格中的任何地方。

LazyItems插件

該插件可延遲子組件的渲染,直到呈現的時候再進行渲染,從而降低子組件的實例化和初始化的執行成本。

例如,在標簽面板中設置deferredRender為true,未呈現的標簽就不會對它的後代組件進行實例化和初始化,從而減少開銷,直到標簽被激活的時候才會進行渲染。

屏幕閱讀器支持(可訪問性)

ARIA功能已經直接到了組件的生命周期,這意味著不再需要指定aria包來獲取正確的ARIA行為了。應用程序現在支持屏幕閱讀器(類似JAWS)而無需指定引用。

微加載(Microloader)

Sencha Cmd 6現在資源方面包含了本地存儲緩存,這類似於Sencha Touch的產品的微加載。盡管如此,還是有一些重要的改進:

  • 緩存能在app.json中禁用

  • 只有通過微加載方式加載的內容才不會被刪除

  • 只有應用程序的當前版本才可保持在本地存儲

這些改進解決了當前Touch微加載所報告的問題。主要的是,它會在超出空間的時候積極的刪除本地存儲的內容。這問題時常發生是因為保留了不必要的舊版本應用程序,這讓完全刪除成為最終選擇。

Touch網格

Touch網格不再是一個獨立的Cmd包,它現在已經默認成為modern工具包的一部分。

ExtJS中運用HTML5 Canvas簡單例子 http://www.linuxidc.com/Linux/2012-04/59389.htm

用ExtJS 4.0打造自己的Web桌面 http://www.linuxidc.com/Linux/2014-08/105208.htm

ExtJS 的詳細介紹:請點這裡
ExtJS 的下載地址:請點這裡

Copyright © Linux教程網 All Rights Reserved