IOS使用Auto Layout中的VFL适配

做登录页面,之前做都是用frame做,今天想着用Auto Layout中的VFL来做。觉得做的效果还是可以的(自恋一下下)。

首先看下效果图和标记图

自己在做的过程中也遇到了好多问题,不过也一个一个的自己解决了

1.子视图居中的问题

上一博客我也写了,由于指定了视图的宽度高度,想让视图居中对齐,可它就是不能达到预期,最后还是网上找了下才解决的。

2.约束不起作用

引起这个问题的原因很多,其中有一个是犯的最愚蠢的错误,就是添加约束前设置子视图

setTranslatesAutoresizingMaskIntoConstraintsNO.

setTranslatesAutoresizingMaskIntoConstraints=NO.

setTranslatesAutoresizingMaskIntoConstraints=NO

重要的事情说三遍

-------------------华丽的分割线------------------------------------

上面说的适配,这里说下实现

根据上图有一个账号 一个密码,它们两个只是图片 名称和文本类型不一样其他都一样,所以我就把它封装成一个View。

//
//  LoginView.h
//  Login
//
//  Created by City--Online on 15/9/8.
//  Copyright (c) 2015年 City--Online. All rights reserved.
//

#import <UIKit/UIKit.h>@interface LoginView : UIView
@property (nonatomic,strong) UIImageView *leftImgView;
@property (nonatomic,strong) UILabel *nameLabel;
@property (nonatomic,strong) UITextField *txtField;
@property (nonatomic,strong) UIView *bottomLine;
@end
//
//  LoginView.m
//  Login
//
//  Created by City--Online on 15/9/8.
//  Copyright (c) 2015年 City--Online. All rights reserved.
//

#import "LoginView.h"@implementation LoginView
-(instancetype)init
{self=[super init];if (self) {[self setTranslatesAutoresizingMaskIntoConstraints:NO];//左边图片_leftImgView=[[UIImageView alloc]init];[_leftImgView setTranslatesAutoresizingMaskIntoConstraints:NO];[self addSubview:_leftImgView];//名称_nameLabel=[[UILabel alloc]init];_nameLabel.font=[UIFont systemFontOfSize:18.0];_nameLabel.textColor=[UIColor colorWithRed:0.200f green:0.200f blue:0.200f alpha:1.00f];[_nameLabel setTranslatesAutoresizingMaskIntoConstraints:NO];[self addSubview:_nameLabel];//输入文本框_txtField=[[UITextField alloc]init];_txtField.font=[UIFont systemFontOfSize:18];
//        _txtField.layer.borderWidth=2.0;
        [_txtField setTranslatesAutoresizingMaskIntoConstraints:NO];[self addSubview:_txtField];//底部线条_bottomLine=[[UIView alloc]init];_bottomLine.backgroundColor=[UIColor colorWithRed:0.427f green:0.427f blue:0.427f alpha:1.00f];[_bottomLine setTranslatesAutoresizingMaskIntoConstraints:NO];[self addSubview:_bottomLine];}return self;
}
-(void)updateConstraints
{[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-35-[_leftImgView(25)]-10-[_nameLabel(40)]-5-[_txtField]-35-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_leftImgView,_nameLabel,_txtField)]];[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-30-[_leftImgView(25)]-10-[_bottomLine(0.5)]-0-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_leftImgView,_bottomLine)]];[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-30-[_bottomLine]-30-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_bottomLine)]];[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-25-[_txtField]-5-[_bottomLine(0.5)]-0-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_txtField,_bottomLine)]];[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[_nameLabel]-0-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_nameLabel)]];[super updateConstraints];
}@end

在界面中布局登录页面:

//
//  ViewController.m
//  Login
//
//  Created by City--Online on 15/9/8.
//  Copyright (c) 2015年 City--Online. All rights reserved.
//

