手機屏幕適配原理

網(wǎng)站適配無疑已經(jīng)成為了傳統(tǒng)pc網(wǎng)站快速向wap網(wǎng)站轉(zhuǎn)型的很佳解決方案。網(wǎng)站適配得借助相關的技術才能實現(xiàn)。我們今天來說一下手機屏幕的適配原理，看看重慶網(wǎng)站建設公司創(chuàng)新互聯(lián)為您帶來的分析。

隨著手機屏幕的不斷的增大，同時也遇到一些用戶手機屏幕還是處于240*320這種屏幕的大小，當然也存著在一些不規(guī)則的屏幕分辨率心寸大小。對于很多設計人員來說，不同的手機屏幕需要多套圖片才能保證手機客戶端在不同的屏幕上實現(xiàn)匹配。針對手機客戶端在不同屏幕下的實現(xiàn)進行規(guī)劃，制定出一個能夠計算出具體控件位置的填充區(qū)算法，這個是前期對于不同的手機屏幕的匹配做出的一個界面適配算法。

首先認清幾個手機屏幕區(qū)域(先從240*320與320*240說起)：

1.填充區(qū)

CONTAINER：在這個標準中，使用填充區(qū)概念對界面進行控制，整個頁面由大小不一的填充區(qū)組成，不同的填充區(qū)有在適應屏幕時，有不同的縮放規(guī)則。

2.SCREEN

SCREEN：根據(jù)填充區(qū)，每個分辨率下的可見區(qū)域尺寸，其尺寸等于某型號手機的屏幕分辨率。如在n73下，SCREEN的參數(shù)為240*320。

3.基準屏幕

針對橫屏和豎屏的屏幕，采用兩套不同的基準屏幕，豎基準屏幕240*320和橫基準屏320*240，兩種基準屏幕之間可以進行切換。

豎屏240*320合適屏幕縮放：

豎屏的屏幕縮放基于240*320大小，可以縮放到480*640等屏幕的大小。滿足iPhone以及安卓等用戶的需要。

豎屏的字體比例縮放：當控件適配不同屏幕時，控件需要根據(jù)字體的縮放而進行縮放。

遵循的原則——頭尾原則

在常規(guī)界面的適配過程中，遵從先頭尾，后中間的原則，先確定頭部高度，再確定尾部高度，然后根據(jù)屏幕高度來和頭尾高度確定內(nèi)容填充區(qū)高度，完成整個界面布局的調(diào)整?？丶挾纫员壤s放原則為主。

縮放原則：

界面在適配于不同界面時，一般采用不同的縮放規(guī)則，不同的填充區(qū)根據(jù)需要分別采用字體縮放和比例縮放。

效果中可以看出，采用寬度自適應效果進行縮放的話，配合上、下滾動條可以實現(xiàn)較好的顯示效果，同時保證能夠清晰查看圖片內(nèi)容。因此，借鑒圖片的寬度自適應，將界面看作是一張圖片來處理，通過不同屏幕分辨率的寬度比作為調(diào)整壁紙對界面進行保持比例的縮放。

網(wǎng)站標題：手機屏幕適配原理
URL標題：http://muchs.cn/news31/115131.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供全網(wǎng)營銷推廣、面包屑導航、網(wǎng)站營銷、網(wǎng)站內(nèi)鏈、Google、微信小程序

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)