在新的項目中，需要實現(xiàn)分享功能叹阔，比較后接入友盟分享挠轴。友盟分享的使用文檔以及常見問題都非常的詳細，接入也較為簡單耳幢。只是分享面板與我們的App風格不太相符岸晦，所以自定義了一個分享面板。
項目地址在這里
實現(xiàn)的過程
1. ShareView
- .h文件中睛藻，主要屬性及初始化方法
// 點擊按鈕block回調(diào)
@property (nonatomic,copy) void(^btnClick)(NSInteger);
// 頭部提示文字
@property (nonatomic,copy) NSString *proStr;
// 設(shè)置彈窗背景蒙板灰度(0~1)
@property (nonatomic,assign) CGFloat duration;
/**
* 初始化
*
* @param titleArray 標題數(shù)組
* @param imageArray 圖片數(shù)組(如果不需要的話傳空數(shù)組(@[])進來)
* @param proTitle 最頂部的標題 不需要的話傳@""
*
* @return ShareView
*/
- (instancetype)initWithShareHeadOprationWith:(NSArray *)titleArray andImageArry:(NSArray *)imageArray andProTitle:(NSString *)proTitle;
- 初始化時启上，為視圖添加手勢，設(shè)置背景蒙板灰度店印，加載自定義視圖
- (instancetype)initWithShareHeadOprationWith:(NSArray *)titleArray andImageArry:(NSArray *)imageArray andProTitle:(NSString *)proTitle {
self = [super init];
if (self) {
_shareBtnTitleArray = titleArray;
_shareBtnImageArray = imageArray;
_protext = proTitle;
self.frame = CGRectMake(0, 0, ScreenWidth, ScreenHeight);
// 背景冈在，帶灰度
self.backgroundColor = WINDOW_COLOR;
// 可點擊
self.userInteractionEnabled = YES;
// 點擊背景，收起底部分享面板按摘，移除本視圖
UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tappedCancel)];
[self addGestureRecognizer:tapGesture];
// 加載分享面板
[self loadUIConfig];
}
return self;
}
- 加載視圖包券，依次添加分享的按鈕，視圖顯示時炫贤，主要分享面板從底部彈出
/**
加載自定義視圖溅固，按鈕的tag依次為（200 + i）
*/
- (void)loadUIConfig {
[self addSubview:self.bgView];
[self.bgView addSubview:self.topSheetView];
[self.bgView addSubview:self.cancelBtn];
self.proLbl.text = _protext;
// 按鈕
for (NSInteger i = 0; i < self.shareBtnTitleArray.count; i++) {
CGFloat x = self.bgView.bounds.size.width / 3 * ( i % 3);
CGFloat y = LABEL_HEIGHT + (i / 3) * LINE_HEIGHT;
CGFloat w = self.bgView.bounds.size.width / 3;
CGFloat h = 70;
CGRect frame = CGRectMake(x, y, w, h);
ImageWithLabel *item = [ImageWithLabel imageLabelWithFrame:frame Image:[UIImage imageNamed:self.shareBtnImageArray[i]] LabelText:self.shareBtnTitleArray[i]];
item.labelOffsetY = 6;
item.tag = 200 + i;
UITapGestureRecognizer *tapGes = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(itemClick:)];
[item addGestureRecognizer:tapGes];
[self.topSheetView addSubview:item];
[self.buttons addObject:item];
}
// 彈出
[UIView animateWithDuration:ANIMATE_DURATION animations:^{
self.bgView.frame = CGRectMake(0, ScreenHeight - CGRectGetHeight(self.bgView.frame), ScreenWidth, CGRectGetHeight(self.bgView.frame));
}];
// icon 動畫
[self iconAnimation];
}
- 背景面板（這是一排三個的設(shè)計，個人認為更好看一些兰珍，由于本次分享平臺較少侍郭，并沒有限制高度或者做多高之后可以滾動。。亮元。）
- (UIView *)bgView {
if (_bgView == nil) {
_bgView = [[UIView alloc] init];
// 根據(jù)圖標個數(shù)汰寓，計算行數(shù)，計算 backgroundView 的高度
NSInteger index;
if (_shareBtnTitleArray.count % 3 == 0) {
index = _shareBtnTitleArray.count / 3;
} else {
index = _shareBtnTitleArray.count / 3 + 1;
}
_bgView.frame = CGRectMake(0, ScreenHeight, ScreenWidth, BUTTON_HEIGHT + (_protext.length == 0 ? 0 : 45) + LINE_HEIGHT * index);
}
return _bgView;
}
- 點擊背景面板或者取消按鈕
/**
點擊取消
*/
- (void)tappedCancel {
[UIView animateWithDuration:ANIMATE_DURATION animations:^{
[self.bgView setFrame:CGRectMake(0, ScreenHeight, ScreenWidth, 0)];
self.alpha = 0;
} completion:^(BOOL finished) {
if (finished) {
[self removeFromSuperview];
}
}];
}
- 這是一個借用了 Facebook 開源框架寫的圖標彈出動畫苹粟，有點像今日頭條的分享面板(??)。代碼簡潔效果炫酷跃闹，你值得擁有(??)嵌削。
/**
做一個 icon 依次粗線的彈簧動畫
*/
- (void)iconAnimation {
CGFloat duration = 0;
for (UIView *icon in self.buttons) {
CGRect frame = icon.frame;
CGRect toFrame = icon.frame;
frame.origin.y += frame.size.height;
icon.frame = frame;
POPSpringAnimation *animation = [POPSpringAnimation animationWithPropertyNamed:kPOPViewFrame];
animation.toValue = [NSValue valueWithCGRect:toFrame];
animation.beginTime = CACurrentMediaTime() + duration;
animation.springBounciness = 10.0f;
[icon pop_addAnimation:animation forKey:kPOPViewFrame];
duration += 0.07;
}
}
2. 創(chuàng)建與配置
- 判斷設(shè)備中是否安裝了要分享的平臺對應(yīng)的App（微博平臺不用判斷）：
BOOL hadInstalledWeixin = [[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"weixin://"]];
BOOL hadInstalledQQ = [[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"mqq://"]];
將安裝的了App對應(yīng)的圖標和標題放入數(shù)組；
實現(xiàn) Button 點擊的 Block 回調(diào)（例）望艺，回調(diào)的方法里根據(jù)不同的 type 設(shè)置不同的分享內(nèi)容：
case 0: {
// 微信
[self shareTextToPlatformType:UMSocialPlatformType_WechatSession shareType:type model:model];
}
- 將分享面板展示：
[[UIApplication sharedApplication].keyWindow addSubview:shareView];
3. 區(qū)分不同的平臺苛秕，設(shè)置分享內(nèi)容
- 創(chuàng)建分享消息對象（U-Share SDK類）：
UMSocialMessageObject *messageObject = [UMSocialMessageObject messageObject];
//設(shè)置文本
messageObject.text = @"";
- 分享多媒體對象，例分享網(wǎng)頁（U-Share SDK方法）：
UMShareWebpageObject *webPageObject = [UMShareWebpageObject shareObjectWithTitle:model.title descr:model.detail thumImage:model.thumImage];
webPageObject.webpageUrl = model.url;
messageObject.shareObject = webPageObject;
- 調(diào)用分享接口（U-Share SDK方法）
[[UMSocialManager defaultManager] shareToPlatform:platformType messageObject:messageObject currentViewController:self completion:^(id data, NSError *error) {
if (error) {
Log(@"************Share fail with error %@*********",error);
[SVProgressHUD showErrorWithStatus:@"分享失敗"];
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
[SVProgressHUD dismiss];
});
}else{
Log(@"response data is %@",data);
[SVProgressHUD showSuccessWithStatus:@"分享成功"];
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
[SVProgressHUD dismiss];
});
}
}];
4. 外部調(diào)用
ShareModel *model = [ShareModel shareAppModel];
// 分享
[CommonUtils shareBoardBySelfDefinedWithType:ShareTypeApp model:model];
實現(xiàn)的效果
這 個 尺 寸 非 常 的 完 美.png
遇到的問題
- 最開始配置好各個分享平臺的 URL Scheme 之后找默，分享功能仍然無法正常使用艇劫，經(jīng)檢查是因為 iOS 9 的白名單問題。加入后解決惩激。
- 由于是自定義的分享面板店煞，在調(diào)用時需要判斷當前設(shè)備中是否安裝了相應(yīng)的平臺的應(yīng)用，如 QQ风钻、Wechat等顷蟀。如果當前設(shè)備中沒有安裝某個應(yīng)用而面板中帶有該平臺的分享圖標，在 App 審核時可能不會被通過骡技。友盟自帶的分享面板已經(jīng)做過這層判斷鸣个。
