前端技術(shù)規(guī)范總結(jié)

第一部分：目錄、文件、CSS命名方式

文件夾與文件名稱、CSS樣式命名、程序中的一些控件等等：

名稱全部用小寫英文字母、數(shù)字、下劃線的組合，其中不得包含漢字、空格和特殊字符；目錄名應(yīng)以英文、拼音為主（不到萬不得已不要以拼音作為目錄名稱，經(jīng)驗證明，用拼音命名的目錄往往連一個月后的自己都看不懂）。盡量用一些大家都能看懂的詞匯。使得你自己和工作組的每一個成員能夠方便的理解每一個文件的意義。而且當(dāng)我們在文件夾中使用“按名稱排例”的命令時，同一種大類的文件能夠排列在一起，以便我們查找、修改、替換、計算負(fù)載量等等操作。

例如：images(圖形文件)，flash（Flash文件）等。

命名方式：（性質(zhì)_描素_位置_分類_數(shù)量）項相結(jié)合，采用簡寫、組合的方式形成通用規(guī)則。

例如：

news(性質(zhì))

news_title(性質(zhì)_描素)

news_title_top(性質(zhì)_描素_位置)

news_title_top_01(性質(zhì)_描素_位置_數(shù)量)

news_title_top_a_01(性質(zhì)_描素_位置_分類_數(shù)量)news_title_top_b_01(性質(zhì)_描素_位置_分類_數(shù)量)

常用目錄名：

data(數(shù)據(jù)庫)images(圖片)install(安裝)templets(模版)include(包含)admin(后臺)rss(定閱)media(媒體)config(配置)Script(腳本)Language(語言)style(樣式)等

常用CSS名：

頁面外圍控制整體布局寬度：wrapper頭：header內(nèi)容：content/container頁面主體：main側(cè)欄：sidebar尾：footer等

第二部分：結(jié)構(gòu)（XHTML）

網(wǎng)站的前端結(jié)構(gòu)與表現(xiàn)分離，達(dá)到95%以上。正式上線后的網(wǎng)頁代碼結(jié)構(gòu)要清晰、明朗，容易閱讀，布局與結(jié)構(gòu)的鑲套盡量控制在4-5層以內(nèi)，嚴(yán)格遵循w3c的xhtml1.0Transtitonal。并遵循以下原則：

1.DDT類型：XHTML1.0Transitional2.編碼：utf-83.元標(biāo)記必須項：

該頁面的關(guān)鍵詞概況該頁面的簡要描述具體內(nèi)容根據(jù)SEO要求設(shè)置

4.Html代碼中的所有標(biāo)簽遵循XHTML1.0的書寫規(guī)范，包括：5.

6.7.8.9.10.11.12.13.

a)標(biāo)簽全部使用小寫；b)標(biāo)簽全部閉合；

c)所有屬性必須有值而且用雙引號；d)把所有clear:

---------------------------------------------------------容器布局}

每一個屬性結(jié)尾都必須寫分號，其中有的值如果不需要，可以不寫，大體上是這樣的順序，也符合思考的順序。

4.有幾點注意事項：

a)font-family:必須以sans-serif字體做結(jié)尾；b)減少樣式數(shù)量，盡量重復(fù)使用；c)必須清除float；d)單位：使用像素（px）；

e)顏色值：使用#RRGGBB格式

第四部分：UE指導(dǎo)原則

1.網(wǎng)站LOGO的視覺統(tǒng)一，網(wǎng)站主體的視覺風(fēng)格、文本顏色、鏈接顏色、修飾圖片風(fēng)格以及按鈕和表單控件的視

覺進(jìn)行統(tǒng)一；

2.為每一個頁面設(shè)定一個最合適的標(biāo)題，使用戶和搜索引擎一目了然知道頁面的主題；

3.為大部分頁面加入元標(biāo)記，即相關(guān)內(nèi)容，描述頁面屬性；在最終頁加入具有親和力的版權(quán)說明、

免責(zé)聲明、交互設(shè)計說明文檔的鏈接地址；

4.頁面中必須有回到“首頁”的鏈接一般做法是將站點LOGO加上首頁的鏈接，最好還是有回到首頁的文字

鏈接；

5.如果網(wǎng)站欄目很多，要讓用戶知道所處的頁面屬于哪個欄目之下，以及很輕松的可以回到上一級欄目標(biāo)簽

是一種不錯的方法；

6.現(xiàn)在位置。如果上一條原則處理的很好，“現(xiàn)在位置”可以去掉；

7.搜索。合理的放置搜索表單，最好在首屏，并且確保搜索結(jié)果的準(zhǔn)確性；

表單設(shè)計原則:

1.面向菜鳥和專業(yè)用戶，填寫項盡量精簡，做簡單的填寫說明，僅放置與填寫表單相關(guān)的鏈接，避免用戶通過其

他鏈接轉(zhuǎn)移視線到別的地方，從而放棄填寫表單

2.清晰的驗證告訴用戶為什么出現(xiàn)錯誤，并引導(dǎo)正確的填寫；

3.如果完成表單任務(wù)需要多個步驟，需要用圖形或文字表明所需的步驟，以及當(dāng)前正在進(jìn)行的步驟使用戶知

道離成功還有多遠(yuǎn)；

4.如果可能，盡量先放置input、textaera等需要鍵盤輸入的項，再放置下拉、單選、復(fù)選等鍵盤操作的項，緊

