参考了网上几个类似做法
很简单的写了一个类似新浪一个弹出选择的sheetItem动画
下面就把这个动画的大概思路说一下
-
一.自定义一个带image,title以及标签的button
//用到了一个缩放 -(void)initIBeaconAnimate{ CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"]; animation.duration = 0.5; animation.repeatCount = 1; animation.autoreverses = YES; animation.fromValue = [NSNumber numberWithFloat:1.0]; animation.toValue = [NSNumber numberWithFloat:1.1]; [self.layer addAnimation:animation forKey:@"scale-layer"]; } //button的点击事件通过block调用 -(void)addTapClick { if (self.didSelctedItemCompleted) { self.didSelctedItemCompleted(self.menuItem); } }
-
二.定义一个可以调用的item
//包含title,图片的名称 以及每个button的标签 - (instancetype)initWithTitle:(NSString *)title iconName:(NSString *)iconName index:(NSUInteger)index;
三.绘制MenuView
1.创建button的时候的布局
这里的布局调用了一个网上的一个方法,感觉不错,嫖来用一用
- (CGRect)getFrameWithItemCount:(NSInteger)itemCount
perRowItemCount:(NSInteger)perRowItemCount
perColumItemCount:(NSInteger)perColumItemCount
itemWidth:(CGFloat)itemWidth
itemHeight:(NSInteger)itemHeight
paddingX:(CGFloat)paddingX
paddingY:(CGFloat)paddingY
atIndex:(NSInteger)index
onPage:(NSInteger)page
{
//
NSUInteger rowCount = itemCount / perRowItemCount + (itemCount % perColumItemCount > 0 ? 1 : 0);
//计算每个空间的Y
CGFloat insetY = (CGRectGetHeight(self.bounds) - (itemHeight + paddingY) * rowCount) -200;
CGFloat originY = ((index / perRowItemCount) - perColumItemCount * page) * (itemHeight + paddingY) + paddingY;
//计算每个控件的x
CGFloat originX = (index % perRowItemCount) * (itemWidth + paddingX) + paddingX + (page * CGRectGetWidth(self.bounds));
CGRect itemFrame = CGRectMake(originX, originY + insetY, itemWidth, itemHeight);
return itemFrame;
}
2.显示button的时候弹性动画,(很简单)
- (void)initailzerAnimationWithToPostion:(CGRect)toRect withView:(UIView *)view beginTime:(CFTimeInterval)beginTime {
//一个点到另一个点的动画
[UIView animateWithDuration:1.0 delay:beginTime usingSpringWithDamping:0.6 initialSpringVelocity:1.0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
view.frame = toRect;
} completion:^(BOOL finished) {
}];
}
3.for循环,显示和消失button(具体的代码 看demo)