手機(jī)屏幕適配_第1頁(yè)
手機(jī)屏幕適配_第2頁(yè)
手機(jī)屏幕適配_第3頁(yè)
手機(jī)屏幕適配_第4頁(yè)
手機(jī)屏幕適配_第5頁(yè)
已閱讀5頁(yè),還剩1頁(yè)未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

1、手機(jī)屏幕適配 隨著手機(jī)屏幕的不斷的增大,同時(shí)也遇到一些用戶手機(jī)屏幕還是處于240*320這種屏幕的大小,當(dāng)然也存著在一些不規(guī)則的屏幕分辨率心寸大小。對(duì)于很多的ui來(lái)說(shuō),不同的手機(jī)屏幕很多時(shí)候得出多套的圖才能保證手機(jī)客戶端在不同的屏幕上實(shí)現(xiàn)匹配。針對(duì)手機(jī)客戶端在不同屏幕下的實(shí)現(xiàn)進(jìn)行規(guī)劃,并制定出能夠計(jì)算出具體控件位置的填充區(qū)算法,這個(gè)是前期對(duì)于不同的手機(jī)屏幕的匹配做出的一個(gè)界面適配算法。首先認(rèn)清幾個(gè)手機(jī)屏幕區(qū)域(先從240*320與320*240說(shuō)起):1、填充區(qū)container:在該標(biāo)準(zhǔn)中,使用填充區(qū)這個(gè)概念對(duì)界面進(jìn)行控制,整個(gè)頁(yè)面由不同大小的填充區(qū)組成,不同的填充區(qū)有在適應(yīng)屏幕時(shí),有不同的

2、縮放規(guī)則。2、screenscreen:根填充區(qū),每個(gè)分辨率下的可見(jiàn)區(qū)域尺寸,其尺寸等于某型號(hào)手機(jī)的屏幕分辨率。如在n73下,screen的參數(shù)為240*320。3、基準(zhǔn)屏幕針對(duì)橫屏和豎屏的屏幕,采用兩套不同的基準(zhǔn)屏幕,豎基準(zhǔn)屏幕240*320和橫基準(zhǔn)屏320*240,兩種基準(zhǔn)屏幕之間可以進(jìn)行切換。豎屏240*320合適屏幕縮放:豎屏的屏幕縮放基于240*320大小,可以縮放到480*640等屏幕的大小。滿足iphone以及安卓等用戶的需要。豎屏的字體比例縮放:控件適配不同屏幕的過(guò)程中,控件往往需要根據(jù)字體的縮放而進(jìn)行縮放。遵循的原則頭尾原則在常規(guī)界面的適配過(guò)程中,準(zhǔn)從先頭尾,后中間的原則,即

3、,先確定header的高度,再確定footer的高度,然后根據(jù)屏幕高度來(lái)和頭尾高度確定content填充區(qū)的高度,完成整個(gè)界面布局的調(diào)整。控件寬度以比例縮放原則為主。(常用界面)(android、iphone觸屏類型)(諾基亞、kjava等鍵盤(pán)類型)縮放原則:界面在適配于不同界面時(shí),主要采用兩套不同的縮放規(guī)則,不同的填充區(qū)根據(jù)需要分別采用字體縮放和比例縮放。整個(gè)縮放規(guī)則的設(shè)計(jì)來(lái)自圖片在不同屏幕間的適應(yīng)模式,我們假設(shè)有個(gè)n73手機(jī),屏幕分辨率為240*320,在這部手機(jī)上全屏看一張480*640的圖片,手機(jī)剛好顯示完,顯示效果如下(紅框?yàn)槠聊豢梢晠^(qū)域):如果我們用一部e63的手機(jī)(分辨率320*240)進(jìn)行查看,不同的查看模式下效果分別是(紅框?yàn)榭梢晠^(qū)域):(高度自適應(yīng)效果)(寬度自適應(yīng)效果)效果中可以看出,采用寬度自適應(yīng)效果進(jìn)行縮放的話,配合上、下滾動(dòng)條可以實(shí)現(xiàn)較好的顯示效果,同時(shí)保證能夠清晰查看圖片內(nèi)容。因此,借鑒圖片的寬度自適應(yīng),將界面當(dāng)成一張圖片來(lái)處理,通過(guò)不同屏幕分辨率的寬度比作為調(diào)整壁紙對(duì)界面進(jìn)行保持比例的縮放。啟動(dòng)界面:240*320-320*240:240*320-豎屏擴(kuò)展:320*240-橫屏擴(kuò)展:常規(guī)界面:240*320-320*

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論