接著是“提交”按鈕就是說，減少鍵盤操作被鼠標(biāo)操作打斷的次數(shù)；

5.文本域允許更改內(nèi)容的文本格式，比如加粗、字體大小、超鏈接、圖片等等，而且，盡量讓此內(nèi)容與用戶完成

發(fā)布以后的內(nèi)容格式相同；6.提供將表單保存為草稿的功能；7.設(shè)計符合習(xí)慣的表單。

個人總結(jié)

Web開發(fā)的分散性和交互性，決定了Web開發(fā)必須遵從一定的開發(fā)規(guī)范和技術(shù)約定，只有每個開發(fā)人員都按照一個共同的規(guī)范去設(shè)計、溝通、開發(fā)、測試、部署，才能保證整個開發(fā)團(tuán)隊協(xié)調(diào)一致的工作，從而提高開發(fā)工作效率，提升工程項目質(zhì)量。本規(guī)范并不是一個一成不變的必須嚴(yán)格遵守的條文，特殊情況下要靈活運(yùn)用，做一定的變通，僅供個人參考。

擴(kuò)展閱讀：rsp技術(shù)開發(fā)規(guī)范總結(jié)

終端RSP

開

發(fā)規(guī)201*-3-4

范

目錄

一、StoryBoard規(guī)范....................................................................................................3

1、場景描述規(guī)范................................................................................................32、ServiceTree規(guī)范...........................................................................................3二、命名規(guī)范..............................................................................................................3

1、RSP命名規(guī)范................................................................................................32、元素節(jié)點命名規(guī)范........................................................................................33、RSP中Java代碼命名規(guī)范...........................................................................44、切圖圖片命名規(guī)范........................................................................................4三、注釋規(guī)范..............................................................................................................4

1、RSP文件注釋................................................................................................42、RSP節(jié)點注釋................................................................................................53、業(yè)務(wù)條件注釋................................................................................................5四、開發(fā)框架規(guī)范......................................................................................................5

1、目錄規(guī)范........................................................................................................52、RSP框架規(guī)范................................................................................................63、屏幕適配框架使用規(guī)范..............................................................................104、Cache使用規(guī)范...........................................................................................135、CacheObject使用規(guī)范.................................................................................14

一、StoryBoard規(guī)范

1、場景描述規(guī)范

1）描述場景功能，對每個場景編號，該編號和ServiceTree中場景編號對應(yīng)；2）描述場景中各個元素的來源，動畫效果和交互效果；

2、ServiceTree規(guī)范

ServiceTree要對沒一個業(yè)務(wù)場景編號，該編號和StoryBoard的場景編號對應(yīng)。ServiceTree要反映各個場景的跳轉(zhuǎn)和層次關(guān)系，根據(jù)此層次關(guān)系確定開發(fā)框架中的場景級數(shù)。

二、命名規(guī)范

1、RSP命名規(guī)范

RSP命名形式：文件所在位置_所屬業(yè)務(wù)_場景名_類型

文件所在位置是指文件是在客戶端還是服務(wù)器端。在客戶端的文件用"c"表

示，在服務(wù)器端的文件用"s"表示；

所屬業(yè)務(wù)是指該文件屬于哪個業(yè)務(wù)模塊，比如該頁面在客戶端，且屬于新聞模塊則寫成：c_news.rsp。業(yè)務(wù)名全部用英文表示;

場景名是指該rsp所描述對應(yīng)場景名，場景名用英文表示。如該頁面在客戶端是新聞模塊，描述的是新聞類型則該rsp名是c_news_type.rsp;類型是指該rsp是View還是Content。比如該頁面在客戶端，且屬于新聞模塊且為View則寫成：c_news_type_view.rsp;如果該rsp文件既不是View也不是Content則該類型可以不寫。

文件名一律小寫。

文件編碼必須是UTF-8

2、元素節(jié)點命名規(guī)范

節(jié)點命名形式：節(jié)點域_所屬業(yè)務(wù)_場景名_內(nèi)容描述

節(jié)點域，本地用“Local”，全局用“Global”禁止使用簡寫；

內(nèi)容描述，由開發(fā)人員定義。只要符合能表述清楚該節(jié)點的功能或內(nèi)容的原則就行。內(nèi)容描述用英文；

節(jié)點名稱遵循駝峰是命名規(guī)則，Global：newsDetail表示新聞明細(xì)或者Global：news_detail

其他描述同RSP命名規(guī)范。

3、RSP中Java代碼命名規(guī)范

RSP中Java代碼變量全小寫，只要符合能表述清楚該變量的意義的原則皆可。代碼編寫必須遵循java1.5的規(guī)范.遵循匈牙利命名規(guī)則.

4、切圖圖片命名規(guī)范

圖片命名形式：圖片所在位置_所屬業(yè)務(wù)_內(nèi)容

圖片所在位置是指圖片是在客戶端還是服務(wù)器端。在客戶端的圖片用"c"表示，在服務(wù)器端的文件用"s"表示；

所屬業(yè)務(wù)是指該圖片屬于哪個業(yè)務(wù)模塊，比如該圖片在客戶端，且屬于新聞模塊則寫成：c_news.png。圖片名全部用英文表示;

內(nèi)容是指對該圖片意思的表述，如該圖片是按鈕按下的圖片，在客戶端屬于新聞模塊則寫成：c_news_button_down.png

