实现界面如上所示:

有一个弹框,弹框上边有一个关闭按钮,点击按钮,可以关闭弹框。点击弹框的周围区域也可以关闭按钮。 点击上边的隐藏弹框也可以关闭按钮。

在实现功能的基础上,以动画的形式展示跟隐藏。

思路:在之前的开发中,我的思路比较局限。想着用一个view来做中间的那一块,那么问题来了,左上角的关闭按钮,就加在view的左上角。效果猛一看是可以实现,但是这个关闭按钮的点击事件,却不怎么好使,因为按钮有一部分超出了view的界限,于是,点击起来就不太好使。

遇见问题,解决问题。于是我就转换了一种思路。当然这思路还是在别人的指点下完成的。

思路如下:

1.首先确实需要一个弹框的view1 view1的大小是整个界面的大小。设置这个view的背景为半透明,透明度可以是0.5 或者是任意0-1之间的数值,具体看你想要的效果。

2.然后需要一个放内容的view2 这个view2里边包含了 上边的img 还有两行文字,都是放在这个view2里边的。

3.最后将关闭按钮 加在view1的上边。这样就大功告成了。 随便点击关闭按钮,丝毫没有任何印象。

核心代码实现:
acercodeview的代码
//

//  ACErCodeView.m

//  demo1二维码点击动态出现

//

//  Created by Alice_ss on 2018/1/3.

//  Copyright © 2018年 AC. All rights reserved.

//

#import "ACErCodeView.h"

#define SCREENW [UIScreen mainScreen].bounds.size.width

#define SCREENH [UIScreen mainScreen].bounds.size.height

@implementation ACErCodeView{

    UIImageView *codeIMG;

    UILabel *nickNameLabel;

    UILabel *sexLabel;

    UIButton *closeBtn;

}

-(instancetype)initWithFrame:(CGRect)frame{

    if (self = [super initWithFrame:frame]) {

        [self createUI];

    }

    return  self;

}

- (void)createUI{

    //1.创建一个view背景设置呈透明的因为这样的话才能将关闭按钮悬浮在上边。

    UIImageView *bgView = [[UIImageView alloc]initWithFrame:CGRectMake(0, 64, SCREENW,SCREENH)];

    UITapGestureRecognizer *tap  = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(tapClose)];

    bgView.userInteractionEnabled = YES;

    [bgView addGestureRecognizer:tap];

    [self addSubview:bgView];

    //2.放内容的大view

    UIView *contentView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, SCREENW-120,SCREENH-200)];

    contentView.backgroundColor = [UIColor whiteColor];

    [self addSubview:contentView];

    //3.二维码图片

    codeIMG = [[UIImageView alloc]initWithFrame:CGRectMake((CGRectGetWidth(contentView.frame)-100)/2, CGRectGetMinY(contentView.frame), 100, 100)];

    codeIMG.backgroundColor = [UIColor redColor];

    [contentView addSubview:codeIMG];

    //4.昵称

    nickNameLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, CGRectGetMaxY(codeIMG.frame)+10, CGRectGetWidth(contentView.frame), 44)];

//    nickNameLabel.backgroundColor = [UIColor blueColor];

    nickNameLabel.text = @"我是你们喜欢的Alice";

    nickNameLabel.textAlignment = NSTextAlignmentCenter;

    [contentView addSubview:nickNameLabel];

    //5.sex

    sexLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, CGRectGetMaxY(nickNameLabel.frame)+10, CGRectGetWidth(contentView.frame), 44)];

//    sexLabel.backgroundColor = [UIColor redColor];

    sexLabel.text= @"我的性别是一个漂亮的小美女哦";

    sexLabel.textAlignment  = NSTextAlignmentCenter;

    [contentView addSubview:sexLabel];

    //给contentview设置高度

    contentView.frame = CGRectMake(SCREENW/2-(SCREENW-120)/2, (SCREENH-(CGRectGetMaxY(sexLabel.frame)+10))/2, SCREENW-120, CGRectGetMaxY(sexLabel.frame)+10);

    //6.关闭按钮

    closeBtn = [[UIButton alloc]initWithFrame:CGRectMake(CGRectGetMinX(contentView.frame)-10, CGRectGetMinY(contentView.frame)-10, 30, 30)

                ];

    [closeBtn setBackgroundImage:[UIImage imageNamed:@"icon_shouye_GuanBi.png"] forState:0];

    [closeBtn addTarget:self action:@selector(closeBtnClicked:) forControlEvents:UIControlEventTouchUpInside];

    [self addSubview:closeBtn];

}

