[iOS] 试一发 Xcode6 中的矢量图

Xcode6中有一个十分方便的功能,就是导入的图片资源支持矢量图格式。这对于开发者来说无疑是个天大的好消息。

不过,这矢量图怎么搞?有什么好处?效果到底如何?不妨打开 Xcode6 来一发试试看,亲自体验一下矢量图的魅力。

我们先用Sketch制作了一个30*30的图标,导出了pdf和png格式:

然后在Xcode6的 Images.xcassets中添加两个图标。首先是矢量图版本的:

接下来是PNG版本的,我们只上传了@1x 版本的位图:

然后我们找一个页面,同时放上两个图片进行比较。

第一次实验:长宽均为100,即非等比拉伸:

可以看到@1x的图因为没有做@2x和@3x 版本,细节处有很多模糊的情况。

第二次试验:长宽均为240,等比显示:

差距是比较明显的。

Xcode6在使用矢量图的时候,会生成对应的@1x、@2x、@3x版本的位图,相当于帮我们做了适配的工作。比如30*30的矢量图导入,运行时会生成下面三个尺寸的位图:

@1x = 30*30

@2x = 60*60

@3x = 90*90

嗯大概就是这样。所以个人开发者们可以尝试一下用矢量图减少自己的工作量。公司里就算了,让美工们忙碌起来吧!

时间: 2024-10-11 01:10:44

[iOS] 试一发 Xcode6 中的矢量图的相关文章

在xcode6中使用矢量图(iPhone6置配UI)

ios应用程序是一个图像主导的产品.在开发一个应用程序时,你需要各种尺寸的图标,你需要为每个图像文件制作一个@1x尺寸和一个@2x尺寸.这样你的应用看上去才足够精美.但缺点是你必须单独生成这些文件.随着iphone6和iphone6 Plus的到来,这个问题变得更加让人头疼:@3x 资源. 幸运的是,苹果在xcode6中提供了一些伟大的工具来管理这些资源.更好的是,这种方式也让你的应用程序能够运行在未来的ios设备上打下了基础.工具之一是xcode6和ios8支持以Storyboard(或xib

在 Xcode 6 中使用矢量图( iPhone 6 置配 UI)

在 Xcode 6 中使用矢量图( iPhone 6 置配 UI) (本文转载:http://iosdeveloper.diandian.com/post/2014-09-25/40063062789) iOS应用程序是一个图像主导的产品.在开发一个应用程序时,你需要各种尺寸的图标,你需要为每个图像文件制作一个@1x 尺寸和一个@2x尺寸.这样你的应用看上去才足够精美.但缺点是你必须单独生成这些文件.随着iPhone6和iPhone6 Plus的到来,这个问题变得更加让人头疼:@3x 资源. 幸

vue中使用矢量图

1.打开矢量图库,将需要的图表添加至购物车 2.将购物车的图标添加到一个项目中(便于后期增加更新)并下载至本地 3.将这四个文件及iconfont.css添加至项目的assets中 4.打开iconfont.css正确引入上边的四个文件 @font-face { font-family: "iconfont"; src: url('../style/iconfont.eot?t=1548125082389'); /* IE9 */ src: url('../style/iconfont

Android UI:矢量图使用

一.矢量图简介最近在进行Android App"瘦身 "的时候,了解到矢量图(VectorDrawable)相关概念.从Android5.0(API level 21)开始,有两个类支持矢量图:VectorDrawable和AnimatedVectorDrawable.VectorDrawable是一个矢量图,定义在一个XML文件中的点.线和曲线,和它们相关颜色的信息集合.AnimatedVectorDrawable是矢量图动画,使用多个XML文件而不是针对不同分辨率使用多个图片来实现

Xcode项目中使用PDF 格式的矢量图作为图片资源

从xcode6开始, Xcode项目中可使用PDF 格式的矢量图(1X)作为图片资源. Xcode 会自动使用矢量图等比适配,而不需要再导入 @2x.@3x 多张切图.这样不仅省去了PNG图片还减少了图片资源众多管理,命名的麻烦. 使用方法: 把PDF格式的矢量图形添加到Xcode的素材管理分类 - Asset Catalog里, 调用图片集合名字即可 1.在Xcode里打开Images.xcassets. 2.创建一个新的图片集合 - New Image Set. 3.在属性检查器 - Att

iOS 中使用.9图

背景 .9图来源于Android.为了设计出一套图,兼容Android和iOS,使用.9图的方式来对图片进行拉伸以适应不同的屏幕.在iOS中没有.9图的概念,只能先了解Android的.9图再进行模拟Android的方法. 什么是.9图片 即图片后缀名前有.9的图片,如pic.9.png.pic1.9.jgp,诸如此类的图片就称为.9图片.且在原始图片四周添加了一个像素,在这一个像素上用黑线标识出相关的区域. .9图片的作用 .9图片的作用是在图片拉伸的时候特定的区域不会发生图片失真,特定的区域

【iOS】在页面中展示gif动图

1 - (void)viewDidLoad 2 { 3 [super viewDidLoad]; 4 // Do any additional setup after loading the view. 5 6 //1:使用第三方库 7 NSData *data = [NSData dataWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"moe" ofType:@"gif"]]; 8 GifVi

ps中的位图,矢量图,颜色模式

什么是位图?什么是矢量图? 位图是由像素组成的图像,在缩放和旋转的时候容易失真,同时文件容量较大 矢量图是根据几何特性来绘制的图形,通过数学公式计算获得的,不易制作色彩变化太多的图象 颜色模式 RGB模式.CMYK模式.HSB模式.Lab颜色模式.位图模式.灰度模式 1:RGB模式 是Photoshop中最常用的模式,也被称之为真彩色模式,主要是由R(红).G(绿).B(蓝)3种基本色相加进行配色,并组成了红.绿.蓝3种颜色通道,每个颜色通道包含了8位颜色信息,每一个信息是用0~255的亮度值来

csv读入数据,用julia/matplotlib/pyplot 画矢量图导入word中

这是是用julia来实现画图.julia有三个画图库:Winston.Gadfly.PyPlot 这里用的是pyplot,事实上他是基于matplotlib的 1.首先在juno里安装两个库 juno是julia的集成开放环境(IDE) 没有安装juno的请看这里:http://blog.csdn.net/fuzimango/article/details/47721055 在juno中安装这两个库:直接ctrl+Enter执行就成了 Pkg.add("DataFrames")#表格库