三、注釋規(guī)范

1、RSP文件注釋

在每個RSP文件開頭要有如下形式的注釋：2、RSP節(jié)點注釋

對RSP文件中的每個節(jié)點或節(jié)點塊頭標(biāo)明該節(jié)點對應(yīng)StoryBoard中的場景或動作效果。如：

........

3、業(yè)務(wù)條件注釋

如果由于業(yè)務(wù)條件的不同，同一個表示區(qū)域會有不同的效果或動作則要在條件判斷處要標(biāo)明在什么情況下會進(jìn)入哪段代碼。

四、開發(fā)框架規(guī)范

1、目錄規(guī)范

目錄規(guī)范用于說明項目工作區(qū)的文檔結(jié)構(gòu)，規(guī)范文件放置。具體結(jié)構(gòu)如下：src

公用目錄業(yè)務(wù)組1

子業(yè)務(wù)1子業(yè)務(wù)2…業(yè)務(wù)組2

子業(yè)務(wù)1子業(yè)務(wù)2…...Res

Devices設(shè)備配置目錄

Layouts界面布局配置目錄Skins皮膚配置目錄

不同分辨率圖片文件夾公用圖片夾業(yè)務(wù)1業(yè)務(wù)2…如圖:

表示:240x320分辨率下的”無線生活”文件下的”便民查詢”查詢文件夾

整個工作去分src，res，libs文件夾，分別放置源代碼，資源文件，外部包和配置文件。

src下每個業(yè)務(wù)分別建立自己的源代碼文件夾，文件夾名用能代表該業(yè)務(wù)的英文說明表示；

res下分為devices，layouts，skins三個文件夾，主要放置配置文件.分別放置公共資源，客戶端資源，服務(wù)器端資源。其中客戶端資源和服務(wù)器端資源中的各個業(yè)務(wù)的資源放置到自己所屬的業(yè)務(wù)資源文件夾中；

libs下放置擴(kuò)展包和交互API；

2、RSP框架規(guī)范

RSP框架規(guī)范用于說明終端開發(fā)中要遵循的各項框架性的準(zhǔn)則和要求，定義一個基本的開發(fā)結(jié)構(gòu)框架。

基本原則：

1、View/Content分離，View包含顯示框架、顯示邏輯和控制邏輯，放置在客戶端；Content負(fù)責(zé)與后臺交互并向View填充數(shù)據(jù)；

2、合理運(yùn)用緩存；

服務(wù)器端的場景要盡可能多的緩存；

對于沒有特定關(guān)聯(lián)關(guān)系的業(yè)務(wù)場景（新聞，天氣等）要使用一級緩

存以減少服務(wù)器編譯時間；

常用的外部資源（美圖業(yè)務(wù)的圖片）要使用二級緩存以減少RMS與外部的服務(wù)交互；

可預(yù)知用戶操作的業(yè)務(wù)（讀書）要使用CacheObect提前緩存，減少用戶等待時間；

使用緩存隊列維護(hù)緩存；建立合理的緩存控制機(jī)制。

3、定義符合該項目的主體場景樹；主體場景樹要求包含該項目的所有框架節(jié)點，供開發(fā)業(yè)務(wù)時使用；

4、開發(fā)過程中不要使用無target的Insert節(jié)點，主體場景樹定義RSP除外；5、除主體場景樹所在的RSP外不要有或減少Insert節(jié)點，特別是無target的Insert節(jié)點；

6、一個場景的Action盡量寫在一個單獨的Action節(jié)點中；7、場景加載時按照ServiceTree添加到對應(yīng)的級別Transform；

8、在同一個業(yè)務(wù)中有本級向下一級跳轉(zhuǎn)時不要刪除本級頁面代碼而是將本級隱藏，當(dāng)由下級向上級返回時刪除本級代碼，顯示上級節(jié)點；

9、如果業(yè)務(wù)存在過多的跨業(yè)務(wù)的跳轉(zhuǎn)需討論決定是否使用6，7兩點。因為此種情況下維護(hù)級別節(jié)點是個不小的開銷；

10、服務(wù)器端的RSP要被try/cache包住，并處理異常；

11、將一個RSP分成多個單元，將優(yōu)先顯示的內(nèi)容放在前面，次要的需要大量時間傳輸?shù)膬?nèi)容放在后面。根據(jù)實際場景做具體調(diào)整

12、關(guān)閉超時,最后才渲染的場景放在finally里面.主體框架示例：目錄結(jié)構(gòu)示例src

base

c_main.rsp

c_cache_clean_view.rsps_cache_clean_content.rsps_update_client.rsp

c_version_check_view.rsps_version_check_content.rspc_dummy.rsp

common

home

c_home_view.rsp

c_home_content.rspnews

c_news_base.rsp

c_news_type_view.rsps_news_type_content.rsp

res

clientcommon

background.png

foot.pngheader.pngnewsserver

commonnewslibs

client.jar

conf

文件說明

c_main.rsp

項目的主體場景樹。其包含了整個項目中要使用的節(jié)點。文件內(nèi)容見附件c_main.rsp

c_version_check_view.rsp，s_version_check_content.rsp

