中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

編輯導(dǎo)讀：在進(jìn)行車(chē)載UI工作前，我們需要了解清楚不同的度量單位，不同的度量單位對(duì)尺寸會(huì)有影響，根據(jù)尺寸進(jìn)行適配。本文將從三個(gè)方面對(duì)車(chē)載UI的尺寸和適配進(jìn)行分析介紹，希望對(duì)你有幫助。

在談車(chē)載UI基準(zhǔn)尺寸之前，老生常談的說(shuō)一下各度量單位：

我們先了解最基本的尺寸了。在設(shè)計(jì)中我們一般會(huì)碰到的度量單位有：dpi、ppi、dp、sp、px、pt，其中px是我們經(jīng)常使用也最為熟悉的單位。

簡(jiǎn)單了解一下各自的定義：

• ? ?px：像素。圖像分辨率，即屏幕上組成一幅圖或照片的最基本單位。
• ? ?pt：點(diǎn)，印刷常用單位。1pt=1/72英寸。
• ? ?ppi：每英寸像素?cái)?shù)，值越高，屏幕越清晰。
• ? ?dpi：每英寸多少點(diǎn)，值越高，圖片越清晰。
• ? ?dp：安卓開(kāi)發(fā)用的長(zhǎng)度單位。在160ppi的情況下1dp=1px。
• ? ?sp：安卓開(kāi)發(fā)用的字體大小單位。

各個(gè)單位之間的換算就不再文本中重點(diǎn)闡述了，網(wǎng)上有很多大量的換算文章。這里只稍微補(bǔ)充一下，安卓端屏幕大小各不相同，根據(jù)像素密度，分為幾種規(guī)格：

以上，1dp定義為屏幕密度值160ppi時(shí)的1px，即在mdpi時(shí)，1dp=1px，以mdpi為標(biāo)準(zhǔn)，這些屏幕的密度值比為0.75：1：1.5：2：3；即以xhdpi為標(biāo)準(zhǔn)，1dp=2px。

就目前市場(chǎng)狀況而言，各個(gè)車(chē)廠車(chē)機(jī)尺寸粗略判斷。雖然不太全面，至少有一些參看意義：

車(chē)機(jī)圖片來(lái)源于網(wǎng)絡(luò)

綜上所述，xhdpi,xxhdpi是主流車(chē)機(jī)屏幕分辨率。

一、設(shè)計(jì)稿尺寸

根據(jù)目前市場(chǎng)主流設(shè)備尺寸來(lái)看，我們要用1280*720來(lái)做車(chē)機(jī)UI設(shè)計(jì)稿尺寸。

為什么會(huì)選擇1280*720作為設(shè)計(jì)稿標(biāo)準(zhǔn)尺寸的原因有三：

原因一：從中間尺寸向上向下適配的時(shí)候界面調(diào)整的幅度最小，最方便適配。而1280*720正好是常用分辨率的中間數(shù)值。

原因二：大屏幕時(shí)代應(yīng)該選用大尺寸設(shè)計(jì)，依然使用小尺寸會(huì)限制設(shè)計(jì)的設(shè)計(jì)視角，而且很大程序小尺寸會(huì)局限信息結(jié)構(gòu)的排版布局，以及內(nèi)容展示。

原因三：用主流尺寸來(lái)做設(shè)計(jì)稿尺寸，極大的提高了視覺(jué)還原和其它機(jī)型適配。

所以，我們把基準(zhǔn)尺寸設(shè)定為1280*720px來(lái)設(shè)計(jì)。sketch里面可以按照640*360尺寸設(shè)計(jì)。

二、前端適配方案

從市面大多車(chē)機(jī)系統(tǒng)設(shè)計(jì)研究表明，70%左右的車(chē)機(jī)左側(cè)導(dǎo)航為常駐導(dǎo)航，25%的微桌面卡片式，5%的是桌面應(yīng)用圖標(biāo)。

用戶(hù)反饋和測(cè)試研究也發(fā)現(xiàn)，左側(cè)欄更靠近駕駛員，更利于操作。事實(shí)上，Android Auto 之前一直把快捷按鍵放到屏幕底部，除了增加了司機(jī)的操作負(fù)擔(dān)之外，還壓縮了車(chē)載導(dǎo)航可視區(qū)域的高度。不過(guò)在2017年的 Google I/O 上，谷歌展示的奧迪定制車(chē)載導(dǎo)航也把快捷鍵放在了左邊，這也側(cè)面印證了這種交互方式的可行性。

