Asset Catalog 的理解与使用

Asset Catalog 的理解与使用

asset catalog 是 iOS app 开发必不可少的组成部分。我们一般将图片存放其中,但殊不知,其用途远不止于此。

图1


概述

资源目录(asset catalog)是 Xcode 提供的项目资源管理工具,其核心理念在于:以设备特征(traits)为单位配置资源,包括但不限于图片,颜色,材质,数据。既让开发者免于代码配置资源的烦恼,也让苹果能够更好的控制 .ipa 包。例如,苹果在 iOS 9 支持 on-demand resourceslicing,前者意味着将资源和二进制代码彻底分离;后者以根据具体设备打包资源和二进制代码,减少 .ipa 体积。

资源集(asset set)是聚合资源(asset)的基本单位,一个或多个资源构成一个资源集。资源集分为若干类型,取决于资源的具体类型(asset types)。此外还可以建立子文件夹,进一步聚合资源集。

asset catalog 本质是一个文件目录。经测试,无论使用几个资源目录,打包后总以单个 Asset.car 文件的形式存在。通过命令 xcrun --sdk iphoneos assetutil --info Assets.car 进行验证,获取目录内所有资源集信息,例如:

xcrun --sdk iphoneos assetutil --info Assets.car
[
  {
    "AssetStorageVersion" : "IBCocoaTouchImageCatalogTool-9.4.1",
    "Authoring Tool" : "@(#)PROGRAM:CoreThemeDefinition  PROJECT:CoreThemeDefinition-339.7\n",
    "CoreUIVersion" : 493,
    "DumpToolVersion" : 493.39999999999998,
    "Key Format" : [
      "kCRThemeScaleName",
      "kCRThemeIdiomName",
      "kCRThemeSubtypeName",
      "kCRThemeDeploymentTargetName",
      "kCRThemeGraphicsClassName",
      "kCRThemeMemoryClassName",
      "kCRThemeDisplayGamutName",
      "kCRThemeDirectionName",
      "kCRThemeSizeClassHorizontalName",
      "kCRThemeSizeClassVerticalName",
      "kCRThemeIdentifierName",
      "kCRThemeElementName",
      "kCRThemePartName",
      "kCRThemeStateName",
      "kCRThemeValueName",
      "kCRThemeDimension1Name",
      "kCRThemeDimension2Name"
    ],
    "MainVersion" : "@(#)PROGRAM:CoreUI  PROJECT:CoreUI-493.4\n",
    "Platform" : "ios",
    "PlatformVersion" : "10.0",
    "SchemaVersion" : 2,
    "StorageVersion" : 14,
    "ThinningParameters" : "optimized <idiom 1> <subtype 569> <scale 2> <gamut 1> <graphics 4> <graphicsfallback (3,2,1,0)> <memory 2> <deployment *> <hostedIdioms (4,5)>"
  },
  {
    "AssetType" : "Data",
    "Compression" : "uncompressed",
    "Data Length" : 27,
    "Idiom" : "universal",
    "Name" : "sample-data",
    "Scale" : 1,
    "SizeOnDisk" : 251,
    "UTI" : "UTI-Unknown"
  },
  {
    "AssetType" : "MultiSized Image",
    "Idiom" : "phone",
    "Name" : "AppIcon",
    "Scale" : 1,
    "Sizes" : [
      "20x20 index:0 idiom:phone",
      "29x29 index:1 idiom:phone",
      "40x40 index:2 idiom:phone",
      "57x57 index:4 idiom:phone",
      "60x60 index:5 idiom:phone"
    ]
  },
  {
    "AssetType" : "Image",
    "BitsPerComponent" : 8,
    "ColorModel" : "RGB",
    "Encoding" : "JPEG",
    "Idiom" : "universal",
    "Image Type" : "kCoreThemeOnePartScale",
    "Name" : "Bonsai",
    "Opaque" : true,
    "PixelHeight" : 1024,
    "PixelWidth" : 1024,
    "RenditionName" : "Bonsai.jpg",
    "Scale" : 3,
    "SizeOnDisk" : 330548
  }
]

