As usual, post the GitHub source address first

navigation

  • The target
  • Version Update Description
  • Quick to use
  • Custom Configuration

Goal:

  • The barrage disappears automatically after a few seconds
  • When the bullet-screen of user A appears, user B will send gifts, and the bullet-screen of user B is below the bullet-screen of user A. When the bullet-screen of user A/B exists, user A/B will send gifts continuously, and the number of gifts displayed in the bullet-screen will increase.
  • When the barrage exists for user A/B, user C sends A gift, and the earlier barrage of user A/B is replaced with the barrage data of user C, and the barrage of user C is at the bottom

Version Update:

V1.0

  • Roughly realize the effect of adding bullets for different users



V1.1

  • Realize the user to continuously send numbers to increase the effect
  • Implemented the effect of a new barrage appearing from a vacancy



V1.2

  • Implemented sending gifts after the second user to replace earlier barrage effects (improved)



V1.3

  • After the above view is removed, the view below the combo is moved to the above effect



V1.4

  • The target effect was achieved 😊😊😊



Quick to use

  • Third-party libraries used:

    • Masonry
    • SDWebImage

  • Two models :ZYGiftListModel and UserModel

    • ZYGiftListModelIs used to display the gift picture on the right side of the barragepicUrlAnd the words of rewardrewardMsgYes, there are giftstypefield
    • UserModelIs used to show the name of the person who gave the giftnameAnd the headiconUrl

  • #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; }Copy the code
  • Use in development
LiveGiftShowModel * listModel = [LiveGiftShowModel giftModel:self.giftArr[3] 
                                                   userModel:[UserModel random]];
[self.giftShow addGiftListModel:listModel];Copy the code

The connection is complete. Every click only need [self giftShow addGiftListModel: listModel]; The number of gifts with the same user name and the same gift type can be automatically counted plus one. The maximum value is 9999.

Custom Configuration

  • LiveGiftShowManage all views of the barrage
The difference in altitude between two shells Two swap animation lengths
kGiftViewMargin kExchangeAnimationTime
50.0 0.25
  • LiveGiftShowViewA view of a barrage
The barrage has a wide background The barrage has a high background Name and number of the giver Name of giver, text color Gift message size Gift message text color
kViewWidth kViewHeight kNameLabelFont kNameLabelTextColor kGiftLabelFont kGiftLabelTextColor
240.0 44.0 12.0 whiteColor 10.0 orangeColor
Width of each digital picture The barrage disappeared after a few seconds The number changes the animation duration Duration of disappearing animation
kGiftNumberWidth kTimeOut kNumberAnimationTime kRemoveAnimationTime
15.0 3 0.25 0.5

About me

  • If you have any problems or want to share/tease/suggest/comment with me, you can contact [email protected] or leave a comment below. I will respond in time.
  • Support me please click follow/like.