这里记录一下我的整体思维过程。中间可能或有问题、矛盾，引以为戒。
首先搭建登录界面，要清楚登录界面的布局
之后，设置出自己需要的属性

//登录界面背景图片
@property(nonatomic,strong)UIImageView * imageV;
//用户名
@property(nonatomic,strong)UITextField * userNameField;
//密码
@property(nonatomic,strong)UITextField * passWordField;
//登录Button
@property(nonatomic,strong)UIButton * loginButton;
//忘记密码
@property(nonatomic,strong)UIButton * forgetButton;
//存放界面
@property(nonatomic,strong)UIView * storeView;

开始设置用户名、密码的TextField，我写了一个方法，方便调用。属性较多，为了方便自定义两个field可能不同要求，都写进方法里了（有什么用，你家的用户名、密码的field长得不一样？？）

-(UITextField *)setInfoTextField:(UITextField *)field color:(UIColor *)color placeholder:(NSString *)placeholder secureTextEntry:(BOOL )secure image:(NSString *)imageName cornerRadius:(CGFloat)radius{
   
    //颜色
    field.backgroundColor = color;
    
    //占位符
    field.placeholder = placeholder;
    
    //密文输入
    field.secureTextEntry = secure;
    
    //添加右侧图片
    UIImageView * imageV1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:imageName]];
    field.leftView = imageV1;
    field.leftViewMode = UITextFieldViewModeAlways;
    
    //设置边框弧度 cornerRadius
    field.layer.cornerRadius = radius;
    
    //是否有×号
    field.clearButtonMode = UITextFieldViewModeAlways;
    
    //显示边框样式
//    field.borderStyle = UITextBorderStyleRoundedRect;
    //内容对齐方式
    //self.uesrNameField.textAlignment = UITextAlignmentLeft;
    return field;
}

方法写好了之后，设置登录界面

 //登录界面背景图片
    self.imageV = [[UIImageView alloc] initWithFrame:[UIScreen mainScreen].bounds];
    self.imageV.image = [UIImage imageNamed:@"Bitmap.png"];
    [self.view addSubview:self.imageV];

 //存放界面
    self.storeView = [[UIView alloc] initWithFrame:CGRectMake(20, 70, self.view.frame.size.width - 40, 200)];
    [self.view addSubview:self.storeView];

    //用户名
    self.userNameField = [self setInfoTextField:[[UITextField alloc] initWithFrame:CGRectMake(10, 10, self.storeView.frame.size.width - 20, 60)] color:[UIColor whiteColor] placeholder:@"请输入用户名" secureTextEntry:NO image:@"email.png" cornerRadius:5.0 ];
    [self.storeView addSubview:self.userNameField];

    //密码
    self.passWordField = [self setInfoTextField:[[UITextField alloc] initWithFrame:CGRectMake(10, 70, self.storeView.frame.size.width - 20, 60)] color:[UIColor whiteColor] placeholder:@"请输入密码" secureTextEntry:YES image:@"Lock.png" cornerRadius:5.0];
    [self.storeView addSubview:self.passWordField];

    //登录按钮
    _loginButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    [_loginButton setFrame:CGRectMake(10, CGRectGetMaxY(_passWordField.frame)+10, self.storeView.frame.size.width - 20, 60)];
    [_loginButton setTitle:@"登录" forState:UIControlStateNormal];
    [_loginButton setBackgroundColor:[UIColor colorWithRed:51/255.0 green:102/255.0 blue:255/255.0 alpha:0]];
    [_loginButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
    [self.storeView addSubview:self.loginButton];

这里设置storeView的主要目的是方便以后整体调整。然而，我现在想放上图片的时候，模拟器卡死了。重启一下。。。

登录界面00.png

感觉好挫的样子。优化一下。

现在创建一个新建一个文件，继承于UIView

为什么要继承与UIView呢？

因为我们要用到它的绘图方法

创建UIView文件.png

这个方法是在简书上借鉴别的大神的方法，我就不多赘余了。但是这个与我的要求有一点点冲突。我是把两个Field和登录Button放在一个View里了。所以，我有写了一个方法。。。来专门设置需要变圆角的一个角

- (void)applyRoundCorners:(UIRectCorner)corners radius:(CGFloat)radius textField:(UITextField *)textField
{
    UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:textField.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(radius, radius)];
    
    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.frame = textField.bounds;
    maskLayer.path = maskPath.CGPath;
    
    textField.layer.mask = maskLayer;
}
//调用方法
 [self applyRoundCorners:UIRectCornerTopLeft|UIRectCornerTopRight radius:5 textField:_userNameField];
 [self applyRoundCorners:UIRectCornerBottomLeft|UIRectCornerBottomRight radius:5 textField:self.passWordField];

登录界面01.png

中间缺了一条分割线。

登录界面02.png

加分割线，说出来丢人，我是直接加了个UIView。。。
之后添加了个注册按钮，忘记密码按钮，头像

登录界面03.png

背景的模糊图片就是本来就是模糊的图片。