IOS development-encapsulate your own drop-down menu

IOS development-encapsulate your own drop-down menu

Idea 1. Image stretching:

UIImage *image = [UIImage imageNamed:@popover_background];        image = [image resizableImageWithCapInsets:UIEdgeInsetsMake(24, 0, 24, 0) resizingMode:UIImageResizingModeStretch];

-resizableImageWithCapInsets:resizingModeThe second parameter of the method. There are two adjustment modes: Tile and stretch. Stretch is used here to ensure that the box with arrows in the background is properly surrounded by the content size.

2. Circular transition Animation

For specific implementation methods, refer to this blog: iOS development-circular transition animation. Put the code here

    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. Others

① Hierarchical relationship of view:

There are two main controls: contentView is the view imported by the user, usually a table, the user needs to specify the width and height of this contentView.
The other is that the imageView acts as the background image, and the imageView serves as the container for the contentView that you pass in,
The entire control is a View with transparent background and is used as a mask. When the menu is open, clicking the background will reclaim the menu.
After the user passes in the contentView, reset its origin and update the size of the imageView to enclose the entire contentView.
Finally, add the entire menu to the window to ensure that the menu is at the top.

② Coordinate System Conversion
When you pass in a control to determine where the menu is displayed, you need to use Coordinate System Conversion. There are also records on Coordinate System Conversion in previous blogs. Here is a simple conclusion:
[ViewA convertRect: viewA. bounds toView: viewB]-Get the bounds of viewA in the viewB coordinate system.

③ CAAnimationDelegate multiple animation objects in the Central Region

First, set the flag key when adding animation:
[self.shapeLayer addAnimation:animation forKey:@end];
In the proxy method, use the following method:

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {    if (anim == [self.shapeLayer animationForKey:@end]) {        self.shapeLayer.path = self.startPath.CGPath;        [self removeFromSuperview];    }}