UIKit User Interface Catalog(about Views)

UIKit User Interface Catalog(about Views)

果果官方文档就是辣么帅气

我的总结

1.如果要创建自己的接口的view的话,是由闭包创建的。尽量使用更多的view去修正各个元件的距离。如果要创建一个view连接着一个view的结构的话,你最好有属于你自己的view的分层结构

Alt text
Alt text

2.目的:view允许开发者们去

(1)检验app的上下文
(2)在app进行导航

3.执行:view执行的是UIview这个类

4.配置:配置views在Interface Builder里,在在view段的Atrributes Inspector里。少量配置可以直接通过Atrributes Inspector,但是如果你想要创建你自己的特殊的view的话,用代码搞定

Alt text
Alt text

5.视图内容

所有的view都是基类UIKit的子类,UIkit包括图片,文档以及其他格式。如果预定义的view没有你想要的,你可以自己创建属于你自己的views并且手动管理和绘制。
使用Mode可以控制你当前视图的大小。
tag是一个整数用来识别在你的app里的view


Alt text
Alt text

6.视图行为

默认激活交互(the User Interaction Enabled )checkbox如果被选择了,意味着一些使用事件被正常提供,例如触摸和键盘。当默认激活交互(the User Interaction Enabled )不被选择,则在view上的事件将被忽略并且移除事件队列。
多点触控的checkbox默认是不被选择的,意味着该view只能接受第一次触摸事件在多点触控的序列里。当被选择的时候,这个视图接受所有的接触在多点触控的序列里。

Alt text
Alt text

view有一系列属性关于绘图行为

Alt text
Alt text
  • Opaque如果被选择的话,则意味着完全不透明(这个意味着允许drawing system去优化性能)如果没有选择的话,系统将联合上下文去分析如何处理此事件

  • 如果Hidden被选择了,该视图将从window消失并且不接受输入的额任何事件

  • 当Clears Graphics Contex被选择的时候,drawing 缓冲区将在view被绘制的时候清楚所有的transparent black。这个行为确保不会留下任何重绘之前的痕迹

  • 选择Clip Subview会让子类的边框适合于view,如果不被选择的话,子类的框架可能会超过可见的view的边界

  • 当Autoresize Subviews被选择的话,view会自动调整子类的大小

7.视图外观

背景颜色和透明度

透明度(alpha)可以改变整个view的透明度。这个值从0.0到1.0,0.0为透明,1.0为不透明,设置这个值对于嵌入的子视图并没有作用

Alt text
Alt text

使用背景颜色选择一个颜色填满整个view。这个背景颜色在其他在这个view的最底层
外观代理
你可以使用外观代理去设置特别的外观属性在你的应用的所有实例view中。例如,如果你想要你所有的在你的app中的slider有一个在最小值的颜色,你可以使用在slider外观代理的一个消息去指定这个。
这里有两种方式去定制对象的外观:对于所有的实例和包含实例的容器类。

定制一个类的所有实例,使用appearance去得到这个类的外观实例
[[UISlider appearance] setMinimumTrackTintColor:[UIColor greenColor]];
定制一个外观嘞的实例,当这个类包含在一个容器类里,或者实例在分层结构中,你可以使用appearanceWhenContainedIn:去得到外观代理在这个类里。
[[UISlider appearanceWhenContainedIn:[UIView class], nil]
setMinimumTrackTintColor:[UIColor greenColor]];

8.Tint Color

view有一个tintcolor的属性在view里的指定颜色的元件里。每一个UIview的子类定义了一个自己的对于tintColor的外观和行为。例如,这个属性决定了outline,divider,和icons在stepper的颜色

[站外图片上传中……(7)]

这个tintColor属性是一个快速并且简单的方式去作为你的app所使用的颜色。设置一个tintcolor在一个view里可以自动的为它所有的子类也设置。然而,你可以手动重载这个属性对于任何特闷的子视图或者是子视图的子视图等。换句话说,每一个view遗传它的父视图,除非父视图为空。如果对于最高级别的view在view的分层结构tintColor是空值,则默认为系统的蓝色。