//关闭页面

- (void)closeBtnClicked:(UIButton*)sender{

    [UIView animateWithDuration:0.3 animations:^{

        self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.3, 0.3);

    } completion:^(BOOL finished) {

        [UIView animateWithDuration:0.2 animations:^{

            self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0, 0);

        }];

        self.hidden = YES;

        self.blockCloseClicked(self.hidden);

    }];

}

//点击背景隐藏界面

- (void)tapClose{

    [UIView animateWithDuration:0.3 animations:^{

        self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.3, 0.3);

    } completion:^(BOOL finished) {

        [UIView animateWithDuration:0.2 animations:^{

            self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0, 0);

        }];

        self.hidden = YES;

        self.blockCloseClicked(self.hidden);

    }];

}

@end

//viewcontroller的书写

//

//  Created by Alice_ss on 2018/1/3.

//  Copyright © 2018年 AC. All rights reserved.

//

#import "ViewController.h"

#import "ACErCodeView.h"

#define SCREENW [UIScreen mainScreen].bounds.size.width

#define SCREENH [UIScreen mainScreen].bounds.size.height

@interface ViewController ()

@property (weak, nonatomic) IBOutlet UIBarButtonItem *navRBarItem;

@property(nonatomic,strong)ACErCodeView *erCodeIMG;

@end

@implementation ViewController

- (IBAction)naviRBarClicked:(UIBarButtonItem *)sender {

    NSLog(@"RIGHT BAR ITEM CLICKED");

    if(_erCodeIMG.hidden){

        _erCodeIMG.hidden = NO;

        sender.title = @"点击隐藏";

        _erCodeIMG.transform = CGAffineTransformScale(CGAffineTransformIdentity, CGFLOAT_MIN, CGFLOAT_MIN);

        [UIView animateWithDuration:0.3 animations:^{

            self.erCodeIMG.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 1.0);

        } completion:^(BOOL finished) {

            [UIView animateWithDuration:0.2 animations:^{

                _erCodeIMG.transform = CGAffineTransformIdentity;

            }];

        }];

    }else{

        sender.title = @"点击显示";

        [UIView animateWithDuration:0.3 animations:^{

            self.erCodeIMG.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.3, 0.3);

        } completion:^(BOOL finished) {

            [UIView animateWithDuration:0.2 animations:^{

                _erCodeIMG.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0, 0);

            }];

            _erCodeIMG.hidden = YES;

        }];

    }

}

- (void)viewDidLoad {

    [super viewDidLoad];

    self.view.backgroundColor = [UIColor yellowColor];

    // Do any additional setup after loading the view, typically from a nib.

    _erCodeIMG = [[ACErCodeView alloc]initWithFrame:CGRectMake(0, 0,SCREENW , SCREENH)];

    _erCodeIMG.backgroundColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.5];

    _erCodeIMG.hidden = YES;

    __weak typeof(self) weakSelf = self;

    _erCodeIMG.blockCloseClicked = ^(BOOL ishidden) {

        if (ishidden) {

            self.navRBarItem.title = @"点击显示";

        }else{

            self.navRBarItem.title = @"点击隐藏";

        }

    };

    [self.view addSubview:_erCodeIMG];

}

- (void)didReceiveMemoryWarning {

    [super didReceiveMemoryWarning];

    // Dispose of any resources that can be recreated.

}

@end

以上就是全部代码。

希望新的一年,自己工作越来越踏实。同时也要学会拒绝,学会给与。

如有任何问题。请联系我的邮箱 673658917@qq.com .

