码迷,mamicode.com
首页 > 其他好文 > 详细

第04章 更丰富的用户界面

时间:2014-12-20 14:07:45      阅读:216      评论:0      收藏:0      [点我收藏+]

标签:

控件

用户界面控件共有三种基本模式:
活动:比如按钮,点击会触发方法
静态:比如静态文本,只用作显示
被动:比如文本输入,不会触发任何方法,但是用户可以与之交互,并修改它的值。
 
?
在ios上,大多数控件都可以通过以上三种模式使用,并且几乎所有的控件都支持一种以上的模式。
 
所有ios控件,都是UIControl子类, 因此他们能够触发动作方法。
Inherits from
UIView : UIResponder : NSObject
UIImageView 图像视图
选中后,Editor->Size to Fit Content  使其大小与图片大小相同。
 
 
约束
蓝色实线代表拖动后,创建的约束。
分别表示距离顶部某个距离,处于水平居中的位置
option+选中控件,可以查看其位置尺寸信息。
技术分享
 
 
 
属性检查器
上部分为选中控件的属性
下部分为其基类的属性
技术分享
 
Mode属性:内容在视图内的显示方式
Tag属性:可用此值,在代码中,获取到此控件对象
Interaction属性:是否能与用户交互,是否支持多点触控
Alpha属性:透明度,0为完全透明,1为完全不透明
Background属性:背景颜色
Drawing复选框:
     Opaque:不透明的,即不必在此控件视图背后显示任何东西,可加速显示。
     Hidde:是否隐藏
     Clear Graphics Context :先刷屏再绘制
     Clip Subviews:如果视图包含子视图,此选项意思是,绘制其子视图时,进行裁剪。
     Autosize Subviews:当视图大小变化时,自动调整其子视图大小
Streching属性:控制拉伸的一些参数
 
 
 
UILabel 标签
选中多个标签,Editor->Pin->Widths Equally 建立多个控件的宽度相等约束
 
UITextField 文本输入,属性比较多
技术分享
 
Text属性: 纯文本或属性文本
Color:颜色
Font:字体
Alignment:对齐方式
Placeholder:占位符,文本输入前的灰色提示语
Background:背景图片
Disable:禁用的背景图片
BorderStyle:外框样式
Clear Button:文本输入时的清楚按钮(文本右侧的xx),这里可以设置何时出现此按钮。
Clear when editing begins:输入开始时,清除已有的文本
Min Font Size:显示的最小文本字号
Adjust to Fit:指定显示文本,是否随文本字段尺寸的减小而减小。
                       如果选中,那么整个文本在视图中都是可见的,即使文本大于所分配的空间。
 
键盘相关:
Capitalization: 首字母大小
Correction: 自动矫错
Keyboard: 键盘类型
Appearance:
Return Key: 返回键名字
以上控制输入此字段时,键盘的外观和行为。
 
Auto enable Return key:如果勾选,那么当输入为空时,return key不可用,除非用户有输入。
 
Secure:类似显示密码
 
 
输入完成后关闭键盘
当用户输入完成,点击键盘上的return键,此时会触发一个Did End On Exit事件
实现textfield的此事件响应即可。

- (IBAction)doneEditing:(UITextField *)sender

{

    [sender resignFirstResponder];

}

问题来了,对于数字键盘等,没有return的键盘,如何处理?

常用方法:通过触摸背景,来关闭键盘

需要做以上工作:

1.将controller的view类型,改为UIControl,因为只有UIControl类型,才能触发动作方法。

2.关联动作方法

技术分享

技术分享

 

 
UISlider滑块控件
 
技术分享
 
最小值,最大值,初始值
最小值图片,最大值图片
Update Envents  Continuous:滑块值改变时,触发一系列连续事件
 
 
批量添加顶部约束:
选中所有控件,Editor->Pin->Top Space to Super View
 
滑块滑动后,通过action方法更新label值

- (IBAction)valueChanged:(UISlider*)sender

{

    self.sliderNumber.text = [NSString stringWithFormat:@"%d", (int)sender.value];

 

}

 

技术分享

 

 

 

UISegmentedControl 分段控件

通过selectedSegmentIndex属性,获取哪段被选中了

