下拉菜单

思路

1、图片的拉伸:
UIImage *image = [UIImage imageNamed:@popover_background];
        image = [image resizableImageWithCapInsets:UIEdgeInsetsMake(24, 0, 24, 0) resizingMode:UIImageResizingModeStretch];

-resizableImageWithCapInsets:resizingMode 方法的第二个参数,调整模式分为两种,平铺与拉伸。这里采用拉伸,可以保证背景的带箭头的框框按照内容大小正确地将其包围。

2、圆形过渡动画

具体实现方式可以参考这篇博客: iOS开发——圆形过渡动画。这里把代码摆上

    CGRect originalRect = CGRectMake(point.x, point.y, 1, 1);

    self.startPath = [UIBezierPath bezierPathWithOvalInRect:originalRect];

    CGPoint extremePoint = CGPointMake(point.x, point.y + contentView.frame.size.height);
    CGFloat radius = sqrtf(extremePoint.x * extremePoint.x + extremePoint.y * extremePoint.y);
    UIBezierPath *endPath = [UIBezierPath bezierPathWithOvalInRect:
                             CGRectInset(originalRect, -radius, -radius)];

    self.shapeLayer = [CAShapeLayer layer];
    self.shapeLayer.path = endPath.CGPath;
    self.layer.mask = self.shapeLayer;

    if (animated) {
        CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@path];
        animation.fromValue = (__bridge id)(self.startPath.CGPath);
        animation.toValue = (__bridge id)(endPath.CGPath);
        animation.duration = 0.3f;
        [self.shapeLayer addAnimation:animation forKey:@begin];
    }
3、其他

①view的层级关系:

主要有两个控件,contentView为用户传入的view,一般是一个表给,用户需要自己规定这个contentView的宽高。
另一个是imageView充当背景图片,同时该imageView会作为用户传入的contentView的容器,
整个控件为一个View,背景透明,做mask用,当菜单处于打开状态时用户点击背景会使菜单收回。
当用户传入contentView后,重设其原点,同时更新imageView的大小使其将整个contentView包围。
最后,将这个整体加到window中,保证菜单处于最上层。

②坐标系转换
由用户传入一个控件来决定该菜单显示在哪时,需要用到坐标系转换。关于坐标系转换,之前的博客中也有记录,在此留一个简单的结论:
[viewA convertRect:viewA.bounds toView:viewB]—得到viewA在viewB坐标系下的bounds。

③CAAnimationDelegate中区分多个animation对象

首先在添加animation时为其设置标志key:
[self.shapeLayer addAnimation:animation forKey:@end];
在代理方法中根据layer的方法拿:

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {

    if (anim == [self.shapeLayer animationForKey:@end]) {
        self.shapeLayer.path = self.startPath.CGPath;
        [self removeFromSuperview];
    }

}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值