iOS開發之實現自定義浮動操作框效果
阿新 • • 發佈:2021-06-24
今天有個需求是如上圖實現類似微信的自定義浮動操作框效果
我自己就寫了個demo,大家感興趣的可以試試,下面是程式碼
VC程式碼如下
#import "TestCustomMenuItemVC.h" #import "CustomMenuItemView.h" @interface TestCustomMenuItemVC () /** 移動檢視,給這個檢視來新增浮動窗*/ @property (strong, nonatomic) UIView *moveView; @end @implementation TestCustomMenuItemVC - (UIView *)moveView { if (_moveView == nil) { _moveView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 30)]; _moveView.backgroundColor = [UIColor greenColor]; [self.view addSubview:_moveView]; } return _moveView; } - (void)viewDidLoad { [super viewDidLoad]; } - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event { //解析出隨機點選頁面的座標 UITouch *touch = touches.anyObject; CGPoint point = [touch locationInView:self.view]; NSLog(@"point x-%@ y-%@", @(point.x), @(point.y)); //隨機改變移動檢視寬高 NSInteger width = 50 + arc4random() % 200; NSInteger height = 20 + arc4random() %80; NSInteger ox = point.x - width/2; NSInteger oy = point.y - height/2; //對越界判斷處理 if (ox < 10) { ox = 10; } else if (ox > self.view.bounds.size.width - 10 - width) { ox = self.view.bounds.size.width - 10 - width; } if (oy < 30) { oy = 30; } self.moveView.frame = CGRectMake(ox, oy, width, height); //新增浮動窗 CustomMenuItemView *view = [[CustomMenuItemView alloc] init]; [view showInView:self.view frame:self.moveView.frame]; } @end
自定義浮動框檢視類如下CustomMenuItemView.h
#import <UIKit/UIKit.h> @interface CustomMenuItemView : UIView - (void)showInView:(UIView *)view frame:(CGRect)rect; @end
CustomMenuItemView.m
#import "CustomMenuItemView.h" @implementation CustomMenuItemView - (void)showInView:(UIView *)view frame:(CGRect)rect { self.frame = view.bounds; [view addSubview:self]; NSInteger jiantouSize = 10; NSInteger width = 250; NSInteger height = 120; UIView *bgview = [[UIView alloc] initWithFrame:CGRectMake(0, 0, width, height)]; bgview.backgroundColor = [UIColor darkGrayColor]; bgview.layer.masksToBounds = YES; bgview.layer.cornerRadius = 6; [self addSubview:bgview]; UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, jiantouSize, jiantouSize)]; imageView.image = [UIImage imageNamed:@"down"]; [self addSubview:imageView]; NSInteger ox = rect.origin.x + rect.size.width/2 - width/2; NSInteger oy = rect.origin.y - height/2 - jiantouSize - height/2; NSInteger jiantouCenterY = rect.origin.y - jiantouSize/2; if (oy <= 50) { imageView.transform = CGAffineTransformRotate(imageView.transform, M_PI); oy = rect.origin.y + rect.size.height + jiantouSize; jiantouCenterY = rect.origin.y + rect.size.height + jiantouSize/2; } if (oy > view.bounds.size.height - jiantouSize - height - 10) { oy = view.bounds.size.height - height - 10; jiantouCenterY = view.bounds.size.height - jiantouSize/2 - height - 10; } if (ox <= 10) { ox = 10; } else if (ox >= view.bounds.size.width - 10 - width) { ox = view.bounds.size.width - 10 - width; } bgview.frame = CGRectMake(ox, oy, width, height); imageView.center = CGPointMake(rect.origin.x + rect.size.width/2, jiantouCenterY); } - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event { self.hidden = YES; self.removeFromSuperview; } @end