#import "ViewController.h"
#import "LoginView.h"@interface ViewController ()@end@implementation ViewController- (void)viewDidLoad {[super viewDidLoad];self.view.backgroundColor=[UIColor whiteColor];//顶部图片UIImageView *headView=[[UIImageView alloc]initWithImage:[UIImage imageNamed:@"MR WU.png"]];[headView setTranslatesAutoresizingMaskIntoConstraints:NO];[self.view addSubview:headView];NSDictionary* views = NSDictionaryOfVariableBindings(headView);//设置高度[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-90-[headView(100)]" options:0 metrics:nil views:views]];//设置宽度[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"[headView(100)]" options:0 metrics:nil views:views]];//水平居中[self.view addConstraint:[NSLayoutConstraint constraintWithItem:headView attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1 constant:0]];//账号LoginView *accountView=[[LoginView alloc]init];accountView.leftImgView.image=[UIImage imageNamed:@"user.png"];accountView.nameLabel.text=@"账号";accountView.txtField.secureTextEntry=NO;[self.view addSubview:accountView];[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[accountView]-0-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(accountView)]];[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[headView]-50-[accountView(66)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(headView,accountView)]];//密码LoginView *passWordView=[[LoginView alloc]init];passWordView.leftImgView.image=[UIImage imageNamed:@"lock-"];passWordView.nameLabel.text=@"密码";passWordView.txtField.secureTextEntry=YES;[self.view addSubview:passWordView];[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[passWordView]-0-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(passWordView)]];[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[accountView]-0-[passWordView(accountView)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(accountView,passWordView)]];//登录按钮UIButton *loginBtn=[UIButton buttonWithType:UIButtonTypeRoundedRect];[loginBtn setTranslatesAutoresizingMaskIntoConstraints:NO];[loginBtn setTitle:@"登录" forState:UIControlStateNormal];[loginBtn setTitleColor:[UIColor colorWithRed:1.000f green:1.000f blue:1.000f alpha:1.00f] forState:UIControlStateNormal];loginBtn.titleLabel.font=[UIFont systemFontOfSize:20];loginBtn.backgroundColor=[UIColor colorWithRed:0.992f green:0.318f blue:0.106f alpha:1.00f];[self.view addSubview:loginBtn];[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[passWordView]-25-[loginBtn(45)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(passWordView,loginBtn)]];[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-30-[loginBtn]-30-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(loginBtn)]];UILabel *titleLabel=[[UILabel alloc]init];[titleLabel setTranslatesAutoresizingMaskIntoConstraints:NO];titleLabel.text=@"胖吴货栈发货系统";titleLabel.font=[UIFont systemFontOfSize:14.0];[titleLabel setTextColor:[UIColor colorWithRed:0.992f green:0.318f blue:0.106f alpha:1.00f]];[self.view addSubview:titleLabel];[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"[titleLabel]" options:NSLayoutFormatAlignAllCenterX metrics:nil views:NSDictionaryOfVariableBindings(titleLabel)]];[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[titleLabel]-10-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(titleLabel)]];[self.view addConstraint:[NSLayoutConstraint constraintWithItem:titleLabel attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1 constant:0]];}- (void)didReceiveMemoryWarning {[super didReceiveMemoryWarning];}@end

上面代码中包含了VFL的基本语法,对于更深的语法慢慢的来了解,晒一下做的效果

4s                        

 

5      

5s

6

6+

前面用的autoLayout自动布局,想着是自动布局Frame会不起作用,一直纠结键盘遮挡的问题。在网上找了下,有网友说改变约束,自己的布局也正好是以顶部的图片依次相对布局 ,所以准备改下顶部的约束就会解决键盘遮挡。自己定了一个标记值,判断键盘隐藏顶部约束值为正,否则为负。可是问题出现了,点击文本框后能键盘弹出后视图能向上,但键盘隐藏之后视图并未回到原位,自己又试着删除全部约束重新添加可还是不行,这个问题让我纠结好久。最后问了下小伙伴oliver,改了下frame问题就解决了。我以为用autolayout并未设置frame,怎么会有呢,问了他下,原来适配也是有frame的。这让我想起了autoLayout的原理,它属于数学的线性规划。最终还是会有一个值的

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/296466.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C#中字符“.NET研究”串的内存分配与驻留池

