2016-1-10 组动画学习 底部旋转菜单的实现

#define detal 80;
// 按钮间距

#import "ZZMenuView.h"
@interface ZZMenuView()
@property (nonatomic, strong) NSMutableArray *items;
@property (weak, nonatomic) IBOutlet UIButton *mainBtn;

@end
@implementation ZZMenuView

/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
}
*/
- (NSMutableArray *)items
{
    if (!_items) {
        _items = [NSMutableArray array];
    }
    return _items;
}
+ (instancetype)MenuView
{
    return [[[NSBundle mainBundle] loadNibNamed:@"ZZMenu" owner:nil options:nil] lastObject];
}
#warning 对象是从xib storybord中加载时会调用这个方法
- (instancetype)initWithCoder:(NSCoder *)aDecoder
{
    if (self = [super initWithCoder:aDecoder]) {
        [self initItems];
    }
    return self;
}
// 初始化三个隐藏的按钮
- (void)initItems
{
//    NSLog(@"!!!!");
    [self addBtnWithImgName:@"menu_btn_call" tag:1];
    [self addBtnWithImgName:@"menu_btn_cheyou" tag:2];
    [self addBtnWithImgName:@"menu_btn_tixing" tag:3];

}
- (void) addBtnWithImgName:(NSString *)imgName tag:(NSInteger)tag
{
    UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
    [btn setBackgroundImage:[UIImage imageNamed:imgName] forState:UIControlStateNormal];
    btn.tag = tag;
    [self.items addObject:btn];
    [self addSubview:btn];
}
#pragma mark - 设置按钮尺寸位置
- (void)layoutSubviews
{
    [super layoutSubviews];
    CGRect btnRect = CGRectMake(0,0,30,30);
    for (UIButton *btn in self.items) {
        btn.bounds = btnRect;
        btn.center = self.mainBtn.center;
    }
//    [self bringSubviewToFront: self.mainBtn];

}
- (IBAction)mainBtnClick:(UIButton *)mainBtn {
    BOOL show = CGAffineTransformIsIdentity(self.mainBtn.transform);
    [UIView animateWithDuration:1 animations:^{
        if (show) {
            self.mainBtn.transform = CGAffineTransformMakeRotation(M_PI_4);
        }else{
            self.mainBtn.transform = CGAffineTransformIdentity;
        }
    }];
    [self showItems:show];
}
- (void)showItems:(BOOL)isShow
{

    if (isShow) {
    // 选项按钮位置调整
    for (UIButton *btn  in  self.items) {
        CGFloat centerX = self.mainBtn.center.x + btn.tag * detal;
        CGFloat centerY = self.mainBtn.center.y;
        CGPoint showPoint = CGPointMake(centerX, centerY);
        btn.center = showPoint;
        // 为每一个按钮都添加组动画
        CAAnimationGroup *groupAnimations = [CAAnimationGroup animation];
          // 创建平移动画
        CAKeyframeAnimation *transformAni =[CAKeyframeAnimation animation];
        transformAni.keyPath = @"position";
        NSValue *value1 = [NSValue valueWithCGPoint:self.mainBtn.center];
        NSValue *value2 = [NSValue valueWithCGPoint:CGPointMake(centerX*0.5, centerY)];
        NSValue *value3 = [NSValue valueWithCGPoint:CGPointMake(centerX*1.1,
                                                                centerY)];
        NSValue *value4 = [NSValue valueWithCGPoint:showPoint];
        // 设置平移路径
        transformAni.values = @[value1,value2,value3,value4];
         //创建旋转动画
        CAKeyframeAnimation *rotationAni = [CAKeyframeAnimation animation];
        rotationAni.keyPath = @"transform.rotation";
        rotationAni.values = @[@0,@(M_PI * 2),@(M_PI * 4),@(M_PI *2)];
        // 设置旋转路径
        groupAnimations.animations = @[transformAni,rotationAni];
        groupAnimations.duration =1.5;
        //给每一个按钮的图层都添加组动画
        [btn.layer addAnimation:groupAnimations forKey:nil];
        }
}else{
    for (UIButton *btn  in  self.items) {
        //获取现在的位置
        CGPoint currentPositon = btn.center;
        btn.center = self.mainBtn.center;
        CGFloat centerY  = self.mainBtn.center.y;
        btn.transform = CGAffineTransformIdentity;
        // 为每一个按钮都添加组动画
        CAAnimationGroup *groupAnimations = [CAAnimationGroup animation];
        // 创建平移动画
        CAKeyframeAnimation *transformAni =[CAKeyframeAnimation animation];
        transformAni.keyPath = @"position";
        NSValue *value2 = [NSValue valueWithCGPoint:CGPointMake(currentPositon.x*1.1, centerY)];
        NSValue *value1 = [NSValue valueWithCGPoint:currentPositon];
        NSValue *value3 = [NSValue valueWithCGPoint:CGPointMake(currentPositon.x*0.5,centerY)];
        NSValue *value4 = [NSValue valueWithCGPoint:self.mainBtn.center];
        // 设置平移路径
        transformAni.values = @[value1,value2,value3,value4];
        //创建旋转动画
        CAKeyframeAnimation *rotationAni = [CAKeyframeAnimation animation];
        rotationAni.keyPath = @"transform.rotation";
        rotationAni.values = @[@0,@(M_PI * 2),@0,@(-M_PI * 2)];
        // 设置旋转路径
        groupAnimations.animations = @[transformAni,rotationAni];
        groupAnimations.duration = 5;
        //给每一个按钮的图层都添加组动画
        [btn.layer addAnimation:groupAnimations forKey:nil];

    }
}

}
@end

