亚洲av无码成人专区片在线观看,亚洲av岛国动作片在线观看,少妇,喷水,亚洲av成人无遮挡网站在线观看,天堂网www资源在线

插件下載

注意：插件沒有在低于 39.1 版本上測(cè)試。插件的安裝就不再解釋。

Android Res Export 是一個(gè)用于導(dǎo)出 Android 各種資源的 Sketch 插件，包括 PNG 、App 圖標(biāo)、點(diǎn)九和 vector drawable 。

為什么要做這樣的軟件？Sketch 插件中用于導(dǎo)出資源的非常多，甚至不用插件也能湊合著用。

其實(shí)這個(gè)插件主要是解決一個(gè)困擾已久的問題。Nine-patch 俗稱點(diǎn)九的縮放。某些支持點(diǎn)九的 Ps 插件只是給內(nèi)容四周加上黑線而已。這種幼稚的行為，也是可以理解的，畢竟即使工作在國(guó)內(nèi)手機(jī)大廠的設(shè)計(jì)老司機(jī)們也不能清楚向新手解釋他們口中的點(diǎn)九是怎么回事。這個(gè)插件里面點(diǎn)九功能才是主角，其他功能都是贈(zèng)送的。

因?yàn)橐蕾囉诘谌降能浖?，?dǎo)致了這個(gè)插件其實(shí)是不太容易配置的，安裝了插件之后，后面的兩個(gè)功能對(duì)于大部分設(shè)計(jì)師的電腦是不能用的。其實(shí)贈(zèng)送的功能也蠻好用的。不想折騰的死美工可以直接往下滾到 “如何使用” 部分。

安裝完整支持

點(diǎn)九功能依賴 ImageMagick，Vector drawable 功能依賴 SVGO 來優(yōu)化最終代碼。很多設(shè)計(jì)師可能從未聽說過這兩個(gè) “命令行界面工具”?？赡芄ぷ鞫嗄甑?GUI 設(shè)計(jì)師都不知圖形界面外，還有文本界面，命令行界面。

為了不讓很多人覺得我強(qiáng)迫他們安裝一些沒啥用的東西，我覺得有必要介紹下這兩個(gè)工具。

ImageMagick 是個(gè)命令行圖像編輯軟件，支持近百種格式。你可以認(rèn)為這是個(gè)沒有界面的 Ps，夠 B 格了吧，例如處理一些圖片裁切合并轉(zhuǎn)換，你的同事 Ps 都還沒打開，你動(dòng)幾下鍵盤圖就出好了。即使處理成千上萬張圖那速度也是杠杠的。

SVGO，用于壓縮 SVG 代碼的，現(xiàn)在能干這事就這一家，沒其他選擇。壓縮前后代碼有一種胖子瘦成男神的勵(lì)志感，這早已不是拼一個(gè) PSD 幾個(gè)G的時(shí)代。SVGO 需要 Node.js, 有了 Node.js 你將擁有整個(gè) Node.js 生態(tài)圈。

這些都是撂妹神器，我只能幫你到這了，剩下的自己百度谷歌吧。插件只是依賴這兩個(gè)工具，其實(shí)不懂用也沒事，能安裝上就行了。

安裝 ImageMagick，推薦用 Homebrew 來安裝。也可以用 MacPorts 安裝，但 MacPorts 較復(fù)雜些，以下只介紹使用 Homebrew 的安裝方法。打開 Homebrew 網(wǎng)站中文版 （http://brew.sh/index_zh-cn.html）。 首先打開終端，粘貼 Homebrew 主頁(yè)上的代碼后，按下回車。安裝完畢之后，在終端輸入以下命令安裝 ImageMagick。需要等待幾分鐘。

brew install imagemagick

等到終端不再動(dòng)，并且可以輸入的時(shí)候，表示安裝完成。這時(shí)可以輸入以下命令確定是否安裝成功。

convert --version

如果等到幾行類似下面的信息，恭喜，你把這個(gè)非常強(qiáng)大的神器安裝成功了。

Version: ImageMagick 6.9.5-0 Q16 x86_64 2016-07-19http://www.imagemagick.org
Copyright: Copyright (C) 1999-2016 ImageMagick Studio LLC
License: http://www.imagemagick.org/script/license.php
Features: Cipher DPC Modules 
Delegates (built-in): bzlib djvu fftw fontconfig freetype gslib jbig jng jp2 jpeg lcms ltdl lzma openexr png ps tiff webp x xml zlib

接著安裝 SVGO 東西又需要先安裝 Node.js。打開 Node.js 主頁(yè) https://nodejs.org/en/ 主頁(yè)上那 2 個(gè)綠色大按鈕就是下載，下 v4.5.0 LTS 或 v6.4.0 Current 都可以。這個(gè)安裝包設(shè)計(jì)成 windows 安裝包的感覺，只需要一路點(diǎn)下一步。安裝完成后，打開終端輸入以下命令安裝 SVGO。