刚开始学习C#的时候&#xff0c;就听说CLR对于String类有一种特别的内存管理机制&#xff1a;有时候&#xff0c;明明声明了两个String类的对象&#xff0c;但是他们偏偏却指向同一个实例。如下&#xff1a; String s1 "Hello";String s2 "Hello"; //s2和s…

如何在业务层实现响应缓存

前言上次&#xff0c;我们介绍了应该在业务层实现管道模式响应缓存是ASP.NET Core中很重要的功能&#xff0c;它可以存储响应&#xff0c;并提供来自缓存的响应&#xff0c;以便提高程序性能。响应缓存通常是通过Middleware实现的&#xff1a;public static class ResponseCach…

mysql 5.5.46_MySQL 5.5.46源码安装

环境信息准备操作系统是centos 6.5 yum install gcc gcc-c cmake ncurses-devel安装mysql解压 tar -xzvf mysql-5.5.46.tar.gz -Cbuild编译 由于使用了cmake进行编译cd build/mysql-5.5.46cmake . \-DCMAKE_INSTALL_PREFIX$HOME/local/mysql-5.5.46 \ #指定安装目录-DWITH_INNO…

《Effective.Enterprise.Java中文版》知识点摘要

《Effective.Enterprise.Java中文版》本书最重要的部分是&#xff1a;理解企业级计算技术中的常规问题和使用企业级JAVA平台技术来处理这些问题。. 语言和API也许会发生变化&#xff0c;但是你将会理解&#xff1a;构建良好架构所要考虑的问题&#xff1b;有那些通信方式可供选…

左手菲尔兹右手突破奖,这个中国女婿其实是英国贵族?拿到300万奖金后他这样说……...

全世界只有3.14 % 的人关注了爆炸吧知识如果说科学界里高大上的奖项&#xff0c;你还是只能想到诺贝尔&#xff0c;菲尔兹&#xff0c;那可能真的是out了。毕竟现在都0202年了。少年&#xff0c;突破奖了解一下&#xff1f;作为有马云&#xff0c;马化腾&#xff0c;还有俄罗斯…

理财平台架构分析

一个理财平台可以从不同的维度来看。对于一个消费者来说&#xff0c;最宏观的看法&#xff0c;P2P公司的理财平台相当于一个中介&#xff0c;一边用于对接用户&#xff0c;一边用于对接产品提供商。这个中介系统负责用户和产品提供者之间的交互。对于一个P2P理财公司来说&#…

Linux下添加普通帐号

Linux下系统管理员其中一个很重要的职能就是帐号管理.一般来说很多比较好的发行版本都会不建议用户使用root用户登录系统的,因为root用户的权限实在太大了,一不小心就可能破坏了系统.因此我们一般使用普通帐号登陆系统,而要使用普通帐号登陆就必须拥有普通帐号.本文将介绍几种添…

mysql数据压缩存储_压缩文本,然后存储在mysql数据库中

I am developing a web application using php and MySQL. I am compressing the text using gzcompress() php function before storing in MySQL database / storing compressed form of text in database. My Question is that is this OK? to store compressed form? Or …

Abp VNext 集成sharding-core 分表分库

ShardingCore 易用、简单、高性能、普适性&#xff0c;是一款扩展针对efcore生态下的分表分库的扩展解决方案,支持efcore2的所有版本,支持efcore2的所有数据库、支持自定义路由、动态路由、高性能分页、读写分离的一款组件&#xff0c;如果你喜欢这组件或者这个组件对你有帮助请…

引热议!多所高校明文规定:不再给部分全日制研究生安排宿舍

全世界只有3.14 % 的人关注了爆炸吧知识本文转自募格学术。近日&#xff0c;高校宿舍问题频发。矛盾点基本都集中在宿舍加塞人&#xff0c;宿舍环境不好&#xff0c;为了迎接新生强制老生搬宿舍但宿舍环境一言难尽等...... 不过好歹也都算解决了研究生住宿的问题。但近日&#…

