ios如何實(shí)現(xiàn)彈幕高效加載-創(chuàng)新互聯(lián)

這篇文章主要為大家展示了“ios如何實(shí)現(xiàn)彈幕高效加載”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“ios如何實(shí)現(xiàn)彈幕高效加載”這篇文章吧。

創(chuàng)新互聯(lián)是一家集網(wǎng)站建設(shè),昔陽企業(yè)網(wǎng)站建設(shè),昔陽品牌網(wǎng)站建設(shè),網(wǎng)站定制,昔陽網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營銷,網(wǎng)絡(luò)優(yōu)化,昔陽網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競爭力。可充分滿足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶成長自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

先看下效果

下面我會詳細(xì)介紹下實(shí)現(xiàn)原理

1 .獲取彈幕數(shù)據(jù)來源，因?yàn)槲沂悄M生成彈幕，彈幕的數(shù)據(jù)存放在工程里的plist文件中

emotions存放這條彈幕的表情，type表示是否是自己發(fā)的，text表示彈幕內(nèi)容，userName表示用戶昵稱。取出plist文件的數(shù)據(jù)并轉(zhuǎn)換成model。

#pragma mark - 獲取數(shù)據(jù)源
- (void)loadData{
  // 獲取plist全路徑
  NSString *filePath = [[NSBundle mainBundle] pathForResource:@"barrage.plist" ofType:nil];
  // 從指定的路徑中加載數(shù)據(jù)
  NSArray *array = [NSArray arrayWithContentsOfFile:filePath];

  // 遍歷數(shù)組
  for (NSDictionary *dict in array) {
    // 字典轉(zhuǎn)模型
    BAModle *barrageM = [BAModle barrageWithDict:dict];
    [self.danMus addObject:barrageM];
  }
}

2 .根據(jù)模型生成彈幕圖片，通過點(diǎn)擊屏幕生成模型，根據(jù)模型繪制圖片。

#pragma mark - 觸摸屏幕響應(yīng)事件
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{

  // 獲得一個(gè)隨機(jī)整數(shù)
  NSInteger index = arc4random_uniform((u_int32_t)self.danMus.count);
  // 獲得一個(gè)隨機(jī)模型
  BAModle *danMu = self.danMus[index];
  // 根據(jù)模型生成圖片
  BAImage *image = [self.danMuview imageWithBarrage:danMu];
  // 調(diào)整彈幕加載區(qū)域
  image.x = self.view.bounds.size.width;
  image.y = arc4random_uniform(self.danMuview.bounds.size.height - image.size.height);
  // 把圖片加到彈幕view上
  [self.danMuview addImage:image]; 
}

下面是具體繪制彈幕圖片過程，我先簡單介紹下，首先在繪圖之前要確定上下文的尺寸，相當(dāng)于畫板的大小，畫板的長 = 頭像的長 + 昵稱的長 + 內(nèi)容的長 + 表情的長 * 表情個(gè)數(shù) + 間距。然后就是分別繪制背景圖片，用戶昵稱，內(nèi)容和表情，最后返回一張圖片。

此處有兩點(diǎn)需要注意：

1.由于頭像是矩形，想顯示成圓形，要先畫一個(gè)圓，并設(shè)置超出圓形的部分要裁剪，再繪制頭像。

2.由于上面設(shè)置超出圓形的部分要裁剪，那即將要繪制背景豈不是要被裁剪，所以在繪制圓形區(qū)域上一句執(zhí)行了CGContextSaveGState(ctx)表示復(fù)制了一份畫板（上下文）存到棧里，在繪制背景圖片之前執(zhí)行CGContextRestoreGState(ctx)，表示用之前保存的畫板替換當(dāng)前的，因?yàn)橹氨４娴漠嫲鍥]有設(shè)置超出圓形區(qū)域要裁剪的需求，當(dāng)然替換當(dāng)前的畫板，會把當(dāng)前畫板上的繪圖也copy過去。