這兩個文件負(fù)責(zé)登錄時的版本校驗。在c_main.rsp最后會調(diào)用c_version_check_view.rsp這個文件，該文件中包含了所有需要校驗版本的業(yè)務(wù)Text節(jié)點和Save節(jié)點以保存版本號。s_version_check_content.rsp負(fù)責(zé)從后臺取最新的版本號并和已有的版本好比對，并更新版本號。如客戶端需更新則調(diào)用s_update_client.rsp。

"stzserver://c_cache_clean_view.rsp"/>

s_update_client.rsp

負(fù)責(zé)更新客戶端。關(guān)鍵代碼如下：

url="cmd://cleanRMSData?cached=TRUE&saved=TRUE"startTime="NOW">

c_cache_clean_view.rsp和c_cache_clean_content.rsp這兩個文件負(fù)責(zé)清理需要更新的緩存。用法如下

這樣把所有以news.rsp開頭的緩存就都清除了。

場景間的跳轉(zhuǎn)

每個場景在業(yè)務(wù)中都有其場景級別。當(dāng)要跳轉(zhuǎn)到該場景時要隱藏上一級的場景,需調(diào)用c_main.rsp中的對應(yīng)級別的動作。如第0級到第一級要調(diào)用

Global:replace_back_from_loading_for_content.L1這個方法隱藏第0級。返回時則調(diào)用Global:replace_back_from_loading_for_content.L0顯示第0級的內(nèi)容。

返回示例代碼：

場景的更新

每個場景頁面要在開頭替換掉之前該場景的內(nèi)容，一個空場景的模板代碼如下：

以第零級為例:

該場景的內(nèi)容

五、實用代碼規(guī)范

1、屏幕適配框架使用規(guī)范

屏幕適配通過scale或layout組件實現(xiàn)。屏幕適配的好處是開發(fā)一套UI能適配其他分辨率的版本，降低了開發(fā)工作量。

使用scale的好處是適配簡單，能快速應(yīng)用到一個新的分辨率。缺點是無法對場景進(jìn)行微調(diào)，如果發(fā)現(xiàn)界面上有部分顯示效果不佳只能以硬編碼的方式解決，無法通用。

Scale的使用已經(jīng)在開發(fā)框架中搭建好。只要配上后臺API就能使用。

使用layout的好處是它能精細(xì)的調(diào)節(jié)場景上的每一個元素，通過配置文件進(jìn)行管理，可以在不改變代碼的情況下適配各種分辨率。缺點是配置文件過多過復(fù)雜，如果layout被放置在服務(wù)器端使用則會影響效率，放在客戶端則不會。

要使用Layout需要adaptaion.jar包。新版本的Developer新建service時會自動提供該包，并會產(chǎn)生一個adaptation.xml。

以下是個標(biāo)準(zhǔn)的adaptation.xml

可以看出layout由Theme，Skin，Layout三部分組成。

Theme包含多個Skin，每個Skin負(fù)責(zé)定義該分辨率下各個元素的顯示樣式，如高度，顏色等。比如QVGA.xml：

其指定了footer_bg這個Image節(jié)點讀取圖片的url是“QVGA/footer_bg.png”，高度是20，名字為footer_txt的Text節(jié)點顏色是“#FFFFFF”。

LayoutSet是一個Layout集合，其可以包含多個Layout。Layout負(fù)責(zé)定義每個Transform的大小。如main.xml:

每個Container都定義了顯示的百分比高度等屬性，在RSP中只要調(diào)用這些ID就能將該Container的顯示定義加載到調(diào)用的Transform上。

在RSP中使用Layout的方法：首先要得到Container：

設(shè)置加載資源和Transform

這里最關(guān)鍵的是

root.getChildByIdRecurs("Search").applyTo(currentTransform);

它將配置文件中的屬性加載到了當(dāng)前的Transform，這樣就實現(xiàn)了通過配置文件設(shè)置頁面上元素的位子，大小，樣式。

2、Cache使用規(guī)范

Cache能將資源或頁面緩存到客戶端或服務(wù)器，提高了用戶使用速度。Cache分為客戶端Cache和服務(wù)器端Cache。

客戶端Cache

客戶端Cache是將訪問的場景緩存到客戶端。這樣用戶再次訪問該頁面時就不用訪問服務(wù)器，既減少了數(shù)據(jù)流量又提高的顯示速度。具體用法如下：

在RSP的header中加入緩存的屬性：

cacheable設(shè)置為true則該頁面會緩存clientCacheTtl設(shè)置緩存有效時間，以毫秒為單位。過了時間則緩存失效。Permanent是設(shè)置是否永久緩存，如果為true則會該緩存會保存到內(nèi)存上永不失效，除非通過命令清除緩存。

注意：由于RME默認(rèn)緩存大小只有1024KB所以如果要獲得更多的緩存空間需要修改默認(rèn)緩存值后重新編譯RME。

服務(wù)器端cache

服務(wù)器端cache分為cacheL1和cacheL2

L1的作用是在服務(wù)器端將stz文件緩存到內(nèi)存中。這樣減少了服務(wù)器與后臺交互以及生成stz的時間。

用法如下:

在中加入serverCacheTtl屬性，如

L2的作用是將外部資源緩存到服務(wù)器的內(nèi)存中，這樣可以減少RMS和外部服務(wù)器交互的時間。用法如下：

關(guān)鍵就是stzRequest.getExternalResource這個方法。此例子就是把指定url的圖片緩存到了服務(wù)器端。

3、CacheObject使用規(guī)范