9.模板图片

在ios7里,你可以选择任意的图片在你的app中作为模板或者模板图片。当你挑选一张图片作为模板的时候,系统会忽略照片的颜色信息并且创建一张照片末班基于alpha值的,这儿末班可以用tintColor重置颜色去匹配剩余的用户接口。

对于默认的,image用UIImageRenderingModeAutomatic.来创建。如果你用UIImageRenderingModeAutomatic来创建图片。它将被作为模板对待或者默认的基于它的上下文来对待。对于某一个UIKit元件,包括navigation bars, tab bars, toolbars, segmented controls,自动的将其前端照片作为模板,尽管他们的背景图片作为原始的来对待其他的元件,例如image views 和web views 。将他们的照片当做原始来对待。如果你想要你的照片一致被当做模板对待不管上下文,则设置UIImageRenderingModeAlwaysTemplate;如果你想要你的照片并且一直被作为原始照片来对待则用UIImageRenderingModeAlwaysOriginal。
指定一张照片的表演模式,首先创建一张标准的照片,然后使用imageWithRenderingMode: 方法在照片中

   UIImage *myImage = [UIImage imageNamed:@"myImageFile.png"];
   myImage = [myImage imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];

10.使用自动布局在view里

自动不育允许你去定义布局的约束对于用户界面接口元件,例如view和control。约束代表用户界面元件之间的关系。你可以创建自动布局约束选择合适的元件或者是一组元件在Interface Builder的右下角。
自动布局约束包含两个系统参数的菜单:pin和align。pin菜单允许你去指定约束去定义一些基于特别的值或者一定范围的值的关系,一些支持去控制它自己(例如宽度和高度)还有一些则只是定义在元件之间的关系(例如水平间隔)。接下来的表描述了完成每组自动布局约束的参数。
<table>
<tr>
<td>约束名字</td>
<td>目的</td>
</tr>
<tr>
<td>[站外图片上传中……(8)]</td>
<td>设置单个元件的宽和高</td>
</tr>
<tr>
<td>[站外图片上传中……(9)]</td>
<td>设置两个准确的元件之间的水平间隔或垂直间隔</td>
</tr>
<tr><td>[站外图片上传中……(10)]</td><td>设置来一个或者更多个元件的左,右,上,下的对于俯视图的间隔</td>
</tr>
<tr><td>[站外图片上传中……(11)]</td><td>设置两个或者更多个元件跟彼此相同的宽度或者高度</td></tr>

<tr><td>[站外图片上传中……(12)]</td><td>排列左,右,上,下对于两个或者更多个的边界</td></tr>

<tr><td>[站外图片上传中……(13)]</td><td>排列两个或者更多个元件更具他们的水平中心,垂直中心或者底部的基线。记得基线是不同于底部的边界的。这些值可能对于某些元件并没有定义</td></tr>
<tr><td>[站外图片上传中……(14)]</td><td>排列水平中心或者垂直中心对于一个或者更多的元件在他们的容器里(父视图)</td></tr>
</table>
这个“Constant”值是指定的对于一些Pin约束(除了Widths/Heights Equally)是一些关系的一部分。那是,你可以指定你想要的等于,小于,小于等于或者大于那个值。
[站外图片上传中……(15)]对于更多的记得看果果的官方文档嘞。

11制作容易获取的view

提高对于一个项目的易接近的信息,选择在故事版的对象或者打开一个检查身份的易接近段。(accessibility information我不会翻译嘞)
对于更多信息,看果果。

12.调试视图

当view出现问题的时候,看大众的易犯错误。
设置矛盾的不透明的设置的时候,如果你的视图的alpha值小于1.你不应该设置opaque属性为yes。

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

推荐阅读更多精彩内容