标签：
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 ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
//添加底部View
CZBottomMenu *menu = [CZBottomMenu buttomMenu];
CGFloat menuX = 0;
CGFloat menuY = self.view.bounds.size.height - menu.bounds.size.height;
CGFloat menuW = self.view.bounds.size.width;
CGFloat menuH = menu.bounds.size.height;
menu.frame = CGRectMake(menuX, menuY, menuW, menuH);
[self.view addSubview:menu];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
CZBottomMenu.h
#import <UIKit/UIKit.h>
@interface CZBottomMenu : UIView
+(instancetype)buttomMenu;
@end
CZBottomMenu.m
//
// CZBottomMenu.m
// 8A07.底部旋转菜单
//
// Created by huan on 16/2/6.
// Copyright © 2016年 huanxi. All rights reserved.
//
#import "CZBottomMenu.h"
#define AnimationDuration 5
#define delta 90 //按钮间的间距
@interface CZBottomMenu()
/**
* Items存在三个隐藏的按钮
*/
@property (nonatomic, strong) NSMutableArray *itmes;
@property (weak, nonatomic) IBOutlet UIButton *mainBtn;
- (IBAction)mainBtnClick:(id)sender;
@end
@implementation CZBottomMenu
/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
// Drawing code
}
*/
-(NSMutableArray *)itmes{
if (!_itmes) {
_itmes = [NSMutableArray array];
}
return _itmes;
}
+(instancetype)buttomMenu{
//从bundle里加载xib
return [[[NSBundle mainBundle] loadNibNamed:@"CZBottomMenu" owner:nil options:nil]lastObject];
}
#pragma mark 对象是从xib/storyboard加载的时候，就好调用这个方法
-(id)initWithCoder:(NSCoder *)aDecoder{
if (self = [super initWithCoder:aDecoder]) {
[self initItems];
}
return self;
}
#pragma mark 初始化三个隐藏的按钮
-(void)initItems{
[self addBtnWithBgImage:@"menu_btn_call"tag:0];
[self addBtnWithBgImage:@"menu_btn_cheyou"tag:1];
[self addBtnWithBgImage:@"menu_btn_tixing"tag:2];
}
/**
* 通过一张图片来添加按钮
*/
-(void)addBtnWithBgImage:(NSString *)bgImage tag:(NSInteger)tag{
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
[btn setBackgroundImage:[UIImage imageNamed:bgImage] forState:UIControlStateNormal];
btn.tag = tag;
[self.itmes addObject:btn];
[self addSubview:btn];
}
#pragma mark 设置三个隐藏按钮的尺寸和位置
-(void)layoutSubviews{
//所有隐藏按钮的大小是一样的
CGRect btnBounds = CGRectMake(0, 0, 43, 43);
//遍历三个隐藏的按钮
for (UIButton * btn in self.itmes) {
btn.bounds = btnBounds;
btn.center = self.mainBtn.center;
}
//把“红色按钮”置顶
[self bringSubviewToFront:self.mainBtn];
}
- (IBAction)mainBtnClick:(id)sender {
BOOL show = CGAffineTransformIsIdentity(self.mainBtn.transform);
// 1.实现 按钮 动画效果
[UIView animateWithDuration:AnimationDuration animations:^{
if (show) {//代表transform未被改变
self.mainBtn.transform = CGAffineTransformMakeRotation(M_PI_4);
}else{//恢复
self.mainBtn.transform = CGAffineTransformIdentity;
}
}];
[self showItems:show];
}
-(void)showItems:(BOOL)show{
#warning 默认情况 按钮的中心与按钮的图层的position是一样
NSLog(@"主按钮中心点 %@", NSStringFromCGPoint(self.mainBtn.center));
NSLog(@"主按钮的图层的position %@", NSStringFromCGPoint(self.mainBtn.layer.position));
// 3.实现 items 的显示位置
for (UIButton *btn in self.itmes) {
#warning 一个按钮对应一个组动画
//2.创建动画
//2.1 创建组动画
CAAnimationGroup *group = [CAAnimationGroup animation];
group.duration = AnimationDuration;
//2.2 添加一个“平移动画”
CAKeyframeAnimation *positionAni = [CAKeyframeAnimation animation];
positionAni.keyPath = @"position";
//2.3 添加一个“旋转的动画”
CAKeyframeAnimation *rotationAni = [CAKeyframeAnimation animation];
rotationAni.keyPath = @"transform.rotation";
//重新设置每一个按钮的x值
CGFloat btnCenterX = self.mainBtn.center.x + (btn.tag + 1) * delta;
CGFloat btnCenterY = self.mainBtn.center.y;
// 最终显示的位置
CGPoint showPosition = CGPointMake(btnCenterX, btnCenterY);
//设置“平移动画”的路径
NSValue *value1 = [NSValue valueWithCGPoint:self.mainBtn.center];
NSValue *value2 = [NSValue valueWithCGPoint:CGPointMake(btnCenterX * 0.5, btnCenterY)];
NSValue *value3 = [NSValue valueWithCGPoint:CGPointMake(btnCenterX * 1.1, btnCenterY)];
NSValue *value4 = [NSValue valueWithCGPoint:showPosition];
//显示
if (show) {
positionAni.values = @[value1, value2, value3, value4];
//设置 旋转的路径
rotationAni.values = @[@0, @(M_PI * 2), @(M_PI * 4), @(M_PI * 2)];
btn.center = showPosition;
}else{
// 隐藏
//设置“平移动画”的路径
positionAni.values = @[value4, value3, value2, value1];
//设置 旋转的路径
rotationAni.values = @[@0, @(M_PI * 2), @0, @(-M_PI * 2)];
btn.center = self.mainBtn.center;
}
//添加子动画
group.animations = @[positionAni, rotationAni];
//执行组动画
[btn.layer addAnimation:group forKey:nil];
}
}
@end
CZBottomMenu.xib
结果
标签：
原文地址：http://www.cnblogs.com/Lu2015-10-03/p/5191359.html
