美文网首页
启动页面特效--轮转

启动页面特效--轮转

作者: hunterzhu | 来源:发表于2016-07-29 21:15 被阅读21次

编写了一个简单而有趣的图片轮转特效。
这其中写了一些坐标的运算。
效果图:


1
2

代码部分

//
//  ViewController.m
//  demo-启动页特效
//
//  Created by mac on 16/7/29.
//  Copyright © 2016年 mac. All rights reserved.
//

#import "ViewController.h"
#define kScreenWidth     [UIScreen mainScreen].bounds.size.width
#define kScreenHeight     [UIScreen mainScreen].bounds.size.height
@interface ViewController (){
    //图片视图的数组
    NSMutableArray *imgViews;
    //图片视图的索引
    int index;
}

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    //初始化
    imgViews = [NSMutableArray array];
    index = 0;
    self.view.backgroundColor = [UIColor blackColor];
    
    //1.创建图片数组
    //设置24张图片  -每张图片的高度和宽度
    CGFloat width = kScreenWidth/4;
    CGFloat height = kScreenHeight/6;
    CGFloat x = 0;
    CGFloat y = 0;
    for(int i = 0; i < 24; i++ ){
        UIImage *image = [UIImage imageNamed:[NSString stringWithFormat: @"%d",i + 1]];
        UIImageView *imageView = [[UIImageView alloc ] initWithImage:image];
    //2.建立坐标点
        
        if (i<4) {
            x = i * width;
            y = 0;
        }else if (i<8){
            x = 3 *width;
            y = (i - 3) * height;
        }else if(i<12){
            x = kScreenWidth - (i - 7) *width;
            y = kScreenHeight - height;
        }else if (i <16) {
            x = 0;
            y = kScreenHeight - (i - 10) *height;
            
        }else if(i <18){
            x = (i - 15) *width;
            y = height;
            
        }else if (i<21){
            x = 2 * width;
            //两个高度单位
            y = (i - 16) *height;
        }else if(i <24){
            x = width;
            //5个高度的单位开始
            y = kScreenHeight - (i - 19) *height;
        }
        //设置frame
        imageView.frame = CGRectMake(x, y, width, height);
        //设置隐藏
        imageView.alpha = 0.3;
        [self.view addSubview:imageView];
        [imgViews addObject:imageView];
    
    }
    //3.添加定时器
    [NSTimer scheduledTimerWithTimeInterval:0.01
                                     target:self
                                   selector:@selector(changeAction:)
                                   userInfo:nil
                                    repeats:YES];
    
}

- (void)changeAction:(NSTimer *)timer {
    //数组超越界限
    if (index > 48) {
        index = 0;
    }
    
    if (index < 24) {
        UIImageView *imageView = imgViews[index];
        //显示出来
        imageView.alpha = 1;
    }else if (index > 24){
        UIImageView *imageView = imgViews[48- index];
        //隐藏
        imageView.alpha = 0.3;
    }
    
    index ++;
}

@end

相关文章

  • 启动页面特效--轮转

    编写了一个简单而有趣的图片轮转特效。这其中写了一些坐标的运算。效果图: 代码部分

  • 制作非缘勿扰页面特效

    制作非缘勿扰页面特效 \ ...

  • RN react-navigation-stack跳转到新页面并

    问题 启动页面过渡动画结束后跳转到登录页面,在登录页面点返回键不允许回到启动页面。 即在启动页面跳转到登录的时候关...

  • 2017-09-16--- ih5的学习

    事件/舞台 1.在舞台上建立 页面 点击事件即建立 2.把页面加上特效 - 点击加上去的特效 - 在左边设置播放的...

  • 网站开发需要的知识结构

    1.网站开发前台页面技术a. 页面设计:HTML、CSS+DIVb. 页面特效:JavaScript、jQuery...

  • 页面启动

    对比服务启动,页面启动相对就一种方式,命令行方式启动即使使用工具也是调出命令行面板键入命令启动,下面来看启动命令吧...

  • 启动页面

    白屏问题 2277!!注释掉 setContentView(R.layout.activity_splash);...

  • App白屏和启动优化的一些思路

    App启动优化 App启动优化原理与技术方案 启动优化 黑白屏问题 启动页面主题设置为图片 启动页面,不要再onC...

  • HTML5模拟齿轮动画

    这是一个基于HTML5的齿轮动画特效,我们将齿轮转动的物理学原理,转换为HTML5代码,在网页上实现了模拟齿轮转动...

  • java servlet

    web.xml设置启动页面 启动页面

网友评论

      本文标题:启动页面特效--轮转

      本文链接:https://www.haomeiwen.com/subject/kpbzjttx.html