當(dāng)用戶在瀏覽某一個頁面的時候，總是希望后臺此時不是空閑狀態(tài)，而是繼續(xù)下載即將可能會被加載的下一頁面，這樣，當(dāng)用戶點擊進(jìn)入下一頁面時，可以直接從本地緩存區(qū)讀取，節(jié)省了用戶的時間，達(dá)到更好的用戶體驗。使用方法如下：

cacheObject標(biāo)簽在streamezzo標(biāo)簽下使用，置于AUnits之間。url是需要提前加載的頁面，endTime是緩存頁面的生存時間，permanent是緩存頁面的存儲方式，priority確定頁面的下載順序。

此標(biāo)簽主要用于在瀏覽某一頁面時提前在后臺加載其他頁面，并緩存在本地，當(dāng)該緩存頁面的生存時間結(jié)束時，將其從本地清除，或者提前加載該緩存頁面的某一頁面從服務(wù)器重新被加載，則該緩存頁面被更新。注意：

（假設(shè)a頁面是主頁面，利用cacheObject提前加載其他頁面）1)a頁面可以同時提前加載緩存多個頁面，每個緩存頁面也可以設(shè)置相應(yīng)的

生存時間，在生存時間內(nèi)，緩存頁面存在于內(nèi)存中；

2)重新加載a頁面時，會重新下載cacheObject中設(shè)置的緩存頁面，即使該

緩存頁面生存時間尚未失效；

3)當(dāng)priority設(shè)置為HIGH時，根據(jù)cacheObject在AUnits中所處的位置決

定加載緩存頁面的時間；當(dāng)priority設(shè)置為LOW，則是在a頁面所有的AUnits都加載完后再加載緩存頁面；

4)a頁面加載的緩存頁面不能利用cacheObject來cachea頁面。我們假設(shè)a

頁面提前加載b頁面，b頁面提前加載a頁面，當(dāng)a頁面加載b頁面時會執(zhí)行b頁面中提前加載a頁面的操作，然后會再次重新從服務(wù)器加載a頁面，并再次執(zhí)行a頁面中提前加載b頁面的操作，如此一來就會形成一個死循環(huán)；

5)當(dāng)a頁面還在加載緩存頁面時，這時觸發(fā)動作跳轉(zhuǎn)到其他頁面，則加載

操作中斷，即最新的url請求會中斷前一個url請求；

6)假設(shè)a頁面提前加載b頁面，b頁面提前加載c頁面，那么就會形成一個

加載鏈，即在加載a頁面后會將b頁面和c頁面都提前加載下來，如此一來就會造成一定的混亂，尤其是當(dāng)這樣的加載鏈太長的時候。所以在使用時要事先規(guī)劃好頁面間加載與被加載的關(guān)系。

4、異常處理

異常處理在框架頁面（c_main.rsp）中集中注冊，并定義好出現(xiàn)異常后處理代碼。

首先注冊異常：

異常的名字在Java代碼中用String數(shù)組定義，在這用循環(huán)統(tǒng)一捕獲。每個異常捕獲命令的target屬性都是指向一個Action,該Action用于處理出現(xiàn)異常后的動作，比如顯示出錯信息并退出系統(tǒng)等。

5、上傳下載文件

上傳文件關(guān)鍵命令：cmd://uploadFile

參數(shù)：fileName上傳文件名fileType文件類型destURL目的url

onBegin當(dāng)上傳開始時調(diào)用的動作onSuccess當(dāng)上傳成功時調(diào)用的動作onError當(dāng)上傳錯誤時調(diào)用的動作progressTarget指定反應(yīng)上傳進(jìn)度的動畫segmentSize上傳文件每個包的大小Resume指定傳輸中斷后能否恢復(fù)onResume傳輸回復(fù)后調(diào)用的動作

Stop停止傳輸，這個參數(shù)只能單獨使用

示例：

下載文件：

關(guān)鍵命令：cmd://download

主要參數(shù)：contentURL下載內(nèi)容URLcontentName下載文件名

Type下載文件類型（Mime-Type）如“image/jpge”

beginDownloadTarget下載開始時調(diào)用的動作endOfDownloadTarget下載結(jié)束時調(diào)用的動作

errorDownloadTarget下載錯誤時調(diào)用的動作（該錯誤一共有6個）

totalSizeTarget指定顯示總共下載大小的text節(jié)點actualSizeTarget指定已經(jīng)下載的大小的text節(jié)點progressTarget指定反應(yīng)下載進(jìn)度的動畫示例代碼：

6、發(fā)送短信

關(guān)鍵命令：cmd://sms參數(shù)：num電話號碼Msg短信內(nèi)容示例代碼：

7、旋轉(zhuǎn)圖片

示例代碼：

Replace的target指向一個Bitmap節(jié)點，roteateVal為一個旋轉(zhuǎn)弧度的浮點值。

8、圖片縮放

示例代碼：

Replace的target指向一個Bitmap節(jié)點，vec2fvalue是x，y軸的縮放比例

9、調(diào)用電話薄

命令：cmd://getContactInfo

參數(shù)：phoneNumber顯示選擇的手機(jī)號碼的text節(jié)點示例代碼：

10、手動滾動Text節(jié)點文字

示例代碼：

11、監(jiān)控設(shè)備聲音

示例代碼：

Source值為volume，target指定一個展示音量的動畫節(jié)點

