提高Interface Builder高效工作的8个技巧
原文转载自破船之家的博客:http://beyondvincent.com/blog/2014/03/19/18-tips-for-working-effectively-with-interface-builder/
提高Interface Builder高效工作的8个技巧
本文译自:8 Tips for working effectively with Interface Builder(需翻墙)
先来看看目录:
- 介绍
- 使view的Size与view中的Content相适应
- 按住option键—观察所选中view与另外view边缘之间的距离
- Editor –> Embed In View, Unembed:
- 在不影响subview的位置时给view自由的添加padding
- 对不在最前端的view进行移动
- IBOutletCollection排序
- 使用自定义属性
- MoarFonts——字体定制:所见即所得
介绍
在JoyTunes工作期间,我们在开发最新一版的钢琴应用程序,对程序的UI做了大量的重新设计,因而也在Interface Builder上花费了许多时间,对于图片和view的缩放操作,非常的让人不省心。不过在开发过程中,我们发现了许多非常不错的IB使用技巧,我寻思着这必须要跟大家分享,所以成就了这篇文章。
免责声明: 在JoyTune工作期间,我们使用的是.xib文件(不是storyboards),并且没有使用Auto Layout。实际上这主要是历史原因导致的。所以,这里介绍的一些技巧可能稍微有点不同(如果你使用storyboard或Auto Layout),不过大多数都是一样的。
1. 使view的Size与view中的Content相适应
很惭愧的是最近才发现这个功能——能节约大量时间。 选中任意的一个view,然后Editor->Size to Fit Content,或者简单的按 ⌘= 接着就会按照下面的规则对选中view的Size做出与之Content对应的适应。
- ImageView/Button的size会设置为图像的原始size(最常见的用法):
- Label/Button的size会被设置为与当前text内容相当的尺寸:
- parent container view会与其subviews的frames相适应。
2. 按住option键—观察所选中view与另外view边缘之间的距离
按住option键之后,选择一个view,然后将鼠标悬停在别的一些view上,会看到一些距离——选中view与别的view边缘之间的距离。
3. Editor –> Embed In View, Unembed:
你是不是对此素手无策呢:你希望将已有的一些subviews放入到不同的parent view中,甚至是不同的.xib文件中,但是当你把一些view重新设置之后,它们为自动的位于新的parent view中心?
现在好了,我们有一个解决办法,如下图所示:
4. 在不影响subview的位置时给view自由的添加padding
当试图给view添加padding时,默认情况下subview的x和y是不会改变的,但是有时候我们并不希望是这样的结果。我发现一个最好的方法,就是在按住⌘时拖动view的边缘:
5. 对不在最前端的view进行移动
刚开始我还以为要想移动不在最前端的view是不可行的。
有一种方法就是先将非最前端的view临时设置到最前端,移动好位置之后,在设置回去。
另外一种方法就是使用右边panel中的size inspector,不过有时候要想设置一个好的位置,需要不断的猜测和修正。
另外我发现一种方法:使用键盘上的上下左右键来移动view——这还不用把view设置为最前端:
- 在document outline中选中view
- 为了获得view的焦点:单击root view的frame
- 利用箭头进行移动
提醒: 获得view的焦点还有一个更好的方法:在document outline上双击view,就可以用箭头移动view了。
6. IBOutletCollection排序
有时候IBOutletCollection里面元素的顺序对我们来说非常重要:我们希望按某个顺序对其进行迭代。
有一种方法:在代码里面利用x/y/tag对其做排序处理,然后在迭代。
实际上,没必要这么做。IBOutletCollection的顺序取决于我们dragged connection的顺序,可以通过^+单击 File’s Owner来查看当前的顺序:
7. 使用自定义属性
可能这个功能是IB中很少被使用的:使用Identity inspector中的User Defined Runtime Attributes(用户自定义运行时属性)在view上设置自定义属性:
在此我定义了一个JTLabel类,我们可以设置它的stroke color和width,这样一来我们就不用在代码里面设置相关属性了。
利用这个功能很好的一例子就是Canvas,通过它不用写一行代码就能定义相关的动画。
8. MoarFonts——字体定制:所见即所得
在Interface Builder中字体的定制是个非常麻烦的事情。IB并没有内置该功能,我用过比较好的解决办法就是使用自定义属性——就像Canvas一样,或者使用字体替换技术——例如IBCustomFonts。这些都是有效的方案,不过他们有一个致命的缺点——它们不能给我们一种WYSIWYG(所见即所得)的体验,当然,这也是为什么我们会第一时间使用Interface Builder的原因。
为了知道给label设置的自定义字体是否合适,我们必须要运行程序才能知道结果——这有点让人不能接受。
最近我发现了一个新的解决办法:使用MoarFonts。卖价10美元,没有demo,没有试用——不过请相信,这非常值得购买!它的使用方法非常简单:将MoarFonts当做script build phase,然后build app,接着重启Xcode,就可在Interface Builder中看到定制的字体。
打完收工!希望这些技巧对你能有所帮助。
提高Interface Builder高效工作的8个技巧相关推荐
- 【Xamarin挖墙脚系列:代码手写UI,xib和StoryBoard间的博弈,以及Interface Builder的一些小技巧(转)】...
正愁如何选择构建项目中的视图呢,现在官方推荐画板 Storybord...但是好像 xib貌似更胜一筹.以前的老棒子总喜欢装吊,用代码写....用代码堆一个HTML页面不知道你们尝试过没有.等页面做出 ...
- 代码手写UI,xib和StoryBoard间的博弈,以及Interface Builder的一些小技巧
http://www.cocoachina.com/industry/20140102/7640.html 最近接触了几个刚入门的iOS学习者,他们之中存在一个普遍和困惑和疑问,就是应该如何制作 ...
- 高效工作,分享几个实用的小诀窍,很多人已经悄悄用上了
今天给大家聊如何让工作更高效. 培养工作思维,让工作简单高效 好的工作思维,一定程度上能让工作更高效,有利于个人成长.升职.发展和突破瓶颈. 好的工作思维可以让你在职场一路飙升,而不是勤勤恳恳工作多年 ...
- 开工啦!这本书助你快速回归高效工作状态
保罗开车去见潜在客户,他们打算利用午餐时间讨论一下这个项目.餐厅在一个他不怎么熟悉的城区,离家大约 30 分钟的车程.上路后,保罗想到接下来的 30 分钟总算不用应对邮件和电话了,长长地舒了一口气. ...
- Xcode 6 Bug:Interface Builder文件中的未知类
本文翻译自:Xcode 6 Bug: Unknown class in Interface Builder file I upgraded to Xcode 6 beta 4 and now my A ...
- 《iOS 9 开发指南》——第6章,第6.4节 Interface Builder中的故事板——Storyboarding...
本节书摘来自异步社区<iOS 9 开发指南>一书中的第6章,第6.4节 Interface Builder中的故事板--Storyboarding,作者 管蕾,更多章节内容可以访问云栖社区 ...
- Interface Builder nib2objc ibtool
做iphone开发就需要接触其中的xib文件.Interface Builder(IB)是Mac OS X平台下用于设计和测试用户界面(GUI)的应用程序,可以很直观的设计图形界面.实际上Mac OS ...
- Facebook 工程师是如何高效工作的?
编者按:Facebook 的工程师有哪些高效工作的经验呢?软件工程师访谈了多位 Facebook 的高产工程师,总结了他们的共同经验以及晋级之路,供各位参考. 成为高效开发者这件事你可以通过经验.书本 ...
- 分享几个亲测有效的高效工作技巧
这里是Z哥的个人公众号 每周五11:45 按时送达 当然了,也会时不时加个餐- 我的第「154」篇原创敬上 大家好,我是Z哥. 在工作中,你会发现有的小伙伴每天看上去很忙,但是好像产出的成果比旁边看上 ...
- 【2018新年巨献】像阿里巴巴一样高效工作!(含视频、文章、PDF文件)
摘要: Work Like Alibaba 通过线下沙龙.线上直播.内容输出三个维度,携手阿里云的典型企业用户,联合云栖社区.阿里云.钉钉阿里产品,将阿里的前沿产品技术理念.敏捷研发模式.智能运维方法 ...
最新文章
- tag标签[置顶] 高级NFC
- javah生成JNI头文件
- 笔记本的处理器型号怎么区别好坏
- python贪婪与非贪婪_python 贪婪 非贪婪 匹配
- 在html中引入css内部样式表使用,CSS样式学习笔记(三)html文件引入CSS的方法(2)...
- hibernate基础之无法自动创建表总结
- c语言 函数的参数传递示例_llround()函数以及C ++中的示例
- 一大波程序员血赚到腰疼...
- practical of programming 第二章 java的quick sort
- ORL人脸识别tensorflow实现
- 微信测试号实现微信网页的分享
- 企业邮箱怎么发邮件?企业邮箱无法收发信是怎么回事?
- photoshop 抠图
- SPSS Modeler泰坦尼克号幸存者分析
- 小叶入门之Python爬虫(一)
- xXx时间屏保+背景图片
- 第四章web服务器之httpd
- 图像处理:均值滤波算法
- 基于AD9850的多功能信号发生器
- C语言——蔡勒(Zeller)公式:快速将任意日期转换为星期数