---

之前搗鼓了點器械，要適配6和Plus，本身做做切圖才發明確切有夠煩。基於矢量圖生成PNG圖形的辦法也是過後才曉得，進修下，願望接上去可以理論。上面進入譯文。

IOS運用的視覺情勢平日是以圖形元素驅動的。在設計開辟一款運用時，你須要分歧規格的運用圖標，例如分歧尺寸的Default.png圖片，同時還須要為UI的完成預備@1x和@2x圖形資本。一切這些圖形元素都邑讓你的產物看上去更吸惹人，但弊病也是很顯著的 - 你須要為每種規格的圖形元素零丁切圖。而跟著iPhone 6及Plus的宣布，我們又多了一套@3x須要處置，工作變得愈來愈龐雜。

榮幸的是，蘋果在Xcode 6傍邊給我們帶來了一些很棒的對象用以治理圖形資本。更棒的是，新的對象和完成方法可以幫我們自在的應對將來的IOS裝備，例如基於Storyboard為IOS 8裝備生成啟動圖片，如許你就無需再為分歧的裝備類型零丁制造。另外還有一個異常主要的新功效，就是在運用構建階段基於PDF圖片文件主動生成各類規格的圖形資本。本文中，我們就來一路摸索一下這類能幫你節儉年夜量時光本錢的辦法。

第一步：應用Illustrator生成PDF矢量圖形

起首，我們須要PDF格局的矢量圖形。你可使用Adobe Illustrator或你所熟習的其他矢量圖形對象來生成，@1x規格的便可。

假如你應用Illustrator：

為行將導出的圖形元素創立新文檔，應用@1x規格來設置文檔的尺寸。
將須要導出的圖形元素復制到新文檔傍邊。
在“File”菜單當選擇“Save”。
在保留時記得撤消勾選“Preserve Illustrator Editing Capabilities”。

由此導出的PDF是可拉伸的矢量圖形，可以在iOS中被完善的處置為@2x和@3x規格。下一步，我們看看如何在Xcode傍邊停止設置。

第二步：在Xcode項目文件中停止設置

要應用矢量化的圖形資本，你須要在Xcode傍邊經由過程Asset Catalog來治理圖片。不消擔憂，你仍可以將尺度的圖形導入方法與XCAssets混雜起來應用，不會發生成績。履行以下步調：

• 假如還沒有XCAsset文件，那末創立一個。假如曾經創立過，就在項目中翻開。
• 在“Editor”菜單當選擇“New Image Set”。
• 在新創立的圖片集中，選擇空的圖片集，然後翻開Utilities面板。
• 選擇屬性檢討器Attributes Inspector。
• 在類型下拉列表中，選擇“Vectors”。
• 圖片聚會會議變成只要一個拖放點的“All - Universal”。
• 將你的PDF矢量圖形拖放到圖片集傍邊。
  

接上去，你可以像以往一樣應用Image Catalog中的圖形資本，經由過程代碼或Interface Builder都可。例如在代碼中應用“imageNamed:”+圖片集稱號的字符串。

第三步：見證奇異時辰

Xcode在構建項目時會基於Asset Catalog中的PDF矢量圖形主動創立@1x、@2x和@3x三種規格的PNG文件。舉例說，你為Xcode供給了一個@1x規格的，尺寸為150px*150px的PDF文件，那末Xcode會主動創立以下PNG圖形：

@1x規格，尺寸為150px*150px
@2x規格，尺寸為300px*300px
@3x規格，尺寸為450px*450px
運用運轉時，iOS會依據分歧的裝備類型從下面三種圖形資本中遴選出適當的規格停止輸入。別的記得為AutoLayout設置好束縛，確保圖形不會在年夜尺寸裝備上被拉伸。Xcode所做的是基於PDF矢量圖形創立PNG文件；運用運轉時所輸入的依然是柵格化的圖片，而非可以主動伸縮的矢量圖形。

留意

• 矢量圖形的支撐只是階段性的 - 在構建階段，Xcode會基於PDF生成PNG圖片並輸入到界面傍邊。
• 一旦完成矢量圖形的設置，你就沒法為其指定新的輸入尺寸了。假如須要更年夜的規格，則須要創立新的PDF圖形，不然在應用AutoLayout時本來的圖片會掉真。
• 正如後面所說的，iOS 8只能支撐基於PDF生成的PNG文件；但OS X卻可以真正完全的支撐矢量圖形，你可以直接經由過程Auto Layout或代碼來縮放矢量圖形，不會發生任何掉真。
• 這類方法沒法兼容iOS 7之前的體系，由於相干的圖形資本都是經由過程Asset Catalog治理的。
• 假如你曾經應用了相似的劇本或對象來主動生成多種規格的圖形資本，那末這類方法不會給你帶來太多用途。不外，假如你的運用同時具有OS X和iOS兩種版本，而且會用到一些雷同的圖形，那末這類辦法將會是事半功倍的。

轉變矢量圖的色彩

為啥要轉變矢量圖的色彩呢，直接叫設計師切個圖不就好呢。

重要比來呢，設計師回家了，沒方法只要一張圖，我又懶的用ps。

就給本身弄了個課題。

其實也簡略在ps中也不就是選當選區，填充色彩，然後保留。

在iOS也是差不多的。

在iOS也是差不多的。

//UIImage+ImageColor.h
#import <UIKit/UIKit.h>
@interface UIImage (ImageColor)
/**
 *  修正矢量圖色彩
 *
 *  @param      maskColor 修正色彩
 *  @return
 */
- (UIImage *)imageMaskWithColor:(UIColor *)maskColor;
@end
//UIImage+ImageColor.m
#import "UIImage+ImageColor.h"
@implementation UIImage (ImageColor)
- (UIImage *)imageMaskWithColor:(UIColor *)maskColor {
    if (!maskColor) {
        return nil;
    }

    UIImage *newImage = nil;

    CGRect imageRect = (CGRect){CGPointZero,self.size};
    UIGraphicsBeginImageContextWithOptions(imageRect.size, NO, self.scale);

    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextScaleCTM(context, 1.0, -1.0);
    CGContextTranslateCTM(context, 0.0, -(imageRect.size.height));

    CGContextClipToMask(context, imageRect, self.CGImage);//選當選區 獲得不通明區域途徑
    CGContextSetFillColorWithColor(context, maskColor.CGColor);//設置色彩
    CGContextFillRect(context, imageRect);//繪制

    newImage = UIGraphicsGetImageFromCurrentImageContext();//提取圖片

    UIGraphicsEndImageContext();
    return newImage;
}
@end

總結：
設計師能給你切全套那是最好的，本身也省事。
不外嘛，這個是有利益滴，可以節儉app年夜小，可以省去按鈕的高亮、選中等等圖片。

【iOS運用開辟中矢量圖的應用及修正矢量圖色彩的辦法】的相關資料介紹到這裡，希望對您有所幫助！ 提示：不會對讀者因本文所帶來的任何損失負責。如果您支持就請把本站添加至收藏夾哦！