12、監(jiān)控電量

完整代碼：關(guān)聯(lián)電量：

電量顯示動畫：

13、存儲本地變量

設(shè)定一個存儲在本地的變量，利用此命令對此變量進(jìn)行設(shè)定、獲取、增量、減量的操作。

命令：fs_varSet；fs_varGet；fs_Add；fs_varSub示例代碼：

14、強(qiáng)制打開背景燈

命令：defaultBacklight

示例：

15、調(diào)用攝像頭照相

命令：cameraCapture，cameraVideo、cameraStopVideo、

launchCameraApplicationcmd：cameraCapture

使用：此命令用于調(diào)用手機(jī)攝像頭，并將照片存于本地。cmd：cameraVideo、cameraStopVideo

使用：此命令用于調(diào)用手機(jī)攝像頭，并將視頻存于本地，cameraVideo開始攝像，cameraStopVideo結(jié)束攝像。cmd：launchCameraApplication

使用：此命令用于調(diào)用手機(jī)攝像頭，并可以選擇是采用picture或是video模式。示例代碼

16、同一個圖片的多次引用

如果同一個圖片需要多次改變大小在不同的地方引用,圖片不要多次加載.示例代碼

必須用同一個streamID加載.然后對

17、repace語句的應(yīng)用

如果repace語句不需要在某種條件下調(diào)用,直接寫在auit節(jié)點中.不需要插入節(jié)點,杜絕這種寫法,如圖

正確寫法:

如果是條件調(diào)用,應(yīng)該插入相應(yīng)的節(jié)點中.采用上述寫法.

18、圖片的加載順序,場景的渲染順序.

圖片在rsp中的渲染順序必須,必須根據(jù)場景的順序加載,首先展示的圖片,放在靠前的aunit中.圖文混排的情況分多個aunit加載,必須對圖片進(jìn)行監(jiān)聽.用戶優(yōu)先看到文字,文字場景優(yōu)先渲染.讓用戶感到文字和圖片是異步加載的.

渲染文字加載圖片

渲染圖片,同時對圖片做監(jiān)聽

19、java代碼動態(tài)加載圖片.

intstate=0;booleanisSuccess=true;try{URLurl=newURL(cp[0].getFullScreenPicture());HttpURLConnectionurlConnection=(HttpURLConnection)url.openConnection();//建立http的鏈接urlConnection.setConnectTimeout(30000);//設(shè)置鏈接時間urlConnection.setReadTimeout(60000);//設(shè)置讀取時間state=urlConnection.getResponseCode();//獲取圖片的狀態(tài)System.out.println("state==="+state);if(state==200){isSuccess=true;InputStreamis=stzRequest.transcodeExternalImage(cp[0].getFullScreenPicture(),0,true/*servercache*/,24*3600*1000/*ttl*/);//采用流方式加載圖片,根據(jù)程序需要是否設(shè)置cache,cache多長時間.authoring.addImage("sid_beaty_pic",is,0);//綁定圖片}else{System.out.println("HHHHHHHHHHHHHHHHH加載服務(wù)器圖片失敗!"+state);%>//圖不存在的處理source="Global:weather_image_big"target="Global:pic_conditional_fail"/>

20、客戶端代碼樣例.

StzConnectorsManager.getAdaptationConnector(stzRequest.getService(),0);

%>

//Theskin,layoutanddevicepropertiescanbeaccessedfrom

thetransaction

//Beginatransactionforthecurrentrequest.

Stringtheme="theme";//TODOsettheaccuratethemevalueStringlayoutset="layoutset";//TODOsettheaccuratelayoutsetAdaptationTransactiontx=null;try{

tx=(AdaptationTransaction)

value

adaptationConnector.beginTransaction(stzRequest,theme,layoutset);

}finally{}

%>

21、服務(wù)器端列表

場景描述：網(wǎng)站listupdate來源RSP：c_News_view.rsp來源參數(shù)：參數(shù)類型:

進(jìn)入RSP：s_news_express進(jìn)入RSP參數(shù)：參數(shù)類型:

%>

StringStringPageNumTo=

//StringStringQueryPageNumPerTime=StringStringItemDisplayNum=

stzRequest.getRequestParameter("PageNumTo");

stzRequest.getRequestParameter("QueryPageNumPerTime");stzRequest.getRequestParameter("ItemDisplayNum");

intPageNumTo=Integer.valueOf(StringPageNumTo);//intQueryPageNumPerTime=intItemDisplayNumView=

//intItemDisplayNum=ItemDisplayNumView*

Integer.valueOf(StringQueryPageNumPerTime);Integer.valueOf(StringItemDisplayNum);QueryPageNumPerTime;

StringDataQuerySuccessed="false";

System.out.println(">>>>>>>>>>>>>>>>>>>>【FCity】:RequestSource:"+RequestSource);

System.out.println(">>>>>>>>>>>>>>>>>>>>【FCity】:ListID:"+ListID);

System.out.println(">>>>>>>>>>>>>>>>>>>>【FCity】:Cacheable:"+Cacheable);

System.out.println(">>>>>>>>>>>>>>>>>>>>【FCity】:ClientCacheTtl:"+ClientCacheTtl);

/****************************************************************

%>

/*******/*******【注意】ItemContents、ItemContentImageURLs、

************/

ItemFireURLs三個數(shù)組個數(shù)必須一致��！************//*******************/

