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

先看下效果


下面我會詳細(xì)介紹下實現(xiàn)原理
1 .獲取彈幕數(shù)據(jù)來源,因為我是模擬生成彈幕,彈幕的數(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ù)模型生成彈幕圖片,通過點擊屏幕生成模型,根據(jù)模型繪制圖片。
#pragma mark - 觸摸屏幕響應(yīng)事件
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
// 獲得一個隨機整數(shù)
NSInteger index = arc4random_uniform((u_int32_t)self.danMus.count);
// 獲得一個隨機模型
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)容的長 + 表情的長 * 表情個數(shù) + 間距。然后就是分別繪制背景圖片,用戶昵稱,內(nèi)容和表情,最后返回一張圖片。
此處有兩點需要注意:
1.由于頭像是矩形,想顯示成圓形,要先畫一個圓,并設(shè)置超出圓形的部分要裁剪,再繪制頭像。
2.由于上面設(shè)置超出圓形的部分要裁剪,那即將要繪制背景豈不是要被裁剪,所以在繪制圓形區(qū)域上一句執(zhí)行了CGContextSaveGState(ctx)表示復(fù)制了一份畫板(上下文)存到棧里,在繪制背景圖片之前執(zhí)行CGContextRestoreGState(ctx),表示用之前保存的畫板替換當(dāng)前的,因為之前保存的畫板沒有設(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ù)的區(qū)域
CGSize nameSize = [danMu.userName boundingRectWithSize:CGSizeMake(MAXFLOAT, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:font} context:nil].size;
// 計算內(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 .開啟繪圖定時器,回調(diào)方法是setNeedsDisplay,這樣就會執(zhí)行- (void)drawRect:(CGRect)rect每次修改image.x(由于UIImage沒有x、y屬性,所以寫了個類拓展BAImage),滾動不在屏幕范圍內(nèi)的會銷毀
#pragma mark - 添加定時器
- (void)addTimer{
if (self.link) {
return;
}
// 每秒執(zhí)行60次回調(diào)
CADisplayLink *link = [CADisplayLink displayLinkWithTarget:self selector:@selector(setNeedsDisplay)];
// 將定時器添加到runLoop
[link addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSRunLoopCommonModes];
self.link = link;
}
#pragma mark - 繪制移動
- (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如何實現(xiàn)彈幕高效加載”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司行業(yè)資訊頻道!
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)建站www.chinadenli.net,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
網(wǎng)站名稱:ios如何實現(xiàn)彈幕高效加載-創(chuàng)新互聯(lián)
分享地址:http://www.chinadenli.net/article14/dcpgde.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供搜索引擎優(yōu)化、App開發(fā)、企業(yè)建站、域名注冊、網(wǎng)站策劃、動態(tài)網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容