技术分享
 
momentary 瞬间的 设置在点击后是否恢复原样 
tint 色彩
 

- (IBAction)segmentChanged:(UISegmentedControl*)sender

{

    if (sender.selectedSegmentIndex == 0) {

        self.leftSwitch.hidden = NO;

        self.rightSwitch.hidden = NO;

        self.button.hidden = YES;

    }else if(sender.selectedSegmentIndex == 1){

        self.leftSwitch.hidden = YES;

        self.rightSwitch.hidden = YES;

        self.button.hidden = NO;

    }

}

 
 
 
UISwitch 开关
 
技术分享
 

- (IBAction)switchChanged:(UISwitch *)sender

{

    BOOL bIsOn = sender.isOn;

    [self.leftSwitch setOn:bIsOn animated:YES];

    [self.rightSwitch setOn:bIsOn animated:YES];

 

}

 

UIButton
技术分享
 
 
 UIImageView
 UITextField 
 UILabel
 UISlider
 UISegmentedControl
 UISwitch
 UIButton
 
操作表单 action sheet

UIActionSheet

操作表单的作用是要求用户在两个以上的选项之间做出选择。用户必须点击其中一个,才能继续使用app。
操作表单通常用于确认可能有危险的或者不可逆的操作,比如删除对象。
 
警告视图 alert
UIAlertView
警告视图以蓝色的矩形框在屏幕中央显示,与操作表单一样,也必须有个选择,才能继续使用app。
警告通常用于通知用户发生了一些重要的或者不寻常的事情,可以只显示一个按钮。
 
以上两种,都为模态视图,modal view,要求做出选择,才能继续。
 
操作表单和警告视图都使用了委托,所以他们知道,在用户做出选择之后,应该通知哪个对象。
 
.h .m来回切换快捷方式 conmand+control +上下箭头键
 
操作表单委托 UIActionSheetDelegate
 

    UIActionSheet *sheet = [[UIActionSheet alloc]

                           initWithTitle:@"Are you sure?"

                           delegate:self

                           cancelButtonTitle:@"No Way!"

                           destructiveButtonTitle:@"Yes, I‘m sure"

                           otherButtonTitles:@"Let me think", nil];

    [sheet showInView:self.view];

 
技术分享
 
 
委托方法

- (void)actionSheet:(UIActionSheet *)actionSheet

didDismissWithButtonIndex:(NSInteger)buttonIndex

用户选择后,会进入此委托方法

 
 
警告视图委托 UIAlertViewDelegate
 

UIAlertView *alert = [[UIAlertView alloc]initWithTitle:@"Title"

                                               message:@"message"

                                              delegate:self

                                     cancelButtonTitle:@"cancle"

                                     otherButtonTitles:@"other", nil];

 

技术分享

 

同样,如果想在用户点击警告视图后,通知委托对象,实现其委托方法即可。

 
 
为button添加图像
1.如果想要修改xib文件中创建的对象,可以覆盖controller父类的viewDidLoad方法,用代码的方式修改。
   IB中,并不一定能完成所有的工作。
 
控件状态:每个ios控件都有如下4种状态,任何时候,都处于并只能处于一种状态
1.普通(UIControlStateNormal):普通状态
2.突出显示(UIControlHighlighted):控件正在被使用的状态,比如button被按下
3.禁用(UIControlStateDisabled):可在IB种,设置Enable为NO
4.选中(UIControlStateSelected):只有一部分支持选中,而且控件被选中后,当用户不直接参与时,状态可继续保持。
 
某些ios控件的属性,可以在不同的状态下,接受不同的值。
比如button,在UIControlStateNormal状态下,设置一种图像,在UIControlHighlighted下设置另一种图像。
 
可拉伸图像:
技术分享

定义图像边缘范围内的像素,不被拉伸。

 

技术分享比如此图像,附着在技术分享这么长的button上,将会被左右拉伸

 

此时定义边缘图像为(0,12,0,12)即左边,右边12个像素范围的图像不被拉伸,即图像边缘的灰色边框,如果拉伸就很丑了

 

第04章 更丰富的用户界面

标签:

原文地址:http://www.cnblogs.com/wildathearthy/p/4175297.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!