請支持原創(chuàng), 如需轉(zhuǎn)載, 請注明出處@TEASON
先把代碼貼上來,https://github.com/Akateason/XTPaster歡迎follow和star
XTPaster.gif
貼紙功能出現(xiàn)在很多圖片社交中, 就是圖片上面貼圖片, 對貼紙而言就是需要控制貼紙的位置,旋轉(zhuǎn),大小, 說到底是處理gesture,transform,frame, 如果需要多張貼紙, 需要考慮增加刪除和正在操作的對象 , 你的腦海中需要對這些東西有個了解.
鋪墊做到這里, github下載代碼, 集成方式如下
1.把Paster文件夾放到你的項目中
2.把UIImage+AddFunction類目放到你的項目中
主要邏輯在這兩個類
XTPasterStageView和XTPasterView
1.XTPasterStageView是畫布View,用來放需要被加工的圖片,是主舞臺,用來管理貼紙list,貼紙的新增和刪除, 保存退出等
2.XTPasterView是貼紙類. 手勢或點擊控制旋轉(zhuǎn),位置,大小等
調(diào)用方式
1.new
_stageView = [[XTPasterStageView alloc] initWithFrame:rectImage] ;
_stageView.originImage = self.imageWillHandle ; // 需要被貼紙加工的圖片
_stageView.backgroundColor = [UIColor whiteColor] ;
[self.view addSubview:_stageView] ;
2.add paster
[_stageView addPasterWithImg:image] ;
如果你只想使用的話, 看到上面足矣 .
下面的部分從宏觀和細節(jié)兩個角度大概講一下我個人實現(xiàn)的思路 .
大方向思路
- pasterID , 用一個自增的id來控制內(nèi)存里的貼紙唯一
- XTPasterStageView管理多張貼紙 , XTPasterView中設(shè)置delegate在XTPasterStageView中回調(diào)控制新增和刪除
- 多張貼紙需要判斷哪一張在操作中, 所以貼紙類需要一個bool狀態(tài)
isOnFirst來控制是否正在操作.
@interface XTPasterStageView : UIView
@property (nonatomic,strong) UIImage *originImage ;//原圖
- (instancetype)initWithFrame:(CGRect)frame ;
- (void)addPasterWithImg:(UIImage *)imgP ;//加貼紙
- (UIImage *)doneEdit ;//完成保存
@end
#import <UIKit/UIKit.h>
#import "XTPasterStageView.h"
@class XTPasterView ;
@protocol XTPasterViewDelegate <NSObject>
- (void)makePasterBecomeFirstRespond:(int)pasterID ; //切換控制正在操作哪一張貼紙
- (void)removePaster:(int)pasterID ; //刪除某張
@end
@interface XTPasterView : UIView
@property (nonatomic,strong) UIImage *imagePaster ; //img resource
@property (nonatomic) int pasterID ;
@property (nonatomic) BOOL isOnFirst ; //是否正在操作
@property (nonatomic,weak) id <XTPasterViewDelegate> delegate ;
- (instancetype)initWithBgView:(XTPasterStageView *)bgView
pasterID:(int)pasterID
img:(UIImage *)img ;
- (void)remove ;
@end
細節(jié)思路
上面給出.h的外部Api只和需求有關(guān), 并把只和自己有關(guān)的細節(jié)放在.m里面
比如說變形按鈕, 刪除按鈕, 拖動等等, 這些都是控制單張貼紙操作的細節(jié) .
有以下幾點需要注意:
- 變形按鈕: 實現(xiàn)縮放和旋轉(zhuǎn)
- 拖動: 手勢 ,控制相對位移
- 刪除按鈕: 刪除在舞臺上正在操作的貼紙
#define PASTER_SLIDE 150.0
#define FLEX_SLIDE 15.0
#define BT_SLIDE 30.0
#define BORDER_LINE_WIDTH 1.0
#define SECURITY_LENGTH 75.0
@interface XTPasterView ()
{
CGFloat minWidth;
CGFloat minHeight;
CGFloat deltaAngle;
CGPoint prevPoint;
CGPoint touchStart;
CGRect bgRect ;
}
@property (nonatomic,strong) UIImageView *imgContentView ;
@property (nonatomic,strong) UIImageView *btDelete ;
@property (nonatomic,strong) UIImageView *btSizeCtrl ;
@end
細節(jié)的實現(xiàn)見源碼吧, 貼過來實在是有點冗長, github源碼點這里過去歡迎follow
