Interface design and design of the [edit] module of meitu xiuxiu beautifying pictures
Effect
Currently, the rotation and sharpening interfaces have not been done yet.
The editing module allows you to crop, rotate, and sharpen images.
1. Click "edit" on the beautification image homepage to go to the specific operation interface.
FWFunctionViewController *vc = [[FWFunctionViewController alloc] initWithImage:self.image type:FWBeautyProcessTypeEdit]; [self presentViewController:vc animated:YES completion:^{ }]; [vc displayEditPage];
2. Configure the image to be processed
UIImage *img = [UIImage scaleImage:self.image targetWidth:WIDTH]; CGFloat x = 0; CGFloat y = 0; //HEIGHT - 115 if (img.size.height > HEIGHT - 115) { img = [UIImage scaleImage:img targetHeight:HEIGHT - 115]; x = WIDTH / 2 - img.size.width /2; } else { y =( HEIGHT - 115) / 2 - img.size.height / 2; } self.imageView.image = img; self.imageView.frame = CGRectMake(x, y, img.size.width, img.size.height);
3. Configure bar
self.styleBar.frame = CGRectMake(100, HEIGHT - 55, 160, 55); autoDict = [[FWCommonTools getPlistDictionaryForButton] objectForKey:@"Edit"]; NSArray *normalImageArr = [autoDict objectForKey:@"normalImages"]; NSArray *hightlightedImageArr = [autoDict objectForKey:@"HighlightedImages"]; NSArray *textArr = [autoDict objectForKey:@"Texts"]; NSMutableArray *arr = [[NSMutableArray alloc] initWithCapacity:0]; for (int i = 0; i < [textArr count]; i++) { FWEffectBarItem *item = [[FWEffectBarItem alloc] initWithFrame:CGRectZero]; [item setFinishedSelectedImage:[UIImage imageNamed:[hightlightedImageArr objectAtIndex:i]] withFinishedUnselectedImage:[UIImage imageNamed:[normalImageArr objectAtIndex:i]] ]; item.title = [textArr objectAtIndex:i]; [arr addObject:item]; } self.styleBar.items = arr; self.styleBar.effectBardelegate = self; [self.styleBar setSelectedItem:[self.styleBar.items objectAtIndex:0]]; [self.view addSubview:self.styleBar]; [self effectBar:self.styleBar didSelectItemAtIndex:0];
Iv. Configuration button
UIButton * btnReset = [UIButton buttonWithType: UIButtonTypeSystem]; [btnReset setTitle: @ "reset" forState: UIControlStateNormal]; btnReset. frame = CGRectMake (30, HEIGHT-95, 50, 30); [btnReset. titleLabel setFont: [UIFont systemFontOfSize: 12.0]; [btnReset setTitleColor: [UIColor whiteColor] forState: UIControlStateNormal]; btnReset. layer. borderWidth = 0.5; btnReset. layer. cornerRadius = 15.0; btnReset. layer. borderColor = [UIColor whiteColor]. CGColor; btnReset. backgroundColor = [UIColor colorWithRed: 26/255 .0 green: 26/255 .0 blue: 26/255 .0 alpha: 0.8]; [self. view addSubview: btnReset]; UIButton * btnScaleType = [UIButton buttonWithType: Variable]; [btnScaleType setTitle: @ "proportion: Free" forState: Variable]; [btnScaleType setTitleColor: [UIColor whiteColor] forState: UIControlStateNormal]; btnScaleType. frame = CGRectMake (100, HEIGHT-95, 80, 30); [btnScaleType. titleLabel setFont: [UIFont systemFontOfSize: 12.0]; btnScaleType. layer. borderWidth = 0.5; btnScaleType. layer. cornerRadius = 15.0; btnScaleType. layer. borderColor = [UIColor whiteColor]. CGColor; [btnScaleType addTarget: self action: @ selector (scaleTypeClick :) forControlEvents: UIControlEventTouchUpInside]; [self. view addSubview: btnScaleType]; UIButton * btnConfirm = [UIButton buttonWithType: UIButtonTypeSystem]; btnConfirm. backgroundColor = [UIColor blueColor]; [btnConfirm setImage: [UIImage imageNamed: @ "icon_clip_confim@2x.png"] withTitle: @ "Confirm crop" forState: UIControlStateNormal]; [btnConfirm setTitleColor: [UIColor whiteColor] forState: UIControlStateNormal]; btnConfirm. layer. cornerRadius = 15.0; btnConfirm. frame = CGRectMake (240, HEIGHT-95, 90, 30); [self. view addSubview: btnConfirm]; self. imageView. hidden = YES; self. cropView = [[FWCropView alloc] initWithFrame: self. imageView. frame]; [self. cropView setImage: self. image]; [self. view addSubview: self. cropView]; [self. imageView removeFromSuperview];
V. Configure the cropping ratio View
self.scaleScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, HEIGHT - 55 - 10 - 30 - 10 - 52, WIDTH, 52)]; self.scaleScrollView.contentSize = CGSizeMake(WIDTH * 1.5, 52); self.scaleScrollView.bounces = NO; self.scaleScrollView.backgroundColor = [UIColor colorWithRed:26 / 255.0 green:26/ 255.0 blue:26/ 255.0 alpha:0.8]; self.scaleScrollView.alpha = 0.9; self.scaleScrollView.showsHorizontalScrollIndicator = YES; NSDictionary *dict = [[FWCommonTools getPlistDictionaryForButton] objectForKey:@"scaleMode"]; NSArray *normalImageArr = [dict objectForKey:@"normalImages"]; NSArray *hightlightedImageArr = [dict objectForKey:@"HighlightedImages"]; NSArray *textArr = [dict objectForKey:@"Texts"]; CGFloat beginX = 20.0; CGFloat width = 30; CGFloat height = 48; CGFloat margin = 50; FWEffectBarItem *item = nil; for (int i = 0; i < [normalImageArr count]; i++) { item = [[FWEffectBarItem alloc] initWithFrame:CGRectMake(beginX + i * (margin + width), 2, width, height)]; [item setFinishedSelectedImage:[UIImage imageNamed:[hightlightedImageArr objectAtIndex:i]] withFinishedUnselectedImage:[UIImage imageNamed:[normalImageArr objectAtIndex:i]]]; item.title = [textArr objectAtIndex:i]; [self.scaleScrollView addSubview:item]; } [self.view addSubview:self.scaleScrollView];
Download Project