时间: 2024-08-01 20:30:45

2016-1-10 组动画学习 底部旋转菜单的实现的相关文章

底部旋转菜单

Main.storyboard ViewController.m // //  ViewController.m //  8A07.底部旋转菜单 // //  Created by huan on 16/2/6. //  Copyright © 2016年 huanxi. All rights reserved. // #import "ViewController.h" #import "CZBottomMenu.h" @interface ViewControl

2016-1-10 组动画学习 动画实例

// // ViewController.m // 车晓迪demo // // Created by Mac on 16/1/11. // Copyright © 2016年 Mac. All rights reserved. // #import "ViewController.h" @interface ViewController () @property (weak, nonatomic) IBOutlet UIImageView *circleView; @end @impl

Core Animation中的组动画

实际开发中一个物体的运动往往是复合运动,单一属性的运动情况比较少,但恰恰属性动画每次进行动画设置时一次只能设置一个属性进行动画控制(不管是 基础动画还是关键帧动画都是如此),这样一来要做一个复合运动的动画就必须创建多个属性动画进行组合.对于一两种动画的组合或许处理起来还比较容易,但是 对于更多动画的组合控制往往会变得很麻烦,动画组的产生就是基于这样一种情况而产生的.动画组是一系列动画的组合,凡是添加到动画组中的动画都受控于动画 组,这样一来各类动画公共的行为就可以统一进行控制而不必单独设置,而且

android动画学习

android动画学习 转载自:http://www.open-open.com/lib/view/open1329994048671.html 3.0以前,android支持两种动画模式,tween animation,frame animation,在android3.0中又引入了一个新的动画系统:property animation,这三种动画模式在SDK中被称为property animation,view animation,drawable animation. 1. View An

iOS开发UI篇—核心动画(转场动画和组动画)

iOS开发UI篇—核心动画(转场动画和组动画) 一.转场动画简单介绍 CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果.iOS比Mac OS X的转场动画效果少一点 UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果 属性解析: type:动画过渡类型 subtype:动画过渡方向 startProgress:动画起点(在整体动画的百分比) endProgress:动画终点(在整体动画的百分比)

IOS开发核心动画篇—转场动画和组动画

iOS开发UI篇—核心动画(转场动画和组动画) 一.转场动画简单介绍 CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果.iOS比Mac OS X的转场动画效果少一点 UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果 属性解析: type:动画过渡类型 subtype:动画过渡方向 startProgress:动画起点(在整体动画的百分比) endProgress:动画终点(在整体动画的百分比)

Android动画学习——Tween Animation

目录 目录 Android动画学习 Tween Animation scale动画调节尺寸 alpha动画调节透明度 rotate动画旋转 translate动画平移 Android动画学习 android中动画分为3种: Tween Animation:通过对场景里的对象不断做图像变换(平移.缩放.旋转)产生的动画效果,即是一种渐变动画. Frame Animation:顺序播放事先做好的图像,是一种画面转换动画. Property Animation:属性动画,通过动态地改变对象的属性从而达

核心动画(转场动画和组动画)

核心动画(转场动画和组动画) 一.转场动画简单介绍 CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果.iOS比Mac OS X的转场动画效果少一点 UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果 属性解析: type:动画过渡类型 subtype:动画过渡方向 startProgress:动画起点(在整体动画的百分比) endProgress:动画终点(在整体动画的百分比) 二.转场动画代码

iOS开发UI篇—核心动画(转场动画和组动画)(转摘)

iOS开发UI篇—核心动画(转场动画和组动画) 一.转场动画简单介绍 CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果.iOS比Mac OS X的转场动画效果少一点 UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果 属性解析: type:动画过渡类型 subtype:动画过渡方向 startProgress:动画起点(在整体动画的百分比) endProgress:动画终点(在整体动画的百分比)