前阵子工作不忙,正好自己又想要做图片和文字的混编，虽然知道类似的软件有很多，但是因为平时几乎只用原生的相机，所以对五花八门的相机也不了解，所以就想着自己来实现这个功能。
这个功能的设计思路版本是：
1.最开始只打算加一张图片和一段文字，所以就很死板，都是固定好的，没什么新意；
2.后来想着一张图片一段文字的固定格式，还是觉得不人性化，就想着任由使用者随意添加图片和文字，并且如果第一个添加的控件是textview，就默认文本居中，类似标题的存在；
3.第2个功能实现后，有一天晚上编辑图片给朋友的时候，发现一旦添加好不想要了就得重新开头做，然后就想着再添加个可以删除imageview和textview的功能，并且imageview可以修改图片；
4.做完第三个功能后，觉得大致实现了，然后突然想到我可以再添加一个拖动textview改变页面布局的功能；
5.增加了添加输入框前先选择文本对齐方式的功能；
6.完成。
最终效果预览
点击此处预览
textview相关
textview的相关操作gif图
//文本按钮
-(UIButton *)textButton{
if (_textButton==nil) {
_textButton=[UIButton buttonWithType:UIButtonTypeCustom];
[_textButton setImage:[UIImage imageNamed:@"text"] forState:UIControlStateNormal];
_textButton.layer.cornerRadius=25;
_textButton.layer.masksToBounds=YES;
_textButton.backgroundColor=[UIColor whiteColor];
[_textButton addTarget:self action:@selector(textButtonAction) forControlEvents:UIControlEventTouchUpInside];
}
return _textButton;
}
//文本按钮事件
-(void)textButtonAction{
self.chooseAlignmentView.hidden=NO;
}
//选择文本对齐方式view
-(UIView *)chooseAlignmentView{
if (_chooseAlignmentView==nil) {
_chooseAlignmentView=[[UIView alloc]initWithFrame:CGRectMake([UIScreen mainScreen].bounds.size.width-145, self.textButton.frame.origin.y, 170, 50)];
_chooseAlignmentView.layer.cornerRadius=25;
_chooseAlignmentView.layer.masksToBounds=YES;
_chooseAlignmentView.layer.borderColor=[[UIColor whiteColor] CGColor];
_chooseAlignmentView.layer.borderWidth=2;
_chooseAlignmentView.backgroundColor=[UIColor colorWithRed:253/255.0 green:163/255.0 blue:155/255.0 alpha:1];
//创建文本左对齐textview
UIButton *leftButton=[UIButton buttonWithType:UIButtonTypeCustom];
leftButton.backgroundColor=[UIColor colorWithRed:253/255.0 green:163/255.0 blue:155/255.0 alpha:1];
[leftButton setImage:[UIImage imageNamed:@"left"] forState:UIControlStateNormal];
leftButton.layer.cornerRadius=20;
leftButton.layer.masksToBounds=YES;
leftButton.tag=1000;
[leftButton addTarget:self action:@selector(alignButtonAction:) forControlEvents:UIControlEventTouchUpInside];
//创建文本居中对齐的textview
UIButton *centerButton=[UIButton buttonWithType:UIButtonTypeCustom];
centerButton.layer.cornerRadius=20;
centerButton.layer.masksToBounds=YES;
centerButton.backgroundColor=[UIColor colorWithRed:253/255.0 green:163/255.0 blue:155/255.0 alpha:1];
[centerButton setImage:[UIImage imageNamed:@"center"] forState:UIControlStateNormal];
centerButton.tag=2000;
[centerButton addTarget:self action:@selector(alignButtonAction:) forControlEvents:UIControlEventTouchUpInside];
//取消创建textview
UIButton *cancelButton=[UIButton buttonWithType:UIButtonTypeCustom];
cancelButton.layer.cornerRadius=20;
cancelButton.layer.masksToBounds=YES;
cancelButton.backgroundColor=[UIColor colorWithRed:253/255.0 green:163/255.0 blue:155/255.0 alpha:1];
[cancelButton setImage:[UIImage imageNamed:@"cancel1"] forState:UIControlStateNormal];
cancelButton.tag=3000;
[cancelButton addTarget:self action:@selector(cancelButtonAction) forControlEvents:UIControlEventTouchUpInside];
leftButton.frame=CGRectMake(25, 5, 40, 40);
[_chooseAlignmentView addSubview:leftButton];
centerButton.frame=CGRectMake(65, 5, 40, 40);
[_chooseAlignmentView addSubview:centerButton];
cancelButton.frame=CGRectMake(105, 5, 40, 40);
[_chooseAlignmentView addSubview:cancelButton];
_chooseAlignmentView.hidden=YES;
}
return _chooseAlignmentView;
}
-(void)cancelButtonAction{
self.chooseAlignmentView.hidden=YES;
}
-(void)alignButtonAction:(UIButton *)button{
UITextView * textview=[UITextView new];
textview.layer.borderColor=[UIColor redColor].CGColor;
textview.layer.borderWidth=2;
textview.delegate=self;
textview.text=@"";
textview.backgroundColor=[UIColor clearColor];
textview.font=[UIFont fontWithName:@"FZJLJW--GB1-0" size:26];
self.toolBarView.frame=CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 44);
textview.inputAccessoryView=self.toolBarView;
//给textview添加长按手势
UILongPressGestureRecognizer *longPress=[[UILongPressGestureRecognizer alloc]initWithTarget:self action:@selector(longTap:)];
[textview addGestureRecognizer:longPress];
//给textview添加拖拽手势
UIPanGestureRecognizer *ges=[[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panAction:)];
[textview addGestureRecognizer:ges];
if (self.totalViewsCount==0) {
//如果创建的该textview是创建的第一个控件的布局
textview.frame=CGRectMake(8, 8, [UIScreen mainScreen].bounds.size.width-16, 80);
if (button.tag==1000) {
textview.textAlignment=NSTextAlignmentLeft;
}else{
textview.textAlignment=NSTextAlignmentCenter;
}
}else{
//如果创建的该textview不是第一个控件的布局，lastview记录的是该页面的最后一个控件
textview.frame=CGRectMake(8, self.lastView.frame.origin.y+self.lastView.frame.size.height+8, [UIScreen mainScreen].bounds.size.width-16, 80);
if (button.tag==1000) {
textview.textAlignment=NSTextAlignmentLeft;
}else{
textview.textAlignment=NSTextAlignmentCenter;
}
}
[self cellAddSubview:textview];
self.chooseAlignmentView.hidden=YES;
}
-(void)cellAddSubview:(UIView *)view{
UITableViewCell *cell=[self.tableview cellForRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:0]];
[self.totalViewArr addObject:view];
self.lastView=view;
self.totalViewsCount++;
view.tag=930+self.totalViewArr.count;
[cell.contentView addSubview:view];
self.cellHeight=self.lastView.frame.origin.y+self.lastView.frame.size.height+13;
[self.tableview reloadData];
}
//长按textview选择是否删除
-(void)longTap:(UITapGestureRecognizer *)ges{
UIAlertController *alertVC=[UIAlertController alertControllerWithTitle:@"确定删除吗" message:nil preferredStyle:UIAlertControllerStyleAlert];
[alertVC addAction:[UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
}]];
[alertVC addAction:[UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
self.changedTextview=(UITextView *)ges.view;
//从self.totalViewArr中删除需要删除的textview
NSMutableArray *tmp=[NSMutableArray array];
for (UIView *view in self.totalViewArr) {
if (view.tag==self.changedTextview.tag) {
}else{
[tmp addObject:view];
}
}
self.totalViewArr=[NSMutableArray arrayWithArray:tmp];
//给self.totalViewArr中的控件重新赋tag值
for (UIView *view in self.totalViewArr) {
NSInteger index=[self.totalViewArr indexOfObject:view];
view.tag=931+index;
}
[self reLayoutSubviewsInCell:self.changedTextview];
}]];
[self presentViewController:alertVC animated:YES completion:^{
}];
}
//重新布局tableviewcell中的子控件
-(void)reLayoutSubviewsInCell:(UIView *)changedView{
UITableViewCell *cell=[self.tableview cellForRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:0]];
NSArray *views=cell.contentView.subviews;
for (int i=0; i=0) {
NSMutableArray *tmp=[NSMutableArray array];
//往下
for (int i=(int)gesview.tag-930; iview.center.y ) {
//ok
if (self.totalViewArr.count==2) {
UIView *last=[self.totalViewArr lastObject];
CGRect rect=last.frame;
last.frame=CGRectMake(rect.origin.x,gesview.frame.origin.y ,rect.size.width , rect.size.height);
gesview.frame=CGRectMake(gesview.frame.origin.x, last.frame.size.height+last.frame.origin.y+8, gesview.frame.size.width, gesview.frame.size.height);
[tmp addObject:last];
[tmp addObject:gesview];
[self breakFor:tmp];
break;
}else{
//ok
if (gesview.tag==931) {
for (int j=1; jview.center.y && gesview.center.y+point.y imageview相关
-(UIButton *)pictureButton{
if (_pictureButton==nil) {
_pictureButton=[UIButton buttonWithType:UIButtonTypeCustom];
[_pictureButton setImage:[UIImage imageNamed:@"picture"] forState:UIControlStateNormal];
_pictureButton.layer.cornerRadius=25;
_pictureButton.layer.masksToBounds=YES;
_pictureButton.backgroundColor=[UIColor whiteColor];
[_pictureButton addTarget:self action:@selector(pictureButtonAction) forControlEvents:UIControlEventTouchUpInside];
}
return _pictureButton;
}
//点击图片按钮选择拍照还是相册
-(void)pictureButtonAction{
UIAlertController *alertVC=[UIAlertController alertControllerWithTitle:nil message:nil preferredStyle:UIAlertControllerStyleActionSheet];
[alertVC addAction:[UIAlertAction actionWithTitle:@"相册" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
UIImagePickerController *vc=[[UIImagePickerController alloc]init];
vc.delegate=self;
vc.sourceType=UIImagePickerControllerSourceTypePhotoLibrary;
vc.allowsEditing=YES;
vc.videoQuality=UIImagePickerControllerQualityTypeHigh;
[self presentViewController:vc animated:YES completion:^{
}];
}]];
[alertVC addAction:[UIAlertAction actionWithTitle:@"拍照" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
UIImagePickerController *vc=[[UIImagePickerController alloc]init];
vc.delegate=self;
vc.sourceType=UIImagePickerControllerSourceTypeCamera;
vc.allowsEditing=YES;
vc.videoQuality=UIImagePickerControllerQualityTypeHigh;
[self presentViewController:vc animated:YES completion:^{
}];
}]];
[alertVC addAction:[UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
}]];
[self presentViewController:alertVC animated:YES completion:^{
}];
}
//图片选择完成后的操作
-(void)imagePickerController:(UIImagePickerController )picker didFinishPickingMediaWithInfo:(NSDictionary )info{
NSLog(@"%@",info);
UIImage *img=[info objectForKey:@"UIImagePickerControllerEditedImage"];
//UIImage *img=[info objectForKey:@"UIImagePickerControllerOriginalImage"];
CGSize size=img.size;
if (self.createOrNot==YES) {
UIImageView * imageview1=[UIImageView new];
imageview1.layer.cornerRadius=10;
imageview1.layer.masksToBounds=YES;
imageview1.layer.borderColor=[UIColor whiteColor].CGColor;
imageview1.layer.borderWidth=6;
imageview1.userInteractionEnabled=YES;
imageview1.image=img;
UITapGestureRecognizer *tap=[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(change:)];
[imageview1 addGestureRecognizer:tap];
if (self.totalViewsCount==0) {
if (size.width>[UIScreen mainScreen].bounds.size.width) {
imageview1.frame=CGRectMake(6, 8, [UIScreen mainScreen].bounds.size.width-12, size.height*([UIScreen mainScreen].bounds.size.width-12)/size.width);
}else{
imageview1.frame=CGRectMake([UIScreen mainScreen].bounds.size.width/2.0-size.width/2.0, 8,size.width, size.height);
}
}else{
if (size.width>[UIScreen mainScreen].bounds.size.width) {
imageview1.frame=CGRectMake(6, self.lastView.frame.origin.y+self.lastView.frame.size.height+8, [UIScreen mainScreen].bounds.size.width-12, size.height*([UIScreen mainScreen].bounds.size.width-12)/size.width);
}else{
imageview1.frame=CGRectMake([UIScreen mainScreen].bounds.size.width/2.0-size.width/2.0, self.lastView.frame.origin.y+self.lastView.frame.size.height+8,size.width, size.height);
}
}
[self cellAddSubview:imageview1];
}else{
self.needChangedImageview.image=img;
self.createOrNot=YES;
}
[picker dismissViewControllerAnimated:YES completion:^{
}];
}
//点击图片进行修改或删除
-(void)change:(UITapGestureRecognizer *)ges{
UIAlertController *alertVC=[UIAlertController alertControllerWithTitle:nil message:nil preferredStyle:UIAlertControllerStyleActionSheet];
[alertVC addAction:[UIAlertAction actionWithTitle:@"改变图片" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
self.createOrNot=NO;
self.needChangedImageview=(UIImageView *)ges.view;
[self pictureButtonAction];
}]];
[alertVC addAction:[UIAlertAction actionWithTitle:@"删除图片" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
UIImageView *imageview=(UIImageView *)ges.view;
self.changedImageView=imageview;
NSMutableArray *tmp=[NSMutableArray array];
for (UIView *view in self.totalViewArr) {
if (view.tag==imageview.tag) {
}else{
[tmp addObject:view];
}
}
self.totalViewArr=[NSMutableArray arrayWithArray:tmp];
for (UIView *view in self.totalViewArr) {
NSInteger index=[self.totalViewArr indexOfObject:view];
view.tag=931+index;
}
[self reLayoutSubviewsInCell:self.changedImageView];
}]];
[alertVC addAction:[UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
}]];
[self presentViewController:alertVC animated:YES completion:^{
}];
}
tableview相关
-(UITableView *)tableview{
if (_tableview==nil) {
_tableview=[[UITableView alloc]init];
_tableview.separatorStyle=UITableViewCellSeparatorStyleNone;
_tableview.delegate=self;
_tableview.dataSource=self;
}
return _tableview;
}
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
return 1;
}
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return 1;
}
-(UITableViewCell )tableView:(UITableView )tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
static NSString *cellid=@"cellid";
UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:cellid];
if (cell==nil) {
cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellid];
cell.selectionStyle=UITableViewCellSelectionStyleNone;
cell.backgroundColor=[UIColor colorWithRed:arc4random()%6/255.0 green:arc4random()%6/255.0 blue:arc4random()%6/255.0 alpha:1];
self.tableview.backgroundColor=cell.backgroundColor;
}
return cell;
}
-(CGFloat)tableView:(UITableView )tableView heightForRowAtIndexPath:(NSIndexPath )indexPath{
return self.cellHeight;
}
随机改变背景颜色
-(UIButton *)colorButton{
if (_colorButton==nil) {
_colorButton=[UIButton buttonWithType:UIButtonTypeCustom];
_colorButton.backgroundColor=[UIColor whiteColor];
[_colorButton setImage:[UIImage imageNamed:@"color"] forState:UIControlStateNormal];
_colorButton.layer.cornerRadius=25;
_colorButton.layer.masksToBounds=YES;
[_colorButton addTarget:self action:@selector(colorButtonAction) forControlEvents:UIControlEventTouchUpInside];
}
return _colorButton;
}
//随机改变背景颜色
-(void)colorButtonAction{
UITableViewCell *cell=[self.tableview cellForRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:0]];
cell.backgroundColor=[UIColor colorWithRed:arc4random()%6/255.0 green:arc4random()%6/255.0 blue:arc4random()%6/255.0 alpha:1];
self.tableview.backgroundColor=cell.backgroundColor;
}
保存图片到手机
-(UIButton *)saveButton{
if (_saveButton==nil) {
_saveButton=[UIButton buttonWithType:UIButtonTypeCustom];
_saveButton.backgroundColor=[UIColor whiteColor];
[_saveButton setImage:[UIImage imageNamed:@"finish"] forState:UIControlStateNormal];
_saveButton.layer.cornerRadius=25;
_saveButton.layer.masksToBounds=YES;
[_saveButton addTarget:self action:@selector(saveButtonAction) forControlEvents:UIControlEventTouchUpInside];
}
return _saveButton;
}
-(void)saveButtonAction{
UITableViewCell *cell=[self.tableview cellForRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:0]];
for (UIView *view in [cell.contentView subviews]) {
if ([view isKindOfClass:[UITextView class]]) {
UITextView *textview=(UITextView *)view;
textview.layer.borderWidth=0;
}
}
UIImageWriteToSavedPhotosAlbum([self convertViewToImage:cell], self, @selector(image:didFinishSavingWithError:contextInfo:), nil);
}
//view转为image
-(UIImage )convertViewToImage:(UIView )v{
CGSize s=v.bounds.size;
UIGraphicsBeginImageContextWithOptions(s, NO, [UIScreen mainScreen].scale);
[v.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *image=UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return image;
}
//保存结束后的回调
-(void)image:(UIImage )image didFinishSavingWithError:(NSError )error contextInfo:(void *)contextInfo{
if(error == nil) {
NSLog(@"success");
}else{
NSLog(@"fail");
}
}
好了 ，差不多就是这些了，欢迎指教。