demo1 动态显示view或弹框 动态隐藏view或弹框的更多相关文章

  1. Android 通过Java代码生成创建界面。动态生成View,动态设置View属性。addRules详解

    废话不多说,本文将会层层深入给大家讲解如何动态的生成一个完整的界面. 本文内容: Java代码中动态生成View Java代码中动态设置View的位置,以及其他的属性 LayoutParams详解 一 ...

  2. CCOMBOX下拉弹出框,因属性对话框自动隐藏而弹出框没有隐藏问题

    关于这个问题是可以使用 使其失去焦点 releasecapture()解决的,但是鼠标在下拉列表中的item中经过时,调用releasecapture()后会选中最后mousemove过的item项. ...

  3. bootstrap模态框动态赋值, ajax异步请求数据后给id为queryInfo的模态框赋值并弹出模态框(JS)

    /查询单个 function query(id) { $.ajax({ url : "/small/productServlet", async : true, type : &q ...

  4. 键盘弹出后上提view隐藏后下拉view还原并修改scroll过程中旋转屏幕到竖屏view显示错误

    1,注册键盘相应事件 [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillSho ...

  5. go语言使用go-sciter创建桌面应用(七) view对象常用方法,文件选择,窗口弹出,请求

    view对象的详细文档请看: https://sciter.com/docs/content/sciter/View.htm demo9.html代码如下: <!DOCTYPE html> ...

  6. Android 判断软键盘弹出并隐藏的简单完美解决方案

    最近项目中有一个编辑框,下面是个ListView.在触发编辑框弹出软键盘后,ListView还能滑动,并且ListView的item还能响应单击.这样的体验效果很不好.于是便想在滑动或单击item时判 ...

  7. 手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法

    手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法 最近碰到Android微信内置浏览H5页面,因为其中的文本输入框(input)放置在靠近页面的中下方,点击文本框以后,则输入框会被弹出的手机 ...

  8. 第三十九篇、NavBar动态隐藏、设置透明、毛玻璃效果

    1.动态隐藏 - (void)viewDidLoad { [super viewDidLoad]; if ([self respondsToSelector:@selector(automatical ...

  9. 有几数组表单,js怎么获得数组并动态相加输出到文本框

    有几数组表单,js如何获得数组并动态相加输出到文本框<input   name= "fee1[] "> <input   name= "fee2[] & ...

随机推荐

  1. 循序渐进VUE+Element 前端应用开发(15)--- 用户管理模块的处理

    在前面随笔介绍了ABP+Vue前后端的整合处理,包括介绍了ABP的后端设计,以及前端对ABP接口API的ES6的封装,通过JS的继承类处理,极大减少了重复臃肿的代码,可以简化对后端API接口的封装,而 ...

  2. 循序渐进VUE+Element 前端应用开发(16)--- 组织机构和角色管理模块的处理

    在前面随笔<循序渐进VUE+Element 前端应用开发(15)--- 用户管理模块的处理>中介绍了用户管理模块的内容,包括用户列表的展示,各种查看.编辑.新增对话框的界面处理和后台数据处 ...

  3. db2数据库基本添加删除表字段总结

    1.添加字段 alter table [table_name] add [column_name] [column_type] 2.更改字段类型 alter table  [table_name] a ...

  4. Python Ethical Hacking - KEYLOGGER(1)

    A program that records keys pressed on the keyboard. Common features: Store logs locally(local keylo ...

  5. 线性dp 之 奶牛渡河

    题目描述 Farmer John以及他的N(1 <= N <= 2,500)头奶牛打算过一条河,但他们所有的渡河工具,仅仅是一个木筏. 由于奶牛不会划船,在整个渡河过程中,FJ必须始终在木 ...

  6. js原型、原型链

    之前有说过继承,在js中没有类,所以在new的后面,放的是构造函数,在构造函数中有一个属性prototype,js的继承全靠它. 在js中对象的类型有很多,常见的就是普通对象,和函数对象,在对象中都会 ...

  7. Huffuman树--------找最值学会用sort和cmp

    问题描述 Huffman树在编码中有着广泛的应用.在这里,我们只关心Huffman树的构造过程. 给出一列数{pi}={p0, p1, …, pn-1},用这列数构造Huffman树的过程如下: 1. ...

  8. w10查看wifi密码

    1.选择网络和Internet设置 右键单击网络连接图标,选择“打开网络和Internet设置”. 2.选择网络和共享中心

  9. 数据库(十二):pymysql

    进击のpython ***** 数据库--pymysql 数据库就算是学习完毕了,但是我们学习数据库的本质是什么? 是想让数据库像文件存储一样将信息存储起来供我们调用 那回归本行,我就应该是用pyth ...

  10. SpringBoot + Spring Cloud Eureka 服务注册与发现

    什么是Spring Cloud Eureka Eureka是Netflix公司开发的开源服务注册发现组件,服务发现可以说是微服务开发的核心功能了,微服务部署后一定要有服务注册和发现的能力,Eureka ...