6 用TangramKit实现登陆界面

2023-03-28  本文已影响0人  flyfishcxy

TangramKit是一套iOS界面视图布局框架。他的内核是基于对UIView的layoutSubviews方法的重载以及对子视图的bounds和center属性的设置而实现的。OC版本的名字叫做:MyLayout。

那么话不多说,我们开始来详细描述登陆界面实现过程:

ui效果展示

登录界面UI效果

1 创建纯代码开发环境--详细参照第5篇文章创造纯代码开发环境

2 在podfile引入TangramKit库文件,并执行pod install命令安把这个库安装到项目中

podfile引入

如果在项目Pods文件夹中出现TangramKit库,那说明安装成功了

TangramKit安装成功

在登录界面中引入这个库文件用来实现布局

引入TangramKit库

3 创建一个相对布局上面图片和下面的按钮(因为他们分别位于相对屏幕上下2个角)

TGRelativeLayout相对布局

4 创建上面图片

创建顶部logo

5 创建1个垂直方向的线性布局,用来放置下面的按钮

登录按钮的容器

6 创建1个水平方向线性布局容器用来布局一排第3方登录按钮

水平线性布局第3方按钮

7 创建协议label

协议label

8 将ViewController作为VC作为根控制器进行测试

测试

总结:

1 创建纯代码开发环境并pod引入TangramKit库

2 使用TangramKit库--根据登录界面做相应的相对和线性布局

3 在布局空间上添加相应的UI控件,实现相应的UI效果

上一篇 下一篇

猜你喜欢

热点阅读