產(chǎn)品框架和設(shè)計(jì)尺寸都已經(jīng)定好。在研發(fā)階段唯一不可缺少的是適配方案，設(shè)計(jì)稿在不同設(shè)備上到底怎樣表現(xiàn)？假設(shè)遇到了更寬的設(shè)備，是橫向拉寬？還是等比縮放？還是再設(shè)計(jì)一個(gè)截然不同的布局？這些前提基本確定了該設(shè)計(jì)稿會(huì)如何實(shí)現(xiàn)，這樣在寫(xiě)代碼時(shí)就不會(huì)出現(xiàn)反復(fù)更改和適配單獨(dú)做的情況。

前端的適配方案大致分為四種：按照比例縮放、根據(jù)頁(yè)面寬度百分比適應(yīng)、響應(yīng)式方案以及REM縮放方案。每個(gè)方案都有自己的優(yōu)缺點(diǎn)，可以同時(shí)使用多種適配方案，規(guī)定規(guī)則。

以聽(tīng)伴車(chē)載產(chǎn)品為例，簡(jiǎn)單闡述一下前端適配方案：

以高度為基準(zhǔn)，等比例縮放尺寸中高度不變的情況下，橫向?qū)挾瓤s放只需要填充內(nèi)容。

比如：1280*720設(shè)計(jì)稿要適配到1824*1200時(shí)，高度按比例縮放到1200的尺寸為2133*1200，高度不變，只需要把橫向內(nèi)容2133壓縮至1824.橫向的占比按照1824處理。

特定情況下適配導(dǎo)航會(huì)出現(xiàn)運(yùn)營(yíng)文案少的情況，針對(duì)于此可以單獨(dú)針對(duì)此車(chē)機(jī)刪減右側(cè)的功能入口icon。

其中制定迷你播放器的最低高度90px，如果達(dá)到最低高度那就取消播放器，放置成懸浮按鈕。

比如：hdpi基準(zhǔn)下800*450，播放器高度為90px，播放器上的文本內(nèi)容已經(jīng)顯示已經(jīng)小于16px了，車(chē)主查看的辨識(shí)度很弱。所以，在車(chē)機(jī)高度<450時(shí)，播放器消失到左下角變成常駐懸浮按鈕。

先以安卓自有的適配規(guī)則適配，再滿足以上兩個(gè)條件。

以上需要技術(shù)評(píng)估方案的可行性，在逐步進(jìn)行方案的優(yōu)化。所以，設(shè)計(jì)師跟研發(fā)之間要有成熟的設(shè)計(jì)規(guī)范和相對(duì)應(yīng)的研發(fā)規(guī)范支撐。

三、需要注意

從設(shè)計(jì)稿尺寸建立和藍(lán)湖上傳問(wèn)題上需要注意：

設(shè)計(jì)稿建立1280*720，藍(lán)湖上傳時(shí)一定要按照xhdpi 上傳。

設(shè)計(jì)稿做的是@2倍圖，上傳藍(lán)湖確實(shí)按照@1倍圖（mdpi)的通道上傳。導(dǎo)致藍(lán)湖上的數(shù)值各項(xiàng)都會(huì)偏大，在適配的時(shí)候就會(huì)出現(xiàn)模糊，圖片過(guò)大過(guò)小的問(wèn)題。

設(shè)計(jì)稿輸出階段要及時(shí)跟研發(fā)溝通適配方案。

如果適配方案雙方達(dá)成一致，就可以著手研發(fā)，如果存在問(wèn)題，調(diào)整完再進(jìn)行，不然事倍功半。

設(shè)計(jì)時(shí)要思考界面的延展性和易通性。

規(guī)范一定要在項(xiàng)目研發(fā)前完成（除非特殊情況），這樣才能在做一個(gè)項(xiàng)目之初全盤(pán)考慮需要做的事情，規(guī)避后續(xù)適配問(wèn)題的發(fā)生。

本文由 @Crystal 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來(lái)自 Unsplash，基于CC0協(xié)議