sudo npm install svgo -g

用以下命令驗(yàn)證是否安裝成功。

svgo -v

至此這個(gè)插件的功能就完整了。

如何使用

先從 Github 下載一個(gè)示例文檔 demo.sketch。

這個(gè)插件對(duì)設(shè)計(jì)稿的要求是必須是 MDPI (1x) 尺寸, 目前不支持以后也不會(huì)支持其他尺寸的設(shè)計(jì)稿。就是這么任性，你不接受可以自己改代碼啊。

先介紹贈(zèng)送的功能。普通的 PNG 資源使用 "Make Exportable" 或者添加切片的方式來表示此圖層將會(huì)被導(dǎo)出。或者選擇圖層從菜單執(zhí)行 "Plugin" - "Android Res Export" - "New" - "PNG Asset"。如果資源留出需要多余的空白，就使用切片， 否則用可導(dǎo)出功能，也可以統(tǒng)一都使用切片。

普通資源，命名在 "Exportable" 圖層或切片圖層上。點(diǎn)九和 Vector drawable 資源命名在最外層的分組上。App 圖標(biāo)則命名在畫板上。部分不合法的字符會(huì)被替換為下滑線。被修改和重復(fù)的資源命名，在導(dǎo)出時(shí)會(huì)保存到資源目錄下的 "report.txt" 文件內(nèi)。

執(zhí)行 "Plugin" - "Android Res Export" - "Export" - "PNG Asset" 導(dǎo)出普通資源前，如果執(zhí)行前文檔中有選中的可以導(dǎo)出的圖層，則只會(huì)導(dǎo)出選中的內(nèi)容，否則將導(dǎo)出當(dāng)前頁(yè)面中的所有資源。這個(gè)特性也適合點(diǎn)九的導(dǎo)出。導(dǎo)出 Vector drawable 則必須要求選中需要導(dǎo)出的內(nèi)容。

App 圖標(biāo)必須在 192x192px 的畫板內(nèi)，選中圖標(biāo)畫板，然后執(zhí)行 "Plugin" - "Android Res Export" - "Export" - "App Icon"。

導(dǎo)出到特殊前綴的文件夾。將文件夾的前綴寫在分頁(yè)的命名上，以 "@" 開頭，多個(gè)文件夾使用 "," 分隔。例如以下的命名表示當(dāng)前頁(yè)的內(nèi)容只會(huì)導(dǎo)出到 drawable-land-xxhdpi, drawable-land-xhdpi, drawable-land-xxxhdpi 這三個(gè)文件夾。

@land-xxhdpi, land-xhdpi, land-xxxhdpi

以下內(nèi)容必須成功安裝上文說的那兩個(gè)工具。

選擇圖層，然后從菜單執(zhí)行 "Plugin" - "Android Res Export" - "New" - "9-Patch Asset"，來創(chuàng)建一個(gè)點(diǎn)九資源。這會(huì)添加一些基礎(chǔ)的黑線，需要根據(jù)實(shí)際情況調(diào)整線長(zhǎng)度。

點(diǎn)九圖層組的結(jié)構(gòu)是這樣的：

分組  資源命名在此處 
  patch 此分組必須名為 patch
    ... 用矩形將黑線畫在此次，命名無要求
  content 此分組必須名為 content
    ...  內(nèi)容放此處，分組與否都行
    #9patch 切片，邊緣貼緊黑線，必須名為#9patch，復(fù)制組的時(shí)候注意此圖層會(huì)被添加 copy 字樣

選擇圖層從菜單執(zhí)行 "Plugin" - "Android Res Export" - "New" - "Vector drawable Asset"，來創(chuàng)建一個(gè) Vector drawable 資源。選擇 Vector drawable 資源組內(nèi)所有的形狀圖層，在屬性面板的填充中點(diǎn)擊設(shè)置圖標(biāo)，選擇 "Non-Zero"，然后從菜單 "Layer" - "Paths" - "Reverse Order" 執(zhí)行反轉(zhuǎn)路徑順序。

在組內(nèi)的 "#" 圖層表示切圖的邊界，必須保留。生成 XML 文件的過程會(huì)刪除多余的代碼。

Android 的 Vector Drawable 不支持 SVG 的某些特性，所以矢量圖層的填充設(shè)置要改為 Non-Zero。

P.S.

能看完這么長(zhǎng)的文章，并且成功安裝上的，都不是簡(jiǎn)單的設(shè)計(jì)師，不妨留個(gè)評(píng)論。