iOS基本UI元素示例教程
在本教程中,我们将讨论和实现基本的UI元素,例如文本字段,标签和按钮。
说明
我们在第一个教程本身中已经看到过,标签用于显示静态内容。
TextField是允许用户输入的UI元素。
按钮用于处理用户操作。
我们在第一个教程的基本级别上实现了按钮和标签。
让我们看一下UITextField。
iOS UITextField
UITextField支持使用委托对象来处理与编辑相关的事件处理。
当发生某些动作时,UITextField将调用委托方法,以允许对其行为进行自定义和控制。
为此,我们需要添加UITextFieldDelegate协议。
一些委托方法包括:
-(void)textFieldDidBeginEditing:(UITextField *)textField
-(void)textFieldDidEndEditing:(UITextField *)textField
我们可以从属性检查器中自定义UITextField,如下图所示。
占位符属性需要提示文本作为输入。
编辑时将"清除按钮"属性设置为"出现"。
单击文本字段右侧的按钮时,它将删除TexField中的所有字符。
键盘类型可以从下拉菜单中选择。
这些属性也可以通过编程设置。
我们也将以编程方式添加UITextField。
实作
我们将在ViewController上添加一个Label,Button和TextField。
将TextField拖到ViewController停靠文件的所有者按钮。
并选择代表。
打开助手编辑器,并将三个出口拖到头文件中并相应地命名。
您的屏幕应如下图所示。
Main.storyboard
ViewController应该看起来像下面给出的那样
您看到的红线是屏幕上UI元素之间的边距。
可以通过按住控制按钮并将线从一个UI元素拖到另一个UI元素来进行设置。
然后,我们可以从选项列表中进行选择。
ViewController.h
代码如下:
#import <UIKit/UIKit.h> @interface ViewController : UIViewController <UITextFieldDelegate> @property (strong, nonatomic) IBOutlet UITextField *myText; @property (strong, nonatomic) IBOutlet UITextField *customText; @property (strong, nonatomic) IBOutlet UIButton *button; @property (strong, nonatomic) IBOutlet UILabel *label; -(IBAction)showTextField; @end
我们定义了一个自定义方法,稍后将实现该方法来处理按钮操作。
另外,我们还为UITextField添加了一个属性,该属性可以通过编程方式添加。
此时构建并运行项目。
您会看到您可以在文本字段中进行书写,但是由于未配置返回键和要关闭的外部点击,因此您将无法关闭键盘。
如果单击返回键,则协议将在我们的类中调用textFieldShouldReturn:委托方法。
我们将通过调用textfield对象上的resignFirstResponder方法来关闭键盘。
下面定义了" ViewController.m"。
#import "ViewController.h" @interface ViewController () @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; [self addTextFieldWithDifferentKeyboard]; //Do any additional setup after loading the view, typically from a nib. } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; //Dispose of any resources that can be recreated. } - (IBAction)showTextField { self.label.text = self.myText.text; } - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { UITouch *touch = [touches anyObject]; if(![touch.view isMemberOfClass:[UITextField class]]) { [touch.view endEditing:YES]; } } - (BOOL)textFieldShouldReturn:(UITextField *)textField { NSLog(@"You entered %@",self.myText.text); [self.myText resignFirstResponder]; return YES; } -(void) addTextFieldWithDifferentKeyboard{ self.customText = [[UITextField alloc]initWithFrame: CGRectMake(10, 200, 300, 30)]; self.customText.delegate = self; self.customText.borderStyle = UITextBorderStyleRoundedRect; self.customText.keyboardType = UIKeyboardTypeNumberPad; self.customText.placeholder = @"Number pad keyboard"; self.customText.returnKeyType = UIReturnKeyDone; self.customText.clearButtonMode=UITextFieldViewModeWhileEditing; self.customText.font = [UIFont systemFontOfSize:14]; self.customText.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter; [self.view addSubview:self.customText]; } @end
要在外面轻按时关闭键盘,请使用以下代码段。
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { UITouch *touch = [touches anyObject]; if(![touch.view isMemberOfClass:[UITextField class]]) { [touch.view endEditing:YES]; } }
在文本字段中输入内容时,该文本字段的isEditing属性设置为YES。
endEditing:消息将传递到视图及其所有子视图。
如果我们通过YES,它将强制所有视图对象调用resignFirstResponder,从而关闭键盘。
使用[self addTextFieldWithDifferentKeyboard]
以编程方式添加TextField。
CGRectMake(topX,topY,width,height)用于定义布局。
其他属性类似于从属性检查器中选择的属性。
我们使用了数字键盘输入类型的键盘。
TextField的输入类型很多,例如:
- UIKeyboardTypeASCIICapable
- UIKeyboardTypeNumbersAndPunctuation
- UIKeyboardTypeURL
- UIKeyboardTypeNumberPad
- UIKeyboardTypePhonePad
- UIKeyboardTypeNamePhonePad
- UIKeyboardTypeEmailAddress
- UIKeyboardTypeDecimalPad
- UIKeyboardTypeTwitter
注意:在某些情况下,模拟器键盘可能不会弹出。
这是由于已经存在的硬件键盘。
转到模拟器->硬件->取消选中硬件键盘。
那就可以了
定义了按钮操作,以将标签文本更改为在ViewController中定义的TextField。