%>

}else{

System.out.println(">>>>>>>>>>>>>>>>>>>>>>>【FCity】:ItemCount:"+ItemCount);

//列表item文字（沒有文字用""代替）

ItemContents[i]=item.getStructureName();//列表item圖片地址（沒有文字用""代替）ItemContentImageURLs[i]="";

StringimageUrl="";

for(inti=0;i

//列表item參數(shù)

item=(CMSResourceStructure)list.get(i);if(item!=null){

ItemParameters[i][0]=ItemParameters[i][1]=ItemParameters[i][2]=

String[]image=newString[ItemCount];String[]image2=newString[ItemCount];

//列表item參數(shù)

String[][]ItemParameters=newString[ItemCount][9];//列表item文字

String[]ItemContents=newString[ItemCount];//列表item圖片地址String[]ItemContentImageURLs=newString[ItemCount];//列表item默認(rèn)圖標(biāo)地址

String[]ItemIconDefaultURLs=newString[ItemCount];//列表item選中圖標(biāo)地址

String[]ItemIconSelectedtURLs=new

//列表item點擊地址

String[]ItemFireURLs=newString[ItemCount];//列表item點擊地址("Client"or"Server")StringItemFireURLType="Server";

String[ItemCount];

URLEncoder.encode("execute_show_news_main_action","UTF-8");URLEncoder.encode("WebsiteList","UTF-8");

URLEncoder.encode(item.getStructureid(),"UTF-8");i;

//列表item默認(rèn)圖標(biāo)地址（沒有文字用""代替）

ItemIconDefaultURLs[i]="Global:ItemBitmapTr"+

//列表item選中圖標(biāo)地址（沒有文字用""代替）ItemIconSelectedtURLs[i]="";

//列表item點擊地址（必須是服務(wù)器端的rsp,沒有文字用""代替,

注意，如果是Client頁面，前面需加"stzserver://"）

ItemFireURLs[i]="s_news_express.rsp";

DataQuerySuccessed="true";

//列表數(shù)據(jù)是否加載成功（無需更改）

stzRequest.addRequestAttribute("DataQuerySuccessed",

//列表item點擊地址（無需更改）

stzRequest.addRequestAttribute("ItemFireURLType",if(ItemParameters!=null)

//列表參數(shù)（無需更改）

stzRequest.addRequestAttribute("ItemParameters",

}}

ItemFireURLType);

ItemParameters);

//列表文字（無需更改）

stzRequest.addRequestAttribute("ItemContents",//列表圖片地址（無需更改）

ItemContents);

stzRequest.addRequestAttribute("ItemContentImageURLs",

//列表item默認(rèn)圖標(biāo)地址（無需更改）

ItemContentImageURLs);

stzRequest.addRequestAttribute("ItemIconDefaultURLs",

//列表item選中圖標(biāo)地址（無需更改）

ItemIconDefaultURLs);

stzRequest.addRequestAttribute("ItemIconSelectedtURLs",

//列表點擊地址（無需更改）

stzRequest.addRequestAttribute("ItemFireURLs",//列表總頁數(shù)（無需更改）

stzRequest.addRequestAttribute("PageCount",

ItemIconSelectedtURLs);

ItemFireURLs);

totalPage);DataQuerySuccessed);

}

target="Global:Transform.WheelAnchor.List.Item.Icon"/>

for(inti=0;i}

for(inti=0;i

authoring.addImage("ItemBitmap"+i,is,0);}catch(Exceptionre)

System.out.println("沒有取到圖片");

{//ResourceNotFoundException

field="Conditional.startTime"

%>

}catch(Throwablee){

e.printStackTrace();

startTime="NOW">

}

if(tx!=null){}

tx.endTransaction();

22、頁面節(jié)點清空策略

1.當(dāng)資源文件采用分模塊加載方式的時候,進(jìn)入當(dāng)前頁面清空其他頁面的資源節(jié)點.2.清空當(dāng)前頁面主節(jié)點.

3.如果僅僅是內(nèi)容替換,就不要用節(jié)點,而是直接采用方式.4.”返回”的時候如果是逐級返回,返回時清空當(dāng)前頁面主節(jié)點23、日志打印策略

由于日志管理對服務(wù)器的維護(hù)至關(guān)重要,目前系統(tǒng)的日志輸出時采用System.out.pritln();輸出.。這種打印輸出是極其錯誤的。Io操作對服務(wù)器性能影響很大。System.out.pritln();嚴(yán)禁使用。為了開發(fā)時方便調(diào)試，和服務(wù)器后期維護(hù)。日志打印方式采用：以下兩種方式。1.公共信息打�。�

ServiceLoggerlogger=stzRequest.getLogger();2.個人開發(fā)業(yè)務(wù)日志打印

ServiceLoggerlogger=new

ServiceLogger(stzSession.getId(),"service_id_YLTD_MT","service_name_YLTD_MT_WD");//標(biāo)示“娛樂天地_美圖”開發(fā)者吳迪日志級別：

logger.debug("★★★★=========loggerdebug============"+ogger.debug);logger.info("★★★★===========loggerinfo========="+logger.info);logger.warn("★★★==========loggerwarn======="+logger.warn);logger.error("★★★★===========loggererror======="+logger.error);logger.fatal("★★★★==========loggerfatal=========="+logger.fatal);

