2021-1-4 前端達人
這一期專門為大家講解下在sketch中切圖問題
切圖作為UI設(shè)計師的必備技能，其實有許多地方困擾著很多同學們。比如批量下載切圖、切圖命名、不同切片的類型這些都有同學或多或少的有些迷茫。這一期專門為大家講解下在sketch中切圖問題。
在本文中我們將sketch中的切片分為兩類：一是內(nèi)置切片，二是獨立切片。
我們將某元素點擊導出按鈕之后形成的切片稱之為內(nèi)置切片，如下圖：
內(nèi)置切片相對比較簡單，他的切圖范圍是跟隨他所依附的元素的大小而改變的。而且只能切出所依附的元素本身。
由切片工具繪制而來的切片我們稱之為獨立切片
獨立切片范圍是可以隨意更改的，不依附于想要切的元素。并且可以切出所有在切片范圍中顯示的視覺元素。
如果我們需要用獨立切片去切出特定的元素，那么我們需要將切片和我們需要切的元素打組，并且在導出選項內(nèi)勾選“Export group contents only”就可以只切組內(nèi)我們需要的內(nèi)容了。
當然我們對于這兩種切片還有更詳盡的講解，大家可以去看之前我們專門關(guān)于切片的視頻教程：https://www.bilibili.com/video/BV1ik4y1k7aU
由于現(xiàn)在越來越多的團隊選擇使用藍湖切圖，我們講一下切圖中使用到藍湖時候的注意事項。
首先我們需要上傳設(shè)計稿到藍湖，再上傳的時候我們要對照自己的設(shè)計稿尺寸選擇對應的參數(shù)
是不是覺得上傳之后就大功告成，下載切圖什么的就交給開發(fā)小哥哥去處理了？
No no no!!!
為了讓開（zi）發(fā)（ji）更省心省力，我們還需要和開發(fā)小哥哥溝通一下藍湖的設(shè)置，方便他們操作。
首先我們需要在設(shè)置中將“切圖置頂”勾選，以防止開發(fā)在點選切圖元素時誤操作導致下載的切圖不正確。
然后我們還需要勾選“下載切圖有重名時替換”選項。這里是為了防止出現(xiàn)在不同頁面上的同一元素被重復下載，造成混亂。
如果我們遇到安卓的切圖，開發(fā)時出現(xiàn)了正確的圖標開發(fā)出來之后尺寸發(fā)生變化的情況。我們建議將設(shè)置中“Android 文件夾以drawable 命名”選項勾選。
另外還有一個藍湖使用的小技巧可以告訴大家，就是在藍湖中按住鍵盤shift鍵，鼠標框選多個畫板，然后右鍵就可以在選項中選擇“下載選中頁面全部切圖“，是不是覺得離準點下班又進了一步呀～
最后還有一點要提醒大家，在sketch中我們?yōu)榻M件命名時所用到的“/”符號。如果用在了切片上，那么在藍湖下載切圖的時候會根據(jù)“/”形成文件夾。所以這里向大家推薦一款比較實用的插件——自動化。他可以將我們命名中的“/”自動修改為“-”或者”_“，這樣我們在使用藍湖的時候就不用再手動去修改切片中的特殊符號了啦。
插件下載地址
https://www.yuque.com/tuotadamowang/dhq5di/irybf6#SGtSu
好啦，本期就聊到這里，我們下期再見喲～
轉(zhuǎn)自：站酷
藍藍設(shè)計( www.teruid.com )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
藍藍設(shè)計的小編 http://www.teruid.com