专栏首页iOS Developer仿window阿里旺旺登陆界面,打印机吐纸动画效果---转自Bison的技术博客

仿window阿里旺旺登陆界面,打印机吐纸动画效果---转自Bison的技术博客

偶然的机会发现window的阿里旺旺的登陆效果蛮有意思的,于是就模仿着做了一下打印机吐纸的动画效果 看起来很神奇的东西,实现起来却不难,下面我给大家看下主要的源码。

- (void)createUI{
    UIImageView *backimageView=[[UIImageView alloc]init];
    backimageView.image =[UIImage imageNamed:@"1.png"];
    backimageView.frame = CGRectMake(50, 100, LBSCREEN_WIDTH-100, 30);
    [self.view addSubview:backimageView];
    backView = [[UIView alloc]initWithFrame:CGRectMake(60, 115, LBSCREEN_WIDTH-120, 0)];
    backView.layer.cornerRadius = 5;
    backView.backgroundColor = [UIColor whiteColor];
    backView.layer.borderWidth = 1;
    backView.layer.borderColor = [UIColor blackColor].CGColor;
    backView.clipsToBounds = YES;
    [self.view addSubview:backView];
    login_btn = [UIButton buttonWithType:UIButtonTypeCustom];
    login_btn.frame = CGRectMake(10, 120, LBSCREEN_WIDTH-140, 35);
    [login_btn setTitle:@"登陆" forState:UIControlStateNormal];
    login_btn.backgroundColor = [UIColor lightGrayColor];
    login_btn.layer.cornerRadius = 5;
    login_btn.layer.borderWidth = 1;
    login_btn.layer.borderColor = [UIColor lightGrayColor].CGColor;
    [login_btn addTarget:self action:@selector(passwordClick:) forControlEvents:UIControlEventTouchUpInside];
    login_btn.clipsToBounds = YES;
    pass_btn = [UIButton buttonWithType:UIButtonTypeCustom];
    pass_btn.frame = CGRectMake(10, 165, LBSCREEN_WIDTH-140, 35);
    [pass_btn setTitle:@"注册" forState:UIControlStateNormal];
    pass_btn.backgroundColor = [UIColor redColor];
    [pass_btn addTarget:self action:@selector(passwordClick:) forControlEvents:UIControlEventTouchUpInside];
    pass_btn.layer.cornerRadius = 5;
    pass_btn.layer.borderWidth = 1;
    pass_btn.layer.borderColor = [UIColor lightGrayColor].CGColor;
    pass_btn.clipsToBounds = YES;
    Name_textfield = [[UITextField alloc]initWithFrame:CGRectMake(10, 20, LBSCREEN_WIDTH-140, 40)];
    Name_textfield.placeholder = @"帐号";
    Name_textfield.borderStyle = UITextBorderStyleRoundedRect;
    Pass_textfield = [[UITextField alloc]initWithFrame:CGRectMake(10, 70, LBSCREEN_WIDTH-140, 40)];
    Pass_textfield.borderStyle = UITextBorderStyleRoundedRect;
    Pass_textfield.placeholder = @"密码";
    //2秒后开始一个持续一分钟的动画
    [UIView animateWithDuration:1 delay:2 options:UIViewAnimationOptionBeginFromCurrentState animations:^{
        backView.frame=CGRectMake(60, 115, LBSCREEN_WIDTH-120, 210);
    } completion:^(BOOL finished) {
    
        [backView addSubview:Name_textfield];
        dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.3 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
            [backView addSubview:Pass_textfield];
            dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.3 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
                [backView addSubview:login_btn];
                dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.3 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
                    [backView addSubview:pass_btn];
                });
            });
        });

    }];

}

- (void)passwordClick:(UIButton *)sender{
    NSLog(@"hhhhh....");
}

不难看懂吧?主要就用到了一个改变frame的动画,x轴和y轴以及宽不变,改变它的高 下面晒下效果图

(http://allluckly.cn)

哦,差点忘记把源码下载的地址给忘了,在此补上

下载地址---来戳我

推荐一款学习iOS开发的app_____|______| | 传送门

更多经验请点击

好文推荐:Biosn收集的Git常见的错误解决方式

原文地址:http://allluckly.cn 技术交流群:534926022(免费) 511040024(0.8/人付费) 版权归©Bison所有 如需转载请保留原文超链接地址!否则后果自负!

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Swift初探之纯代码写tabBar

    Bison
  • Flutter 初体验

    Flutter的横空出世,很大程度上降低了移动应用的开发成本;我是一名苦逼的iOS开发者,兼职写点Android开发,对Flutter的出现比一般人要敏感很多,...

    Bison
  • Swift纯代码走进UICollectionView

    Bison
  • Groovy里读写本地文件的几种方式

    其中第八行的双引号包裹起来的变量代表GString,即JavaScript和ABAP里的字符串模板。

    Jerry Wang
  • 微软全新 Edge 真香!或许它注定会成为最佳浏览器

    自从 2019 年微软发布基于 Chromium 开发的全新 Edge 浏览器,我便第一时间用上了这款让人翘首以盼已久的浏览器。

    GitHubDaily
  • 西安小程序开发行业坑多套路深,追逐风口更需擦亮眼睛

    “小程序开发这滩水真是太深了!”不少创业者小程序的威力之后都想要从中赚一笔,西安杜女士就是其中一员。“小程序太火了,我想着就算从中赚不到钱,最起码也能起到引流作...

    西安弈聪软件公司
  • Java集合详解3:一文读懂Iterator,fail-fast机制与比较器

    《Java集合详解系列》是我在完成夯实Java基础篇的系列博客后准备开始写的新系列。

    Java技术江湖
  • Java集合详解3:一文读懂Iterator,fail-fast机制与比较器

    本系列文章将整理到我在GitHub上的《Java面试指南》仓库,更多精彩内容请到我的仓库里查看

    Java技术江湖
  • 用数据分析唤醒你的“原力”:星球大战系列电影的影响

    大数据文摘
  • 新的Linux漏洞使攻击者可以劫持V**连接!

    近日,安全研究人员发现了一个新漏洞,使潜在的攻击者可以劫持受影响的* NIX设备上的VPN连接,并将任意数据有效载荷注入IPv4和IPv6 TCP流中。

    用户6543014

扫码关注云+社区

领取腾讯云代金券