iOS在Assets.xcassets中提供的便捷功能

咱們經常利用Assets.xcassets來管理項目中用到的icon和各類圖片素材, 但其除了提供爲不一樣設備和Size Classes添加不一樣的圖片這種基礎使用方式之外, 還提供了一些很是便捷的小功能, 下面咱們將簡單介紹一下

在Assets.xcassets中使用矢量圖

咱們在進行應用程序開發過程當中, 經常會在項目中放置大量的圖片素材, 且每一張圖片都須要準備@1x、@2x和@3x三種以便在不一樣的設備中使用. 而且最可怕的是如今iOS設備的PPI有逐年增大的趨勢, 將來極可能會有@4x和@5x等等, 這對設計人員和開發人員維護圖片素材都帶來了不小的麻煩

蘋果在Xcode6中便容許咱們在項目中使用矢量圖來代替傳統的位圖, 該種方式在iOS平臺上實際上只是一個障眼法, Xcode只是在編譯的時候根據矢量圖來自動生成對應的@1x、@2x和@3x格式的位圖. 雖然不夠完美, 可是也足以讓咱們省去不少維護不一樣格式圖片素材的麻煩. 其使用方式以下:

1. 經過AI和Sketch等設計工具將矢量圖輸出成一個PDF文件
2. 在Images.xcassets / Assets.xcassets中新建一個Image Set
   1. 若是是在Xcode6中, 在Attributes Inspector中將Types改成Vectors
   2. 若是是在Xcode6.3中, 在Attributes Inspector中將Scale Factor改成Single Vector
   3. 若是是在Xcode8中, 在Attributes Inspector中將Scales改成Single Scale
3. 將PDF文件添加到Image Set中

自此, 當編譯時會根據PDF文件自動生成對應的@1x、@2x和@3x格式的PNG文件

在Xcode9中, 該功能獲得再次加強, 咱們能夠在Attributes Inspector中將Preserve Vector Data選項勾選. 此時在編譯時會將PDF文件拷貝到二進制文件中, 以便咱們能夠在運行時任意縮放圖片而不會失真

注: 對於iOS10及如下系統, 仍然會生成對應的@1x、@2x和@3x格式的PNG文件, 此時沒法保證在運行時任意縮放圖片而不會失真

在使用該圖片時, 咱們讓像平時同樣使用便可, 好比在IB中直接選取圖片名稱, 或在Code中直接設置

UIImageView *imageView = [[UIImageView alloc] init];
imageView.image = [UIImage imageNamed:@"Main_button"];
複製代碼

在Assets.xcassets中添加顏色

咱們在進行應用程序開發過程當中, 經常會專門定義一個類用於定義整個應用程序都須要使用到的顏色, 而在IB中卻沒法使用統必定義好的顏色

蘋果在Xcode9中便容許咱們在Assets.xcassets中添加顏色. 其使用方式以下:

1. 在Assets.xcassets中新建一個Image Color Set
2. 在Attributes Inspector中爲顏色設置名字和色值

注: 能夠新建一個Colors.xcassets文件單獨用於添加顏色

在使用該顏色時, 咱們能夠在Code中使用iOS11新加入的API, 或者讓像平時同樣在IB中直接選取顏色名稱

UIColor *color = [UIColor colorNamed:@"TitleColor"];
複製代碼

在Assets.xcassets中拉伸圖片

咱們在進行應用程序開發過程當中, 經常會遇到須要拉伸圖片的需求, 平時咱們都會使用UIImage的以下方法生成一張拉伸後的圖片

// 若是拉伸區域爲1*1區域, 則採用拉伸模式, 此時性能最高
// 若是拉伸區域大於1*1區域, 且capInsets爲UIEdgeInsetsZero, 則採用平鋪模式, 此時性能略差
// 若是拉伸區域大於1*1區域, 且capInsets不爲UIEdgeInsetsZero, 則採用平鋪模式, 此時性能最差
- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets NS_AVAILABLE_IOS(5_0);
// 指定拉伸模式
- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets resizingMode:(UIImageResizingMode)resizingMode NS_AVAILABLE_IOS(6_0);
複製代碼

其實, 在Assets.xcassets中能夠直接對圖片進行拉伸操做

咱們能夠經過點擊Show Slicing經過拖拽的方式肯定capInsets的值

也能夠直接在Attributes Inspector中設置capInsets的值

在Assets.xcassets中渲染圖片

咱們在進行應用程序開發過程當中, 經常被系統強制將圖片進行渲染, 通常咱們都會使用UIImage的以下方法生成一張指定渲染模式的圖片

// UIImageRenderingModeAlwaysOriginal是按照原圖渲染
// UIImageRenderingModeAlwaysTemplate是按照模板渲染
// 默認渲染模式爲UIImageRenderingModeAutomatic, 基於上下文決定具體的渲染模式. 若是是在navigation bars, tab bars, toolbars, 和segmented controls中則爲Template, 其他上下文則爲Original
- (UIImage *)imageWithRenderingMode:(UIImageRenderingMode)renderingMode NS_AVAILABLE_IOS(7_0);
複製代碼

其實, 在Assets.xcassets中能夠直接設置圖片的渲染模式