1.workbench里的調(diào)試信息，一遍采用logger.debug打印2.從接口取到的數(shù)據(jù)信息，采用logger.info

3.Trycatch中處理需要打印的信息，做了異常處理的信息采用logger.warn打印。其他采用logger.error打印

4.比較關(guān)鍵性信息，或者必須打印的信息采用logger.fatal，比較致命的信息采用logger.fatal

24、ant編譯

由于業(yè)務(wù)集成，按照新的組織架構(gòu)，采用jar方式集成，每個業(yè)務(wù)組單獨編譯自己的業(yè)務(wù)jar文件。以下是注意事項和如何配置ant配置文件。

Build.xml配置文件說明(該文件編碼必須為utf-8)

/>

Files/Java/jdk1.5.0_17/bin/java.exe"/>

25、layout框架規(guī)范

layout框架工作區(qū)目錄結(jié)構(gòu)(如圖)

Adapatation.xml主要關(guān)聯(lián)圖片配置文件,界面布局配置文件和設(shè)備配置文件.

Mappings.xml

該配置文件主要關(guān)聯(lián)特殊型號手機(jī)的型號配置..

default.properties

N96

nokia-N95-8GB.properties

設(shè)備屬性文件default.propertiespackage_version=1.0touchScreen=trueos=symbian

#os=java,WMSP(smartphone),WMPPC(pocketPC),S6050(SymbianS605th),S6030

mediaPlayer=downloadTarget=#supportOverlay#javaFullscreen

#supportNativeInstall=true目前只支持以上屬性配置,不支持自定義配置.

界面配置文件.

界面配置文件必須按照業(yè)務(wù)規(guī)則命名.yltd_mt.xml標(biāo)示娛樂天地的美圖業(yè)務(wù).詳細(xì)參數(shù)配置參見幫助文檔.和附件ppt.

API讀取相應(yīng)配置文件實例.

System.out.println("===========================top=="+top);

SkinImagebottom=skin.getImage("bottom");System.out.println("bottom=="+bottom);

SkinImagebg=skin.getImage("bg");System.out.println("bg=="+bg);

SkinImageloading=skin.getImage("loading");System.out.println("loading=="+loading);//讀取顏色值屬性

SkinColorstartColor=

//讀取圖形屬性

SkinShaperectangle=skin.getShape("RectangleShape");

skin.getColor("splashLoadingWheelStartColor");

//幫助里面錯誤了，

//ContainerrootContainer=tx.getRootContainer(/*LayoutName*/"myScene");

//讀取界面布局

ContainerrootContainer=tx.getRootContainer("main");

ContainerheaderContainer=rootContainer.getChildByIdRecurs("header");ContainerbodyContainer=rootContainer.getChildByIdRecurs("body");ContainerfooterContainer=rootContainer.getChildByIdRecurs("footer");

//API加載圖片

authoring.addImage("sid_top",top.getSource(),0);authoring.addImage("sid_bottom",bottom.getSource(),0);authoring.addImage("sid_bg",bg.getSource(),0);

authoring.addImage("sid_loading",loading.getSource(),0);

//讀取設(shè)備配置文件

Deviced=tx.getDevice();Stringpackage_version=null;

System.out.println("=========package_version===================="

d.getProperty("package_version",package_version);

+d.getProperty("package_version","package_version"));

System.out.println("=========t===================="+d.getProperty

System.out.println("=========d.getModel()===================="+d.

System.out.println("=========os===================="+d.getPropert

System.out.println("=========mediaPlayer===================="+d.g

System.out.println("=========downloadTarget===================="+%>

("touchScreen","false"));

getModel());

y("os",""));

etProperty("mediaPlayer",""));

d.getProperty("downloadTarget",""));

26、layout框架集成規(guī)范

目前項目組處于多業(yè)務(wù)組合作并行開發(fā)工作模式.隨著業(yè)務(wù)的增加,當(dāng)rsp頁面增多的時候編譯發(fā)布會越來越慢.鑒于此中原因,采用streamezzo的新的業(yè)務(wù)集成方式.首先由每一個業(yè)務(wù)組集成把rsp變成成class文件打成各自業(yè)務(wù)組的總的jar包,由業(yè)務(wù)組組長提交終端總體組發(fā)布.由于資源文件是共享的,仍然采用svn方式提交到svn服務(wù)器.各小組人員仍然要提交自己開發(fā)的rsp.以作源碼備份使用,集成發(fā)布不checkoutRSP源文件.這樣集成發(fā)布更快,程序版本備份更方便.

友情提示：本文中關(guān)于《前端技術(shù)規(guī)范總結(jié)》給出的范例僅供您參考拓展思維使用，前端技術(shù)規(guī)范總結(jié)：該篇文章建議您自主創(chuàng)作。

來源：網(wǎng)絡(luò)整理 免責(zé)聲明：本文僅限學(xué)習(xí)分享，如產(chǎn)生版權(quán)問題，請聯(lián)系我們及時刪除。

《前端技術(shù)規(guī)范總結(jié)》由互聯(lián)網(wǎng)用戶整理提供,轉(zhuǎn)載分享請保留原作者信息,謝謝!
鏈接地址：http://www.hmlawpc.com/gongwen/673094.html

• 上一篇：BBS論壇開發(fā)經(jīng)驗總結(jié)
• 下一篇：軟件項目總結(jié)報告