Avocode官方版

Avocode官方版是一款非常優(yōu)秀的圖像處理軟件，擁有良好的用戶界面，且占用內(nèi)存小，還可以生成包含圖層和字體樣式的簡潔代碼。軟件操作非常簡單，以CSS，Swift與Android代碼的形式導(dǎo)出圖層樣式，只需簡單的點(diǎn)擊，即可測量距離，選擇顏色，即可獲得字體樣式它可以幫助用戶查看設(shè)計(jì)作品的軟件，通過它，您可以將設(shè)計(jì)的作品放到軟件分享，可以發(fā)送給客戶查看，實(shí)現(xiàn)團(tuán)隊(duì)之間共享作品素材。它支持多種網(wǎng)頁設(shè)計(jì)以及媒體設(shè)計(jì)內(nèi)容編輯，包括HTML、CSS代碼等作品，您可以在軟件上查看設(shè)計(jì)流程，可以查看設(shè)計(jì)元素、可以查看作品的評(píng)論，方便開發(fā)人員在軟件上管理作品。它允許您邀請(qǐng)團(tuán)隊(duì)成員瀏覽作品，也可以將作品鏈接發(fā)送給其他成員，讓更多人評(píng)論您的作品。歡迎有興趣的小伙伴前來下載體驗(yàn)！

功能特點(diǎn)

1、直接打開.psd和.sketch文件而不啟動(dòng)Photoshop和Sketch
Avocode能自行渲染Photoshop和Sketch設(shè)計(jì)。因此，您可以在任何操作系統(tǒng)上打開與檢查您上傳到Avocode的所有設(shè)計(jì)，無需其他設(shè)計(jì)工具。
2、導(dǎo)出適用于網(wǎng)頁、IOS或Android程序的代碼
生成包含圖層和字體樣式的簡潔代碼(CSS，Less，Sass，Less，SCSS，Stylus，React Native，CSS，JS，Swift和Android)，單位為px，pt，dp或rem，顏色為HEX, HEX8, HSLA，RGBA或UIColor。
3、將圖像導(dǎo)出為@4x或xxxhdpi分辨率
每個(gè)圖層都完全渲染，您可以將任何文件導(dǎo)出為PNG，JPEG，SVG或WEBP圖片格式，無需預(yù)先設(shè)定可導(dǎo)出文件或重命名圖層。插值矢量形狀，添加更多的分辨率變量以適應(yīng)任何桌面、IOS或Android屏幕。
4、測量，不要目測
即刻獲知任何圖層的大小或圖層之間的距離。選擇多個(gè)圖層并測量它們與其他圖層之間的距離。查看設(shè)計(jì)指南，或創(chuàng)建自己的指南來檢查對(duì)齊，或查看不同對(duì)象之間的距離。
5、從每個(gè)像素中手動(dòng)選取 #BADA55顏色
手動(dòng)復(fù)制顏色并轉(zhuǎn)換……這真是上個(gè)世紀(jì)的做法了。只需選擇一種顏色，顏色代碼將會(huì)立即添加到剪貼板，讓您可以復(fù)制粘貼到任何需要的位置。
6、將文字圖層導(dǎo)出為純文本、圖像或HTML代碼
當(dāng)您選中文字圖層時(shí)，可以將它導(dǎo)出為圖像，復(fù)制純文本或復(fù)制帶HTML標(biāo)簽的文本?！皹邮?STYLES)”面板將顯示所有的圖層信息，例如字體家族，字體粗細(xì)和字體大小等。
7、自定義代碼輸出并定義變量
隱藏屬性并重新調(diào)整代碼行。創(chuàng)建替換規(guī)則并將任何值(顏色，字體，漸變，大小，距離)定義為變量都將自動(dòng)顯示在導(dǎo)出的代碼中。

使用教程

1、注冊(cè)登錄之后。當(dāng)前需要?jiǎng)?chuàng)建一個(gè)文件夾。創(chuàng)建文件夾可以選擇你需要的切圖的類型，有IOS,ANDROID,WEB三種類型。我們這里選擇的WEB.
2、進(jìn)入之后可以選擇上傳按鈕上傳我們的PSD文件，這里有一個(gè)問題，就是這是國外的軟件，服務(wù)器在國外，如果沒有科學(xué)上網(wǎng)的話，上傳的速度會(huì)讓你痛不欲生，因此作為一個(gè)程序員科學(xué)上網(wǎng)是非常重要的。
3、打開這個(gè)psd之后，可以看到很多工具欄。在界面中的左邊，有四個(gè)按鈕圖層、活動(dòng)信息、版本記錄、psd的多種相關(guān)信息。上邊的工具欄是對(duì)psd進(jìn)行具體的切圖工作。右邊的工具欄顯示的是具體選中或者進(jìn)行操作的獲得的圖層信息。

常見問題

如何將Avocode連接至Slack?
1、注冊(cè)Slack或者登錄您的賬號(hào)以開始使用。
2、Visit our 幫助中心 for instractions on how to authenticate your account。
3、如果您想在特定的#頻道內(nèi)收到項(xiàng)目相關(guān)通知，請(qǐng)?jiān)贏vocode內(nèi)打開項(xiàng)目，點(diǎn)擊“添加至Slack”。
4、如果您想在一個(gè)頻道內(nèi)接受團(tuán)隊(duì)內(nèi)的消息，請(qǐng)選擇“團(tuán)隊(duì)設(shè)置/集成”，然后點(diǎn)擊“添加至Slack”。
5、每當(dāng)您收到Slack的設(shè)計(jì)或評(píng)論通知時(shí)，您可以點(diǎn)擊評(píng)論，并在Avocode網(wǎng)頁版中打開相應(yīng)的設(shè)計(jì)。