iOS ---进阶之摇一摇

1、摇一摇的原理分析

1）在摇动手机时会产生一个动画，界面的图片会在中间分开分别进行向上、向下的位置移动。

分析：此过程就是在主屏幕上设置两个imageView，在开始摇动的方法中对这两个imageView进行位置移动，界面的层次结构如下图：

2）在界面进行动画操作的同时播放音频

分析：在执行动画的方法中添加播放音频的代码

3）在结束晃动时做出相应的操作：发送随机数据请求、页面的跳转等等

2、VC.m文件的代码如下：

#import "ViewController.h"
#import "NextViewController.h"
#import <AudioToolbox/AudioToolbox.h>
#define SCREEN_WIDTH  self.view.bounds.size.width
#define SCREEN_HEIGHT self.view.bounds.size.height
@interface ViewController ()
@property (strong,nonatomic)UIImageView * topImage;
@property (strong,nonatomic)UIImageView * bottomImage;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [UIApplication sharedApplication].applicationSupportsShakeToEdit = YES;
    [self setupImageView];

}
/**
 *  播放MP3
 */
- (void)playMp3
{
    NSString * mp3Path = [[NSBundle mainBundle]pathForResource:@"glass.wav" ofType:nil];

    NSURL * soundUrl = [NSURL fileURLWithPath:mp3Path];
    SystemSoundID soundId;
    AudioServicesCreateSystemSoundID((__bridge CFURLRef)(soundUrl), &soundId);
    AudioServicesPlaySystemSound(soundId);

}
- (void)setupImageView
{
    self.topImage = [[UIImageView alloc]initWithFrame:CGRectMake(, , SCREEN_WIDTH, SCREEN_HEIGHT/)];
    self.topImage.image = [UIImage imageNamed:@"Shake_01"];
    [self.view addSubview:self.topImage];

    self.bottomImage = [[UIImageView alloc]initWithFrame:CGRectMake(, SCREEN_HEIGHT/, SCREEN_WIDTH, SCREEN_HEIGHT/)];
    self.bottomImage.image = [UIImage imageNamed:@"Shake_02"];
    [self.view addSubview:self.bottomImage];

}
/**
 *  开始摇动
 */
-(void)motionBegan:(UIEventSubtype)motion withEvent:(UIEvent *)event
{
    [UIView animateWithDuration:1.0 animations:^{

        [self playMp3];
        self.topImage.transform = CGAffineTransformMakeTranslation(, -);
        self.bottomImage.transform = CGAffineTransformMakeTranslation(, );
    }];

}
/**
 *  结束取消
 */
-(void)motionCancelled:(UIEventSubtype)motion withEvent:(UIEvent *)event
{
    [UIView animateWithDuration:1.0 animations:^{

        self.topImage.transform = CGAffineTransformIdentity;
        self.bottomImage.transform = CGAffineTransformIdentity;

    } completion:^(BOOL finished) {

        [self.navigationController pushViewController:[[NextViewController alloc]init] animated:YES];
    }];
}
/**
 *  结束摇动
 */
-(void)motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event
{
   [UIView animateWithDuration:1.0 animations:^{

       self.topImage.transform = CGAffineTransformIdentity;
       self.bottomImage.transform = CGAffineTransformIdentity;

   } completion:^(BOOL finished) {

       [self.navigationController pushViewController:[[NextViewController alloc]init] animated:YES];
   }];

}
@end

3、测试的时候最好在真机上测试。

demo下载地址：https://github.com/fengzhihao123/FZHShake