#pragma mark - 繪制彈幕圖片
- (BAImage *)imageWithBarrage:(BAModle *)danMu{
  // 開啟繪圖上下文
  //
  UIFont *font = [UIFont systemFontOfSize:13];
  // 頭像
  CGFloat iconH = 30;
  CGFloat iconW = iconH;
  // 間距
  CGFloat marginX = 5;

  // 表情的尺寸
  CGFloat emotionW = 25;
  CGFloat emotionH = emotionW;
  // 計(jì)算用戶名占據(jù)的區(qū)域
  CGSize nameSize = [danMu.userName boundingRectWithSize:CGSizeMake(MAXFLOAT, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:font} context:nil].size;
  // 計(jì)算內(nèi)容占據(jù)的區(qū)域
  CGSize textSize = [danMu.text boundingRectWithSize:CGSizeMake(MAXFLOAT, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:font} context:nil].size;

  // 位圖上下文的尺寸
  CGFloat contentH = iconH;
  CGFloat contentW = iconW + 4 * marginX + nameSize.width + textSize.width + danMu.emotions.count * emotionH;

  CGSize contextSize = CGSizeMake(contentW, contentH);
  UIGraphicsBeginImageContextWithOptions(contextSize, NO, 0.0);

  // 獲得位圖上下文
  CGContextRef ctx = UIGraphicsGetCurrentContext();
  // 將上下文保存到棧中
  CGContextSaveGState(ctx);
  // 1.繪制圓形區(qū)域
  CGRect iconFrame = CGRectMake(0, 0, iconW, iconH);
  // 繪制頭像圓形
  CGContextAddEllipseInRect(ctx, iconFrame);
  // 超出圓形的要裁剪
  CGContextClip(ctx);
  // 2.繪制頭像
  UIImage *icon = danMu.type ? [UIImage imageNamed:@"headImage_1"]:[UIImage imageNamed:@"headImage_2"];
  [icon drawInRect:iconFrame];
  // 將上下文出棧替換當(dāng)前上下文
  CGContextRestoreGState(ctx);
  // 3.繪制背景圖片
  CGFloat bgX = iconW + marginX;
  CGFloat bgY = 0;
  CGFloat bgW = contentW - bgX;
  CGFloat bgH = contentH;
  danMu.type ? [[UIColor orangeColor] set]:[[UIColor whiteColor] set];
  [[UIBezierPath bezierPathWithRoundedRect:CGRectMake(bgX, bgY, bgW, bgH) cornerRadius:20.0] fill];

  // 4.繪制用戶名
  CGFloat nameX = bgX + marginX;
  CGFloat nameY = (contentH - nameSize.height) * 0.5;
  [danMu.userName drawAtPoint:CGPointMake(nameX, nameY) withAttributes:@{NSAttachmentAttributeName:font,NSForegroundColorAttributeName:danMu.type == NO ? [UIColor orangeColor]:[UIColor blackColor]}];

  // 5.繪制內(nèi)容
  CGFloat textX = nameX + nameSize.width + marginX;
  CGFloat textY = nameY;
  [danMu.text drawAtPoint:CGPointMake(textX, textY) withAttributes:@{NSAttachmentAttributeName:font,NSForegroundColorAttributeName:danMu.type == NO ? [UIColor blackColor]:[UIColor whiteColor]}];

  // 6.繪制表情
  __block CGFloat emotionX = textX + textSize.width;
  CGFloat emotionY = (contentH - emotionH) * 0.5;
  [danMu.emotions enumerateObjectsUsingBlock:^(NSString *emotionName, NSUInteger idx, BOOL * _Nonnull stop) {
    // 加載表情圖片
    UIImage *emotion = [UIImage imageNamed:emotionName];
    [emotion drawInRect:CGRectMake(emotionX, emotionY, emotionW, emotionH)];
    // 修改emotionX
    emotionX += emotionW;
  }];
  // 從位圖上下文中獲得繪制好的圖片
  UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

  return [[BAImage alloc] initWithCGImage:image.CGImage scale:[UIScreen mainScreen].scale orientation:UIImageOrientationUp];
}

3 .開啟繪圖定時(shí)器，回調(diào)方法是setNeedsDisplay，這樣就會執(zhí)行- (void)drawRect:(CGRect)rect每次修改image.x(由于UIImage沒有x、y屬性，所以寫了個(gè)類拓展BAImage)，滾動(dòng)不在屏幕范圍內(nèi)的會銷毀

#pragma mark - 添加定時(shí)器
- (void)addTimer{
  if (self.link) {
    return;
  }
  // 每秒執(zhí)行60次回調(diào)
  CADisplayLink *link = [CADisplayLink displayLinkWithTarget:self selector:@selector(setNeedsDisplay)];
  // 將定時(shí)器添加到runLoop
  [link addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSRunLoopCommonModes];
  self.link = link;
}
#pragma mark - 繪制移動(dòng)
- (void)drawRect:(CGRect)rect{

  for (BAImage *image in self.imageArray) {
    image.x -= 3;
    // 繪制圖片
    [image drawAtPoint:CGPointMake(image.x, image.y)];
    // 判斷圖片是否超出屏幕
    if (image.x + image.size.width < 0) {
      [self.deleteImageArray addObject:image];
    }
  }
  // 移除超過屏幕的彈幕
  for (BAImage *image in self.deleteImageArray) {
    [self.imageArray removeObject:image];
  }
  [self.deleteImageArray removeAllObjects];
}

以上是“ios如何實(shí)現(xiàn)彈幕高效加載”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司行業(yè)資訊頻道！

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)建站muchs.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。

網(wǎng)站名稱：ios如何實(shí)現(xiàn)彈幕高效加載-創(chuàng)新互聯(lián)
分享地址：http://muchs.cn/article14/dcpgde.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供搜索引擎優(yōu)化、App開發(fā)、企業(yè)建站、域名注冊、網(wǎng)站策劃、動(dòng)態(tài)網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)