在新的項目中，需要實現分享功能，比較后接入友盟分享。友盟分享的使用文檔以及常見問題都非常的詳細，接入也較為簡單。只是分享面板與我們的App風格不太相符，所以自定義了一個分享面板。
項目地址在這里
實現的過程
1. ShareView
- .h文件中，主要屬性及初始化方法
// 點擊按鈕block回調
@property (nonatomic,copy) void(^btnClick)(NSInteger);
// 頭部提示文字
@property (nonatomic,copy) NSString *proStr;
// 設置彈窗背景蒙板灰度(0~1)
@property (nonatomic,assign) CGFloat duration;
/**
* 初始化
*
* @param titleArray 標題數組
* @param imageArray 圖片數組(如果不需要的話傳空數組(@[])進來)
* @param proTitle 最頂部的標題 不需要的話傳@""
*
* @return ShareView
*/
- (instancetype)initWithShareHeadOprationWith:(NSArray *)titleArray andImageArry:(NSArray *)imageArray andProTitle:(NSString *)proTitle;
- 初始化時，為視圖添加手勢，設置背景蒙板灰度，加載自定義視圖
- (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];
}
- 背景面板（這是一排三個的設計，個人認為更好看一些，由于本次分享平臺較少，并沒有限制高度或者做多高之后可以滾動。。。）
- (UIView *)bgView {
if (_bgView == nil) {
_bgView = [[UIView alloc] init];
// 根據圖標個數，計算行數，計算 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. 創建與配置
- 判斷設備中是否安裝了要分享的平臺對應的App（微博平臺不用判斷）：
BOOL hadInstalledWeixin = [[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"weixin://"]];
BOOL hadInstalledQQ = [[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"mqq://"]];
將安裝的了App對應的圖標和標題放入數組；
實現 Button 點擊的 Block 回調（例），回調的方法里根據不同的 type 設置不同的分享內容：
case 0: {
// 微信
[self shareTextToPlatformType:UMSocialPlatformType_WechatSession shareType:type model:model];
}
- 將分享面板展示：
[[UIApplication sharedApplication].keyWindow addSubview:shareView];
3. 區分不同的平臺，設置分享內容
- 創建分享消息對象（U-Share SDK類）：
UMSocialMessageObject *messageObject = [UMSocialMessageObject messageObject];
//設置文本
messageObject.text = @"";
- 分享多媒體對象，例分享網頁（U-Share SDK方法）：
UMShareWebpageObject *webPageObject = [UMShareWebpageObject shareObjectWithTitle:model.title descr:model.detail thumImage:model.thumImage];
webPageObject.webpageUrl = model.url;
messageObject.shareObject = webPageObject;
- 調用分享接口（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. 外部調用
ShareModel *model = [ShareModel shareAppModel];
// 分享
[CommonUtils shareBoardBySelfDefinedWithType:ShareTypeApp model:model];
實現的效果
這 個 尺 寸 非 常 的 完 美.png
遇到的問題
- 最開始配置好各個分享平臺的 URL Scheme 之后，分享功能仍然無法正常使用，經檢查是因為 iOS 9 的白名單問題。加入后解決。
- 由于是自定義的分享面板，在調用時需要判斷當前設備中是否安裝了相應的平臺的應用，如 QQ、Wechat等。如果當前設備中沒有安裝某個應用而面板中帶有該平臺的分享圖標，在 App 審核時可能不會被通過。友盟自帶的分享面板已經做過這層判斷。
