下載吧 - 綠色安全的游戲和軟件下載中心

          軟件下載吧

          當(dāng)前位置:軟件下載吧 > 圖形圖象 > PHOTOSHOP > 切圖教程,pdf格式切圖教程實(shí)例

          切圖教程,pdf格式切圖教程實(shí)例

          時(shí)間:2024-03-07 22:32作者:下載吧人氣:34

          在ios某個(gè)版本之后(原諒我只是一個(gè)設(shè)計(jì)師并不是很清楚到底是哪個(gè)版本正式開(kāi)始啟用pdf格式載入的),xcode6具有了基于矢量圖像(PDF文件)的編譯能力。

          UI設(shè)計(jì)師都會(huì)涉及到的一個(gè)問(wèn)題,切圖。在完成頁(yè)面設(shè)計(jì)之后,需要導(dǎo)出@1x @2x @3x三個(gè)尺寸的png圖像資源。哦呵呵呵呵呵呵,我每天都是帶著計(jì)算器在按。

          然而,現(xiàn)在xcode6有了pdf辨識(shí)的功能!直接帶來(lái)的2個(gè)非常直觀的影響。

          1,ios切圖從此只要切@1x,然后不論是哪個(gè)尺寸都能完美適配,達(dá)到最佳效果

          2,縮減app大小,優(yōu)化用戶下載體驗(yàn)。(因?yàn)榍袌D成pdf并且是@1x的時(shí)候占用空間非常小,并且省去了一整套@2x和@3x的切圖所占用的空間,喔呵呵呵呵呵想到app一下子減少了那么多大小,真是睡覺(jué)都笑出聲呢。)

          現(xiàn)在,一步步教大家如何切圖。

          一,photoshop,如果是在ps里繪制的矢量圖,請(qǐng)?jiān)趐s里切pdf。

          切圖教程,pdf格式切圖教程實(shí)例

          以上圖為例,這是一個(gè)求攻略出品的翻譯軟件,目前處于開(kāi)發(fā)狀態(tài)。這是一個(gè)在ps里用矢量畫的volume圖標(biāo)。切記,icon務(wù)必要用矢量畫,切圖pdf格式也僅支持矢量圖形。

          切圖教程,pdf格式切圖教程實(shí)例

          選中volume icon選區(qū),快捷鍵 command+鼠標(biāo)左鍵,然后按照選區(qū)大小新建大小相同的新文件。

          切圖教程,pdf格式切圖教程實(shí)例

          這時(shí)候,你會(huì)看到圖中所示。因?yàn)樵谠O(shè)計(jì)ui的時(shí)候是以iphone6為尺寸,也就是750。是@2x的時(shí)候的圖,所以此時(shí),我們切出來(lái)的圖是@2x的。

          還需要注意的一點(diǎn),當(dāng)從畫布1將icon 復(fù)制到畫布2的時(shí)候,要保持icon一直處在矢量狀態(tài)。切勿刪格化!否則大業(yè)未成,前功盡棄!

          切圖教程,pdf格式切圖教程實(shí)例

          如上圖所示,這時(shí)候點(diǎn)開(kāi)調(diào)整畫布,control+command+i快捷鍵,將寬高百分比調(diào)整到50%,也就是說(shuō)這時(shí)候你的icon切圖是@1x的狀態(tài)了。

          為什么要調(diào)整到@1x的狀態(tài)呢,因?yàn)锧1x的時(shí)候擴(kuò)展成@2x和@3x只要往上乘,而不是往下減。

          避免了切圖像素不整除的情況,但是我還是建議大小要取一個(gè)吉利的像素尺寸。

          此處晤面。記住,要把背景去掉,因?yàn)槟阈枰氖且粋€(gè)透明的背景。

          切圖教程,pdf格式切圖教程實(shí)例

          現(xiàn)在開(kāi)始儲(chǔ)存動(dòng)作,點(diǎn)開(kāi)另存為,找到photoshop pdf格式,勾選“作為副本”

          顏色什么的那么基礎(chǔ)的就淡淡的略過(guò)吧。

          切圖教程,pdf格式切圖教程實(shí)例

          點(diǎn)擊保存,之后會(huì)彈出來(lái)這么一個(gè)框。

          將“保留photoshop”編輯功能勾掉,

          只剩下“嵌入頁(yè)面縮覽圖”以及“優(yōu)化快速web預(yù)覽”然后點(diǎn)擊保存

          切圖教程,pdf格式切圖教程實(shí)例

          儲(chǔ)存出來(lái)直接是pdf格式,這時(shí)候你打開(kāi)預(yù)覽不論是放多大縮多小都是十分清晰,并且占用空間很小。

          這個(gè)volume切出來(lái)只有10kb!!!是不是為你app太大無(wú)法優(yōu)化的困擾頓時(shí)就在夢(mèng)里笑醒。

          二,illustrator,如果是在ai里繪制的矢量圖,請(qǐng)?jiān)赼i里切pdf。

          切圖教程,pdf格式切圖教程實(shí)例

          也是按照@1x的大小建立畫板調(diào)整好大小,并且另存為pdf格式。

          切圖教程,pdf格式切圖教程實(shí)例

          勾選“嵌入頁(yè)面縮覽圖”以及“從頂層圖層穿件Acrobat圖層”然后點(diǎn)擊保存。

          切記切記,ps和ai的矢量圖要在各自的軟件環(huán)境下切圖。所以比較推薦制作頁(yè)面的時(shí)候繪制icon在一個(gè)環(huán)境下繪畫。

          到這里,設(shè)計(jì)師部分的就結(jié)束了,看著一大堆,其實(shí)我是很詳細(xì)的把每一步都拆分的很仔細(xì),自己操作一遍其實(shí)很迅速。如果有心者可以試著做一個(gè)動(dòng)作會(huì)更方便,如果自己將來(lái)做動(dòng)作了會(huì)及時(shí)上傳上來(lái)。

          然后就是放入xcode6中,因?yàn)槲也⒉欢畑conde6是什么,特意從我們公司程序員大大討來(lái)教程貼在下面,所以下面的教程來(lái)自引用。因?yàn)槲乙粋€(gè)字都看不懂。

          如果你是設(shè)計(jì)師,這一段請(qǐng)拉的快一點(diǎn),因?yàn)槲冶WC你連讀都無(wú)法讀通順,就別想看懂了。

          1,如果你不已經(jīng)有一個(gè)XCAsset文件,然后創(chuàng)建一個(gè); 否則,打開(kāi)一個(gè)你已經(jīng)在你的項(xiàng)目中。

          2,從編輯菜單中的“新建映像集”。

          3,在出現(xiàn)新的圖像集,選擇空白圖像集,然后顯示在工具面板。

          4,選擇屬性檢查器。

          5,根據(jù)類型下拉菜單中選擇“矢量”。

          6,圖像設(shè)置將變成只有一個(gè)放置點(diǎn),標(biāo)有“全部 - 通用”

          7,拖放上面創(chuàng)建到落點(diǎn)的矢量PDF文件。

          接下來(lái),您將只需使用設(shè)置,你會(huì)與任何其他的圖像(無(wú)論是在代碼或通過(guò)接口生成器)Xcode的圖像目錄的圖像。例如,要求-imageNamed:在代碼中,并通過(guò)在圖像集的NSString的文字名稱。

          當(dāng)你建立你的項(xiàng)目時(shí),Xcode會(huì)去工作,創(chuàng)造@ 1倍,2倍@和@從您在Xcode的資產(chǎn)類別已經(jīng)使用的PDF 3倍PNG文件。舉例來(lái)說(shuō),如果你有一個(gè)@ 1X PDF,這是150像素x 150像素,然后Xcode中會(huì)生成以下PNG大小在應(yīng)用程序中使用:

          ·@ 1X PNG在150像素x 150像素

          ·@ 2倍PNG在為300px x 300px的

          ·@ 3倍PNG在450px x 450px

          當(dāng)你運(yùn)行應(yīng)用程序,iOS的會(huì)自動(dòng)選擇合適的@ 1倍,2倍@或@ 3倍的形象,Xcode的基礎(chǔ)上產(chǎn)生的設(shè)備需求。請(qǐng)務(wù)必注明您的自動(dòng)版式的限制,使得圖像不調(diào)整對(duì)大型設(shè)備,否則你會(huì)最終與模糊的圖像。xcode中產(chǎn)生基于所述@ 1倍的PDF圖像代替縮放矢量在運(yùn)行時(shí)對(duì)光柵圖像。

          有關(guān)將圖像添加到您的項(xiàng)目中此方法的一些注意事項(xiàng):

          這不是充滿載體的支持 - 在編譯時(shí)生成PNG圖像,而你保持在這個(gè)沒(méi)有控制權(quán)。

          你不能選擇一個(gè)新大小的圖像,一旦你指定使用矢量縮放后的圖像在你的應(yīng)用程序。堅(jiān)持使用您指定的大小,或者創(chuàng)造更大的尺寸新的PDF。否則,如果縮放與自動(dòng)版式,例如圖像將被扭曲。

          雖然iOS的8不包括全矢量支持(而不是Xcode的只是建立你的PNG在生成時(shí)) - OS X那樣- 如果你使用同樣的方法。在OS X中,你可以擴(kuò)展你的代碼,或者使用自動(dòng)版式圖像而沒(méi)有任何失真。

          沒(méi)有與以前的IOS版本不能向后兼容。所有的資產(chǎn)都被編譯成一個(gè)Assets.car文件只能夠通過(guò)的iOS 7和iOS 8讀取這是用于與資產(chǎn)目錄與iOS 7開(kāi)頭的同一個(gè)文件。

          如果你已經(jīng)有一個(gè)腳本或其他工具,可自動(dòng)實(shí)現(xiàn)這個(gè)要求,那么你可能看不到一個(gè)好處使用自動(dòng)生成的PNG這種方法; 但是,如果你使用的OS X和iOS應(yīng)用程序之間共享資源,它可能是一個(gè)方便的工具。

          標(biāo)簽夏敘,切圖教程,ps基礎(chǔ)教程,APP切圖,切圖

          相關(guān)下載

          查看所有評(píng)論+

          網(wǎng)友評(píng)論

          網(wǎng)友
          您的評(píng)論需要經(jīng)過(guò)審核才能顯示

          熱門閱覽

          最新排行

          公眾號(hào)

          主站蜘蛛池模板: 日韩成人无码一区二区三区| 人妻激情偷乱视频一区二区三区| 一区二区三区在线观看免费| 国产精品无码亚洲一区二区三区| 日韩精品一区二区三区毛片| 精品国产一区AV天美传媒| 日本亚洲成高清一区二区三区| 亚洲大尺度无码无码专线一区| 日韩一区二区三区在线| 国模无码一区二区三区不卡| 亚洲视频一区二区三区| 日韩精品无码一区二区三区 | 国产精品亚洲专区一区| 精品国产福利在线观看一区 | 久久久久人妻一区二区三区vr| 久久精品无码一区二区三区免费 | 日韩一区二区免费视频| 99精品久久精品一区二区| 2020天堂中文字幕一区在线观| 伊人色综合一区二区三区| 亚洲Aⅴ无码一区二区二三区软件| 中文字幕av人妻少妇一区二区| 国产精品一区二区av| 成人无码AV一区二区| 亚洲中文字幕无码一区| 无码日韩精品一区二区三区免费 | 无码人妻精品一区二区蜜桃| 久久婷婷色一区二区三区| 亚洲啪啪综合AV一区| 亚洲线精品一区二区三区 | 精品国产福利一区二区| 韩国美女vip福利一区| 无码丰满熟妇一区二区| 日韩免费无码一区二区视频| 国产一区美女视频| 国产一区二区视频在线观看| 久草新视频一区二区三区| 亚洲美女视频一区| 午夜肉伦伦影院久久精品免费看国产一区二区三区 | 无码人妻精品一区二区三区久久| 免费一区二区三区|