使用

App Icon

iOS 项目创建时附带一个名为 Assets.xcassets 的资源目录,包含一个名为 AppIcon 的空资源集,类型为 iOS App Icon

图3

显然,这个类型的资源集是用来管理 app 图标的。首先,打开右侧的 attribute inspector 查看当前配置:本资源集适用于 iPhone 和 iPad 设备。

中间区域罗列了所需资源,每个插槽代表一个,需要手动拖入,下方文字说明用途。例如,iPhone Notificaiton 指通知栏的 app 图标;iPhone App iOS 7-11 60pt 表示需要大小为60pt的图标,以便在用户桌面显示 app。

Launch Image

苹果推荐使用 .xib 制作启动界面,但同时仍允许我们静态图片。首先建立类型为 iOS Launch Image 的资源集;然后从设备类型,iOS版本等方面配置;最后填满所有插槽。

图添加launchimage

从上图不难看出,这组启动图支持 iOS 7.0 及以后的竖屏 iPhone 设备。

Image
图imageassetset

图片素材管理是我们最常用的功能。将一个或一组图片拖入 asset catalog,Xcode 会根据名称创建资源集。查看右侧配置面板,有许多选项,每组选项代表一个设备特征。通过这种方式,达到因材施教的目的。

这里着重讲一下 Slicing,即图片切分。asset catalog 允许我们通过所见即所得的方式切分图片,无需编写代码。具体操作如下:

  1. 选中一个图片素材资源集,点击中央区域最下方的 Show Slicing;
  2. 点击图片上的 Start Slicing,开始切分操作;
  3. 切分方式有三种:水平切分(horizontal),垂直切分(vertical),水平 + 垂直;
  4. 以水平切分为例,一开始有三条竖线,将整个图片分为四部分,从左到右依次为:
    • 左1:左端点(end cap),水平方向保持不变;
    • 左2:水平形变区域;
    • 左3:水平固定区域;
    • 左4:右端点(end cap),水平方向保持不变;
  5. 调整三条线的位置,确定各区域的大小。

此外,还可以在配置面板选择具体形变方式:拉伸 / 平铺。

data

二进制数据作为资源的一种,也可以通过 asset catalog 管理!通过配置面板中的 memory 一栏,根据设备内存使用不同数据。

图dataset

参考

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 157,298评论 4 360
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 66,701评论 1 290
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 107,078评论 0 237
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,687评论 0 202
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,018评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,410评论 1 211
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,729评论 2 310
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,412评论 0 194
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,124评论 1 239
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,379评论 2 242
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,903评论 1 257
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,268评论 2 251
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,894评论 3 233
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,014评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,770评论 0 192
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,435评论 2 269
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,312评论 2 260

推荐阅读更多精彩内容

  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    X先生_未知数的X阅读 15,934评论 3 118
  • 大学毕业时,一文友炫耀她去南方: 温柔最是江南,丝雨绸伞,曳长裙,遍访杏花小巷。 我的应答是: 豪情还来塞北,草原...
    宁长弓阅读 265评论 1 2
  • 生活中 我最喜欢低调做人 我觉得这是做人 的最佳状态 不管你多大官 不论你多有钱 不管你多阔气 你都不要趾高气昂 ...
    旖旎i阅读 783评论 8 18
  • 小的时候和妈妈上街,哪怕是邻居老奶奶递过来的一颗自家种的桃子,都要妈妈首肯;背弟子规第一句话就是人之初,性本善;再...
    岳家小姐阅读 585评论 0 0
  • 如果 你我的视线重叠为一点 你 是否会被热火灼伤 一种接近的渴望蛰居 在你和她牵手的背影后 被你水纹般的铃声惊醒 ...
    xuan许阅读 90评论 0 2