Sketch想必小伙伴們都已經(jīng)用的挺熟悉的啦，在你的工作中，應(yīng)該常常碰到各樣切圖尺寸大小的問題。陳踢缺er曾在設(shè)計(jì)App項(xiàng)目中也遇到過各種這樣的問題，下面我來結(jié)合實(shí)際操作來分享給大家使用sketch如何更加快速完成你的切圖工作，然后更安心的把剩余時(shí)間花在你的設(shè)計(jì)工作上。

小伙伴們的設(shè)計(jì)稿尺寸因?yàn)轫?xiàng)目要求和開發(fā)人員協(xié)商等因素導(dǎo)致不同，一般的設(shè)計(jì)稿尺寸 蘋果IOS的有 375*667750*1334 320*568 640*1136等等安卓的有 720*1280320*480480*8001080*1920等等

以下我只列出最常用的兩種尺寸供大家參考為例。

iPhone一般要求導(dǎo)出@2x @3x切圖即可安卓一般要求導(dǎo)出mdpi hdpi xhdpi xxhdpi xxxhdpi切圖

基于你的設(shè)計(jì)方案尺寸導(dǎo)出其他尺寸切圖，首先你要熟悉不同尺寸之間的換算倍數(shù)關(guān)系。

接下來是具體設(shè)置切圖方案的步驟

Step1

點(diǎn)擊頂部菜單欄的Sketch（就在蘋果圖標(biāo)右邊）—— Preferences

或者在畫板上隨便選擇一個(gè)設(shè)計(jì)元素，然后點(diǎn)擊界面右下角的Make Exportable

按如下圖步驟也能打開切圖方案選項(xiàng)卡

Step2

新建你想要的切圖方案

切圖方案設(shè)置的基本介紹（這是基于375px設(shè)計(jì)稿所設(shè)置的切圖方案）

切圖方案設(shè)置就可以是這樣（這是基于750px設(shè)計(jì)稿所設(shè)置的切圖方案）

剛開始可能頭有點(diǎn)暈，我再來總結(jié)一下對(duì)應(yīng)關(guān)系多看幾遍就明白了（明白了你就一通百通，羽化成仙啦～）

所以，切圖方案設(shè)置的關(guān)鍵點(diǎn)在于設(shè)計(jì)稿尺寸倍數(shù)關(guān)系的換算和你最終想要導(dǎo)出的切圖尺寸兩方面的考慮

如果明白了以上兩點(diǎn)，同樣的思路，安卓的切圖尺寸方案設(shè)置也就撒撒水啦～

因此列出了關(guān)系換算表那么切圖方案如何設(shè)置也就非常清晰了。

那么，我也不是針對(duì)誰…我只想說的是...還有什么切圖比例不能導(dǎo)出呢？還有什么切圖格式不能一鍵導(dǎo)出呢？

網(wǎng)頁？Icon? Banner？統(tǒng)統(tǒng)滴全部搞定。真正的設(shè)置三分鐘，裝逼一輩子有木有?。?！

然后接著還可以這樣…

您可以隨意設(shè)置切圖種類／切圖的前綴后綴／切圖格式／切圖方案名稱，突然浮現(xiàn)出一個(gè)畫面…

切圖不僅僅是尺寸大小問題，特殊的切圖還會(huì)遇到比如 統(tǒng)一大小icon切圖，安卓的點(diǎn)9切圖，分塊切圖，混合切圖等情況。所以接下來后續(xù)還會(huì)告訴大家一些特殊的切圖方法，當(dāng)然，大前提還是要和程序猿哥哥們溝通好。

文章如果轉(zhuǎn)載請(qǐng)署名作者名稱

不明白的地方也可以文章留言或私信我，有空我會(huì)及時(shí)回復(fù)你，

其中可能會(huì)有不對(duì)的地方，歡迎大家留言糾正，與大家一起成長(zhǎng)。