LiveGiftShow-iOS直播弹幕效果（礼物连击）

树下有雨
5,258 阅读2分钟

按照惯例，先贴GitHub源码地址

导航

目标:

  • 弹幕过几秒自动消失
  • 实现A用户弹幕出现时，B用户发送礼物，B用户弹幕在A用户弹幕下方,A/B用户弹幕存在时，A/B用户连续发送礼物，弹幕显示的礼物数量增加，谁的礼物数量较大，谁的弹幕在上方。
  • A/B用户弹幕存在时，C用户发送礼物，A/B用户中较早出现的弹幕被替换成C用户的弹幕数据，并且C用户的弹幕处于下方

版本更新:

V1.0

  • 大致实现了不同用户增加弹幕的效果

V1.1

  • 实现了用户连续发送数字增加效果
  • 实现了新增弹幕从空位出现的效果

V1.2

  • 实现了第二个用户之后送礼物替换较早的弹幕效果(完善)

V1.3

  • 实现了上面的视图移除后，正在连击的下面的视图移动到上面的效果

V1.4

  • 实现了目标效果😊😊😊

快速使用

  • 使用的第三方库:

  • 两个模型:ZYGiftListModel和UserModel

    • ZYGiftListModel是用来显示弹幕上右侧礼物图片picUrl和打赏的语句rewardMsg的，礼物有type字段
    • UserModel是用来显示送礼物的人的名称name和头像iconUrl

  • 只需要导入即可#import "LiveGiftShow.h"

  • @property (nonatomic ,weak) LiveGiftShow * giftShow;
 - (LiveGiftShow *)giftShow{
    if (!_giftShow) {
        LiveGiftShow * giftShow = [[LiveGiftShow alloc]init];
        [self.view addSubview:giftShow];
        _giftShow = giftShow;
        [giftShow mas_makeConstraints:^(MASConstraintMaker *make) {
            make.width.equalTo(@244);
            make.height.equalTo(@50);
            make.left.equalTo(self.view.mas_left);
            make.top.equalTo(self.view.mas_top).offset(100);
        }];
    }
    return _giftShow;
}
  • 在开发中使用
LiveGiftShowModel * listModel = [LiveGiftShowModel giftModel:self.giftArr[3] 
                                                   userModel:[UserModel random]];
[self.giftShow addGiftListModel:listModel];

即可完成接入。每一次点击只需要[self.giftShow addGiftListModel:listModel];即可自动计数加一。最高支持显示9999。

自定义配置

  • LiveGiftShow 管理所有弹幕的视图
两个弹幕之间的高度差 两个交换动画时长
kGiftViewMargin kExchangeAnimationTime
50.0 0.25
  • LiveGiftShowView一个弹幕的视图
弹幕背景宽 弹幕背景高 送礼者名称字号 送礼者名称文字颜色 礼物寄语字号 礼物寄语文字颜色
kViewWidth kViewHeight kNameLabelFont kNameLabelTextColor kGiftLabelFont kGiftLabelTextColor
240.0 44.0 12.0 whiteColor 10.0 orangeColor
每个数字图片宽度 弹幕几秒后消失 数字改变动画时长 弹幕消失动画时长
kGiftNumberWidth kTimeOut kNumberAnimationTime kRemoveAnimationTime
15.0 3 0.25 0.5

关于我

avatar
文章
阅读
粉丝