本發(fā)明涉及視圖動(dòng)態(tài)布局方法領(lǐng)域，具體涉及一種EPG的視圖動(dòng)態(tài)布局方法。
背景技術(shù)：
現(xiàn)有Android 動(dòng)態(tài)布局的方式主要有兩種：1，采用訪問(wèn)服務(wù)器，獲取數(shù)據(jù)，動(dòng)態(tài)創(chuàng)建事先定義好的View類型，并設(shè)置大小和相對(duì)位置，來(lái)達(dá)到這一塊的動(dòng)態(tài)布局。2，采用WebView加載網(wǎng)頁(yè)的方式，可以在服務(wù)器將html文件修改，達(dá)到整個(gè)網(wǎng)頁(yè)界面的動(dòng)態(tài)布局。下面將詳細(xì)描述一下這兩種動(dòng)態(tài)布局方式。
第一種，客戶端起來(lái)后，進(jìn)入activity頁(yè)面，進(jìn)行請(qǐng)求服務(wù)器的流程，并從服務(wù)器拿到結(jié)果，這時(shí)通過(guò)解析服務(wù)器返回?cái)?shù)據(jù)，當(dāng)然我們要有一個(gè)事先定義好的View，這個(gè)View在apk編譯的時(shí)候就定義好了，一般具有顯示圖片，焦點(diǎn)樣式，點(diǎn)擊跳轉(zhuǎn)等屬性。根據(jù)服務(wù)器返回的數(shù)據(jù)，在指定的某一塊區(qū)域位置的動(dòng)態(tài)創(chuàng)建指定大小的View，并把他add到父View里，一般會(huì)采用相對(duì)布局，添加進(jìn)去，從左到右，從上倒下的順序方式，依次排列。焦點(diǎn)左右移動(dòng)需要預(yù)先代碼中處理。這種動(dòng)態(tài)布局，可以動(dòng)態(tài)生成服務(wù)器指定數(shù)目的View，也可以指定大小，位置等。
第二種，采用WebView加載方式，首先在xml布局文件里寫一個(gè)Webview的控件，在activity代碼里，通過(guò)findViewById獲取到該webView的引用，調(diào)用loadUrl(String url)方法，傳遞服務(wù)器網(wǎng)頁(yè)url，打開該網(wǎng)頁(yè)，通過(guò)設(shè)置setJavaScriptEnabled()，設(shè)置是否可執(zhí)行javaScript腳本。setAllowFileAccess()，設(shè)置是否可訪問(wèn)文件，setWebViewClient()，設(shè)置Web視圖。
現(xiàn)有方法不足在于:
1、動(dòng)態(tài)創(chuàng)建的View要事先定義好，且不具有所有動(dòng)態(tài)，只能部分區(qū)域動(dòng)態(tài)。
2、動(dòng)態(tài)創(chuàng)建的View在apk編譯完后，不具有再動(dòng)態(tài)修改或添加View類型。
3、WebView方式用webkit引擎，性能較差。
4、WebView方式動(dòng)畫效果相比原生差很多。
技術(shù)實(shí)現(xiàn)要素：
本發(fā)明為了解決上述技術(shù)問(wèn)題提供一種EPG的視圖動(dòng)態(tài)布局系統(tǒng)。
本發(fā)明通過(guò)下述技術(shù)方案實(shí)現(xiàn)：
一種EPG的視圖動(dòng)態(tài)布局系統(tǒng)，包括Css布局系統(tǒng)、View解析系統(tǒng)和View組件庫(kù)，其中，
所述Css布局系統(tǒng)是將Css布局式樣添加到每個(gè)動(dòng)態(tài)view中，通過(guò)java反射的形式將所有的javaScript布局樣式映射到j(luò)ava中，再利用cssNode類對(duì)其進(jìn)行轉(zhuǎn)化，形成UI上的布局風(fēng)格；
所述View解析系統(tǒng)包括C++底層及java層；
所述View組件庫(kù)包括組件，每個(gè)組件均帶有公共屬性。
所述View解析系統(tǒng)的C++底層將javaScript端的UI name與java層的name一一對(duì)應(yīng)，Java層的view調(diào)用android原生的view；C++底層，將原生的view進(jìn)行映射到j(luò)avaScript端，然后通過(guò)對(duì)javaScript的UI組件進(jìn)行渲染顯示，最終形成布局。
所述Css布局系統(tǒng)包括margin-Left、margin-Right、padding-Left、padding-Right屬性。
所述Css布局系統(tǒng)包括border屬性。
本發(fā)明的目的在于解決在發(fā)布apk版本后，使用我們的動(dòng)態(tài)view，從新快速的對(duì)上線版本的UI的各種view進(jìn)行改變、修改，來(lái)達(dá)到我們的UI需求，并且同時(shí)能夠根據(jù)我們的動(dòng)態(tài)view來(lái)進(jìn)行組合各種復(fù)雜的view及其他動(dòng)畫，達(dá)到媲美android原生動(dòng)畫的效果。原理為：利用javaScript以標(biāo)簽的形式來(lái)添加布局我們的動(dòng)態(tài)view，并且利用css布局系統(tǒng)對(duì)view進(jìn)行css模式的布局，來(lái)達(dá)到最終view的展現(xiàn)；核心為javaScript與java直接通過(guò)底層C++來(lái)建立通信。
傳統(tǒng)開發(fā)則只能通過(guò)android代碼構(gòu)建幾套UI視圖進(jìn)行動(dòng)態(tài)view的創(chuàng)建。本裝置則是通過(guò)我們所封裝的JS基礎(chǔ)UI組件來(lái)對(duì)不同需求的UI頁(yè)面進(jìn)行各種組合，來(lái)達(dá)到動(dòng)態(tài)創(chuàng)建UI，頁(yè)面的編寫包括引用基礎(chǔ)UI組件，如<AIE_V_View style={styles.container} >，并通過(guò)style風(fēng)格來(lái)對(duì)UI組件進(jìn)行寬高、內(nèi)邊距、外邊距、居中等的控制，并且對(duì)該組件也封裝有其他的方法，如：獲取焦點(diǎn)方法、執(zhí)行動(dòng)畫方法等等，所有UI組件必須繼承JavaScriptModule，并注冊(cè)在CatalystInstance中，通過(guò)C++層 Bridge 把java與javaScript進(jìn)行連接通信。
通過(guò)本裝置，可以使得不更新APK的情況下進(jìn)行視圖view的更新。通過(guò)把各種UI頁(yè)面進(jìn)行打包成index文件，index文件中包含有UI界面的代碼及運(yùn)行這些代碼的運(yùn)行引擎，apk則加載該index文件即可，來(lái)到新頁(yè)面的渲染更新。
傳統(tǒng)加載webkit，性能較差，性能上無(wú)法充分發(fā)揮系統(tǒng)特性，譬如調(diào)用系統(tǒng)服務(wù)、內(nèi)存管理等，無(wú)法操控設(shè)備硬件，如相機(jī)、藍(lán)牙、振動(dòng)器等。本裝置則是通過(guò)java直接在android對(duì)組件或者API進(jìn)行NativeModuleRegistry注冊(cè)，并通過(guò)反射來(lái)將需要使用到的方法映射給javaScript端，javaScript端直接調(diào)用。直接原理則是javaScript間接地調(diào)用android端的API。
采用本裝置，組件UI的動(dòng)畫則是通過(guò)在調(diào)用android端view時(shí)封裝的動(dòng)畫方法，相對(duì)于webview，本裝置則是直接調(diào)用原生的動(dòng)畫，因此流暢度及效果好更多。
一種EPG的視圖動(dòng)態(tài)布局方法，其特征在于，包括：
封裝基礎(chǔ)組件庫(kù)，根據(jù)android原生封裝出對(duì)應(yīng)的js調(diào)用組件庫(kù)；
布局相應(yīng)的頁(yè)面，在javaScript頁(yè)面端使用基礎(chǔ)組件庫(kù)進(jìn)行相應(yīng)的UI布局，設(shè)置UI的相應(yīng)屬性；
視圖解析系統(tǒng)，將布局好的js布局界面解析出來(lái)，呈現(xiàn)視圖；
根據(jù)UI需求，在javaScript端利用封裝的基礎(chǔ)組件進(jìn)行UI的布局；Js頁(yè)面編寫完畢后，打包成index文件，客戶端動(dòng)態(tài)的下載該index文件并進(jìn)行加載，apk最終渲染出所需要的視圖view。
所述js調(diào)用組件庫(kù)包括Text、Input、Image、Listview中至少一種。
所述javaScript端的處理過(guò)程包括邏輯處理、頁(yè)面的跳轉(zhuǎn)處理。
本發(fā)明與現(xiàn)有技術(shù)相比，至少具有如下的優(yōu)點(diǎn)和有益效果：
本發(fā)明的系統(tǒng)在發(fā)布apk版本后，可從新快速的對(duì)上線版本的UI的各種view進(jìn)行改變、修改，來(lái)達(dá)到我們的UI需求，并且同時(shí)能夠根據(jù)我們的動(dòng)態(tài)view來(lái)進(jìn)行組合各種復(fù)雜的view及其他動(dòng)畫，達(dá)到媲美android原生動(dòng)畫的效果。
具體實(shí)施方式
為使本發(fā)明的目的、技術(shù)方案和優(yōu)點(diǎn)更加清楚明白，下面結(jié)合實(shí)施例，對(duì)本發(fā)明作進(jìn)一步的詳細(xì)說(shuō)明，本發(fā)明的示意性實(shí)施方式及其說(shuō)明僅用于解釋本發(fā)明，并不作為對(duì)本發(fā)明的限定。
實(shí)施例1
一種EPG的視圖動(dòng)態(tài)布局系統(tǒng)，包括Css布局系統(tǒng)、View解析系統(tǒng)和View組件庫(kù)，其中，
所述Css布局系統(tǒng)是將Css布局式樣添加到每個(gè)動(dòng)態(tài)view中，通過(guò)java反射的形式將所有的javaScript布局樣式映射到j(luò)ava中，再利用cssNode類對(duì)其進(jìn)行轉(zhuǎn)化，形成UI上的布局風(fēng)格；
所述View解析系統(tǒng)包括C++底層及java層；
所述View組件庫(kù)包括組件，每個(gè)組件均帶有公共屬性，如是否能夠獲取焦點(diǎn)，是否獲取焦點(diǎn)，是否顯示，點(diǎn)擊view事件，以及向左的下一個(gè)焦點(diǎn)id、向右的下一個(gè)焦點(diǎn)id等，每類view也含有其對(duì)應(yīng)的特有屬性，如textView含有設(shè)置文字大小等屬性。
所述View解析系統(tǒng)的C++底層將javaScript端的UI name與java層的name一一對(duì)應(yīng)，Java層的view調(diào)用android原生的view；C++底層，將原生的view進(jìn)行映射到j(luò)avaScript端，然后通過(guò)對(duì)javaScript的UI組件進(jìn)行渲染顯示，最終形成布局。
所述Css布局系統(tǒng)包括margin-Left、margin-Right、padding-Left、padding-Right等屬性，以及android xml布局所沒(méi)有的border屬性，并且含有豐富的水平居中、垂直居中等屬性。
實(shí)施例2
一種EPG的視圖動(dòng)態(tài)布局方法，包括以下步驟：
封裝基礎(chǔ)組件庫(kù)，根據(jù)android原生封裝出對(duì)應(yīng)的js調(diào)用組件庫(kù)。如Text、Input、Image、Listview等等
布局相應(yīng)的頁(yè)面，在javaScript頁(yè)面端使用基礎(chǔ)組件庫(kù)進(jìn)行相應(yīng)的UI布局，設(shè)置UI的屬性、位置等屬性；
視圖解析系統(tǒng)，將布局好的js布局界面解析出來(lái)，呈現(xiàn)視圖；
根據(jù)UI需求，在javaScript端利用封裝的基礎(chǔ)組件進(jìn)行UI的布局，包括需要的其他邏輯處理，如網(wǎng)絡(luò)請(qǐng)求，處理數(shù)據(jù)等，都在javaScript端進(jìn)行處理。也包括頁(yè)面的跳轉(zhuǎn)等處理。Js頁(yè)面編寫完畢后，打包成index文件，客戶端來(lái)動(dòng)態(tài)的下載該index文件并進(jìn)行加載，apk最終渲染出所需要的視圖view。
以上所述的具體實(shí)施方式，對(duì)本發(fā)明的目的、技術(shù)方案和有益效果進(jìn)行了進(jìn)一步詳細(xì)說(shuō)明，所應(yīng)理解的是，以上所述僅為本發(fā)明的具體實(shí)施方式而已，并不用于限定本發(fā)明的保護(hù)范圍，凡在本發(fā)明的精神和原則之內(nèi)，所做的任何修改、等同替換、改進(jìn)等，均應(yīng)包含在本發(fā)明的保護(hù)范圍之內(nèi)。