学习笔记:log4j.properties配置

示例&#xff1a; 1 log4j.debugtrue 2 log4j.rootLoggerDEBUG,stdout,D //所有输出都会用到这里的appedder3 log4j.logger.com.test.serverDEBUG,E //为特定的的包指定输出4 //output log to console5 log4j.appender.stdoutorg.apache.log4j.ConsoleAppender 6 log4…

Unity 游戏开发技巧集锦之使用忍者飞镖创建粒子效果

Unity 游戏开发技巧集锦之使用忍者飞镖创建粒子效果 使用忍者飞镖创建粒子效果 游戏中&#xff0c;诸如烟、火、水滴、落叶等粒子效果&#xff0c;都可以使用粒子系统&#xff08;particle system&#xff09;来实现。例如&#xff0c;《明朝传奇》中的篝火&#xff0c;如图2-3…

“.NET研究”【Android开发教程】一、基础概念

Android操作系统 Android是一个基于Linux、使用java作为程序接口的操作系统。他提供了一些工具&#xff0c;比如编译器、调试器、还有他自己的仿真器&#xff08;DVM — Dalvik Virtual Machine&#xff09;。Android是由google领导的Open Handset Alliance开发的。 Android使用…

落在我手里,今天你能嫁出去算我输!

1 今天你能嫁出去算我输▼2 好像拍到了某些不可描述的画面▼3 猫猫&#xff1a;人呢&#xff1f;掉哪儿了&#xff1f;▼4 像极了下决心运动的你▼5 据最新研究欲火焚身这个词是很有科学依据的▼6 按这么说至少能保证说上话▼7 这不是普通狗仔了已经是海狗仔了▼你点的每…

mysql 5.6 slave stop_mysql 5.6 Replication 参数

花了一天的时间&#xff0c;看了mysql 5.6 Replication 章节内容&#xff0c;其中的一些参数做了一下笔记1&#xff1a;binlog_format 默认值是&#xff1a;statement有效值: ROW,基于行的复制STATEMENT 基于语句级别的复制MASTER_LOG_POS,MIXED 基于以上2种混合都有个各自的…

记一次 .NET 某资讯论坛 CPU爆高分析

大概有11天没发文了&#xff0c;真的不是因为懒&#xff0c;本想前几天抽空写&#xff0c;不知道为啥最近求助的朋友比较多&#xff0c;一天都能拿到2-3个求助dump&#xff0c;晚上回来就是一顿分析&#xff0c;有点意思的是大多朋友自己都分析了几遍或者公司多年的牛皮藓问题&…

内存调试技巧

内存调试技巧 2007 年 6 月 21 日 本文将带您了解一些良好的和内存相关的编码实践&#xff0c;以将内存错误保持在控制范围内。内存错误是 C 和 C 编程的祸根&#xff1a;它们很普遍&#xff0c;认识其严重性已有二十多年&#xff0c;但始终没有彻底解决&#xff0c;它们可能严…

CSS中的!important属性用法

由于IE并不严格执行W3C标准&#xff0c; 而又几乎垄断了浏览器市场。 所以作为一名合格的网站制作人员&#xff0c; 必须要针对不同的浏览器进行微调。 实现不同浏览器之间兼容的方法有很多&#xff0c; 比如利用JS探测用户的浏览器类型&#xff0c;从而调用不同的样式表。 或者…

java中equals和==的区别

值类型是存储在内存中的堆栈&#xff08;以后简称栈&#xff09;&#xff0c;而引用类型的变量在栈中仅仅是存储引用类型变量的地址&#xff0c;而其本身则存储在堆中。操作比较的是两个变量的值是否相等&#xff0c;对于引用型变量表示的是两个变量在堆中存储的地址是否相同&a…

数学课本上的几大变态之处

全世界只有3.14 % 的人关注了爆炸吧知识数学课本上的几大变态--完--