IOS-UI基础学习 用户登录界面（－）

本节完成图（丑是丑了点，总归能看的啦）新手笔记，如果啥意见的请提出，一定及时沟通改正。

所包含的控件

UILabel

UITextField

UIButton

三个基础控件

结构：

　　window - view - view(loginPage 这个打底界面纯粹是为了以后样式预留的)　　

 1 #import <UIKit/UIKit.h>
 2
 3 @interface LoginPage : UIView
 4 {
 5     UIButton *btnlogin;                //登录按钮
 6     UIButton *btnregist;               //注册按钮
 7     UITextField *txtUsername;          //用户名输入框
 8     UITextField *txtPassword;          //密码输入框
 9     UILabel *lblUsername;              //用户名标签
10     UILabel *lblPassword;              //密码标签
11 }
12 @end

  1 //
  2 //  LoginPage.m
  3 //  BaseControl1
  4 //
  5 //  Created by computer on 15/11/23.
  6 //  Copyright © 2015年 computer. All rights reserved.
  7 //
  8
  9 #import "LoginPage.h"
 10 #define mainRect self.frame.size
 11 @implementation LoginPage
 12
 13 /**
 14  *  初始化界面
 15  *
 16  *  @param frame
 17  *
 18  *  @return
 19  */
 20 - (instancetype)initWithFrame:(CGRect)frame
 21 {
 22     if(self = [super initWithFrame:frame])
 23     {
 24         [self initializeWithLabel];
 25         [self initializeWithTextField];
 26         [self initializeWithButton];
 27     }
 28     return self;
 29 }
 30
 31 #pragma  mark 控件初始化
 32 /**
 33  *  初始化标签
 34  */
 35 - (void)initializeWithLabel
 36 {
 37     //设定标签坐标
 38     lblUsername = [[UILabel alloc]initWithFrame:CGRectMake(
 39                                      50,
 40                                      50,0,0)];
 41     [lblUsername setText:@"帐号:"];
 42     //设置标签带下根据文字内容调整
 43     [lblUsername sizeToFit];
 44
 45     lblPassword = [[UILabel alloc]initWithFrame:CGRectMake(
 46                                                            lblUsername.frame.origin.x,
 47                                                            lblUsername.frame.origin.y+40, 0, 0)];
 48     [lblPassword setText:@"密码："];
 49     [lblPassword sizeToFit];
 50
 51     //将标签添加到
 52     [self addSubview:lblUsername];
 53     [self addSubview:lblPassword];
 54 }
 55
 56 /**
 57  *  初始化文本输入框
 58  */
 59 - (void)initializeWithTextField
 60 {
 61     txtUsername = [[UITextField alloc]initWithFrame:CGRectMake(
 62                                                                lblUsername.frame.origin.x+60,
 63                                                                lblUsername.frame.origin.y-2, 150, 25)];
 64     [txtUsername setPlaceholder:@"请输入用户名"];
 65     //设置文本清除模式 就是在输入的时候会在右边出现个 x 按钮，可以一键清除
 66     txtUsername.clearButtonMode = UITextFieldViewModeWhileEditing;
 67
 68     //背景色
 69     txtUsername.layer.backgroundColor = [[UIColor grayColor] CGColor];
 70
 71     txtPassword = [[UITextField alloc]initWithFrame:CGRectMake(
 72                                                                lblPassword.frame.origin.x+60,
 73                                                                lblPassword.frame.origin.y-2, 150, 25)];
 74     [txtPassword setPlaceholder:@"请输入密码"];
 75     txtPassword.clearButtonMode = UITextFieldViewModeWhileEditing;
 76     txtPassword.layer.backgroundColor = [[UIColor grayColor] CGColor];
 77     //设置为密码模式，就是输入字符会变成实心圆
 78     [txtPassword setSecureTextEntry:YES];
 79
 80
 81     [self addSubview:txtUsername];
 82     [self addSubview:txtPassword];
 83 }
 84
 85 /**
 86  *  初始化按钮
 87  */
 88 - (void)initializeWithButton
 89 {
 90     btnlogin = [[UIButton alloc]initWithFrame:CGRectMake(
 91                                                          lblPassword.frame.origin.x,
 92                                                          lblPassword.frame.origin.y+lblPassword.frame.size.height+40,
 93                                                          80, 30)];
 94     [btnlogin setTitle:@"登录" forState:UIControlStateNormal];
 95     [btnlogin setBackgroundColor:[UIColor grayColor]];
 96     [btnlogin setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];
 97
 98     btnregist = [[UIButton alloc]initWithFrame:CGRectMake(
 99                                                           btnlogin.frame.origin.x+btnlogin.frame.size.width+50,
100                                                           btnlogin.frame.origin.y,80, 30)];
101     [btnregist setTitle:@"注册" forState:UIControlStateNormal];
102     //设置背景色
103     [btnregist setBackgroundColor:[UIColor grayColor]];
104     //设置在默认模式下标题
105     [btnregist setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];
106
107
108     [self addSubview:btnlogin];
109     [self addSubview:btnregist];
110 }
111
112 #pragma  mark -
113 /**
114  *  触摸事件
115  *
116  *  @param touches
117  *  @param event
118  */
119 - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
120 {
121     //设定文本框模式为非修改，就会让键盘消失
122     [self endEditing:NO];
123 }
124
125 @end

 1 //
 2 //  ViewController.m
 3 //  BaseControl1
 4 //
 5 //  Created by computer on 15/11/23.
 6 //  Copyright © 2015年 computer. All rights reserved.
 7 //
 8
 9 #import "ViewController.h"
10 #import "LoginPage.h"
11 #define mainRect self.view.frame.size
12
13 @interface ViewController ()
14
15 @end
16
17 @implementation ViewController
18
19 - (void)viewDidLoad {
20     [super viewDidLoad];
21     LoginPage *loginpage = [[LoginPage alloc]
22                             initWithFrame:CGRectMake(
23                                     mainRect.width/2-150,
24                                     mainRect.height/2-300,300,200)];
25     loginpage.backgroundColor = [UIColor clearColor];
26
27     [self.view addSubview:loginpage];
28 }
29
30 - (void)didReceiveMemoryWarning {
31     [super didReceiveMemoryWarning];
32     // Dispose of any resources that can be recreated.
33 }
34
35 @end