新时代总会有新产物,比如直播。直播的特色就在于实时互动。将原本的视频聊天一对一,变成主播和评论区聊天的一对多。 直播的特色也很明显,底部摄像机渲染实时画面;在左下角叠上一层弹幕滚动实时显示评论,右下角点赞购买等,同时点击屏幕会触发点赞动画;顶部左上角为头像和粉丝数以及关注,然后跟着一排打赏排行榜。 这些套用到游戏里的话,就是把原本的摄像机实时画面,变成游戏场景就行了。

下面主要是介绍单机直播弹幕的实现和送礼物的特效。

界面UI搭建

创建一个canvas

并且设置为屏幕覆盖的。在CanvasScaler里设置UI缩放模式为屏幕大小缩放,参考分辨率暂时设为750*1334。

创建一个ScrollView滚动区域在底部
布局调整如下:
然后删掉横竖方向的滚动条。

选中Viewport节点,修改它的布局,并去掉原来默认的Mask,换成矩形遮罩Rect Mask 2D,暂时设置softness为30,后续可以情况修改。

Content也修改一下布局,然后添加垂直组件Vertival Layout Group,子级对齐为MiddleLeft,居中左对齐。
再添加一个适配高度的组件Content Size Fitter,垂直方向设置为:Preferred Size,这样在content里添加子节点的话其本身也可以改变自身大小。

创建单条弹幕的UI样式

首先,找一张圆角的弹幕UI背景图itemBg.png,然后在content节点下添加Image图片,命名为BarrageItem,并将itemBg赋值给Image。图像类型选中切片,在图像编辑器里将两端切出来,这样改变图片尺寸时两端也不会被拉伸到。

添加水平布局Horizontal Layout Group,和尺寸适配组件Content Size Fitter。设置如图:

在BarrageItem下添加两个Text,用于填写网友名称的NameText和弹幕内容DescText。调好字体大小颜色后,同样的也加上尺寸适配。

此时,弹幕效果是这样的:

调整BarrageItem的layout组件的配置:
点击BarrageItem,ctrl+D复制多一个BarrageItem,看看列表UI看起来是怎么样的:

非常紧凑且顶着外容器的左侧,所以需要对它们的父节点content的Layout进行调整:

将弹幕BarrageItem单独拖到Prefabs里作为预制体,再将其从父节点Content移除,然后将弹幕滚动ScrollView也拖动到资源里作为预制体。

至此,弹幕UI搭建就可以告一段落。

数据编辑

一、昵称数据

昵称数据结构UserName

有一个int类型的id和一个string类型的昵称

public struct UserName{int id;public string nickName;
}

建立JSON

可以通过unity的插件直接将excel文件赋值给unity里的节点去转换文件,也可以用其它插件将excel文件转换成Json文件,放入项目里供unity调用。
这里使用的是后者:

配置好excel后使用工具转换后得到的json如下,将其放入Assets\Resources\Jsons\中:

建立数据管理模块

在类初始化时就对Json进行转换为对象。再写一个GetRandomName方法供调用获取一个随机的昵称名。


public class UserNameClass{static public UserName[] userName;//配置public UserNameClass(){LoadByJson();}private void LoadByJson () {TextAsset text = Resources.Load<TextAsset>("Jsons/" + "UserName");userName = JsonMapper.ToObject<UserName[]>(text.text);}static public UserName GetRandomName(){return userName[Random.Range(0, userName.Length)];}
}

二、 弹幕数据

首先,弹幕在游戏里的应用分为以下几类:

  1. 普通弹幕,模拟玩家发言,随机出现一条
  2. 指引弹幕,模拟通过玩家对话进行任务指引,多条弹幕按顺序出现
  3. 特定场景弹幕,模拟特殊情况下触发多条弹幕内容,多条弹幕不按顺序依次随机出现
  4. 奖励弹幕,模拟玩家打赏,随机插入出现,并带有数据增加和送礼动画;(这种在此篇里暂不实现)

由此,弹幕将被分为以下三种类型,结构为id,desc(弹幕类型说明,辅助配表用)

每一条弹幕的结构则为index(序号),desc(弹幕内容)
第一列的数字对应的是上面的id,index对应的是第id组弹幕的第index条弹幕,即如果只有0代表其实是单条弹幕。弹幕内容自行填写即可。

转为Json后,三类弹幕结构是这样的:
段落弹幕,如图,每个id里仅有一条。

普通弹幕,如图,每个id里仅有一条。

特定场景弹幕,其实和有指引作用的段落弹幕是一样的,同样的将此json文件放到Resoutces/Jsons里:

接下来,将三种弹幕类型存到各自的分类中,并设置好他们的单独滚动速度:

item_arr里包含的是上面【弹幕组合】的对应id;弹幕滚动速度设置上限和下限。转换为Barrage.json文件后同上面一样放在Resources/Jsons文件里;

建立数据管理模块

按照上面json的结构创建三个类用于后续的调用:

/// <summary>
/// 弹幕类型汇总
/// </summary>
public class BarrageJson
{public int id = 0;public string type = "";public double min;//弹幕滚动速度public double max;//弹幕滚动速度public string[] item_arr;//弹幕id
}
/// <summary>
/// 弹幕组合
/// </summary>
public class BarrageItemsJson
{public int id;public string desc;//类型说明public BarrageItemJson[] item;
}
/// <summary>
/// 弹幕单例
/// </summary>
public class BarrageItemJson
{public int index;//public string desc;//弹幕内容
}

然后创建一个BarrageClass类,并进行json和上述类的初始化:

using System.Collections.Generic;
using UnityEngine;
using LitJson;public class BarrageClass{public static BarrageClass instance;BarrageJson[] barrageJson;//配置BarrageItemsJson[] barrageItemsJson;//配置private List<BarrageItemJson> curbarrages = new List<BarrageItemJson>();static public Dictionary<BarrageType, List<BarrageItemsJson>> TYPE_Barrage = new Dictionary<BarrageType, List<BarrageItemsJson>>{};public BarrageClass(){if(instance != null){return;}instance = this;LoadByJson();reset();}public void reset(){TYPE_Barrage.Add(BarrageType.newbie, getBarrageListByType(BarrageType.newbie));TYPE_Barrage.Add(BarrageType.day, getBarrageListByType(BarrageType.day));TYPE_Barrage.Add(BarrageType.night, getBarrageListByType(BarrageType.night));TYPE_Barrage.Add(BarrageType.success, getBarrageListByType(BarrageType.success));TYPE_Barrage.Add(BarrageType.fail, getBarrageListByType(BarrageType.fail));Debug.Log("新手弹幕:"+JsonMapper.ToJson(TYPE_Barrage[BarrageType.newbie]));}//获取弹幕组合;public List<BarrageItemsJson> getBarrageListByType(BarrageType type){string[] idArr = barrageJson[((int)type)].item_arr;List<BarrageItemsJson> barrageArr = new List<BarrageItemsJson>();for(int i = 0; i < idArr.Length; i++) {int id = int.Parse(idArr[i]);barrageArr.Add(barrageItemsJson[id]);}return barrageArr;}//Json转换成对应的objectprivate void LoadByJson () {TextAsset text = Resources.Load<TextAsset>("Jsons/" + "Barrage");barrageJson = JsonMapper.ToObject<BarrageJson[]>(text.text);Debug.Log("弹幕: 原json"+text);text = Resources.Load<TextAsset>("Jsons/" + "BarrageItem");barrageItemsJson = JsonMapper.ToObject<BarrageItemsJson[]>(text.text);Debug.Log("弹幕:"+JsonMapper.ToJson(barrageJson) + JsonMapper.ToJson(barrageItemsJson));}
}

将弹幕组合类型写成enum方便代码理解:

public enum BarrageType{newbie,day,night,success,fail
}

通过组合类型,来获取 [弹幕组合] 集合的方法:getBarrageByType(BarrageType type)

    //获取弹幕类型;public BarrageJson getBarrageByType(BarrageType type){return barrageJson[((int)type)];}

通过 [弹幕组合] 的id,来获取该条 [弹幕组合] 内多条弹幕集合item的方法:getBarrageByID(BarrageType id)

    //获取弹幕组合;public BarrageItemJson[] getBarrageByID(int id){return barrageItemsJson[id].item;}

通过getBarrageByType和getBarrageByID方法来设置字典,通过字典可直接获取 [弹幕组合] 集合:

    //获取弹幕组合;public List<BarrageItemsJson> getBarrageListByType(BarrageType type){string[] idArr = getBarrageByType(type).item_arr;List<BarrageItemsJson> barrageArr = new List<BarrageItemsJson>();for(int i = 0; i < idArr.Length; i++) {int id = int.Parse(idArr[i]);barrageArr.Add(barrageItemsJson[id]);}return barrageArr;}

三、弹幕显示和调用

弹幕滚动区域

首先是弹幕的滚动区域,创建BarrageUI脚本,进行简单的赋值。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;public class BarrageUI : MonoBehaviour
{public ScrollRect scroll_rect;//滚动区域public ScrollViewNevigation scrollViewNevigation;//用于滚动缓动动画的插件public GameObject item;//弹幕objectprivate List<BarrageItemsJson> barrageItemsJson = new List<BarrageItemsJson>();//弹幕组合列表private BarrageItemsJson curBarrageArr;//当前弹幕组合private BarrageType barrageType;//当前弹幕组合类型private BarrageItemJson curBarrage;//当前弹幕private int arrIndex = 0;//第几组弹幕private int index = 0;//弹幕组合里的第几条弹幕private BarrageClass barrageClass;//当前弹幕信息BarrageItemJson[] baragesArr;double min;//最小弹幕出现速度double max;//最大弹幕出现速度bool isStop = true;//是否弹幕滚动停止了void Start(){// MessageCenter.Instance.RigisterListener(MessageName.INSERT_BARRAGE, InsertBarrage);barrageClass = BarrageClass.instance;}
}

挂到Barrage预制体中去,再为其添加ScrollViewNevigation脚本,并赋值:

设置弹幕列表SetBarrageList,初始化弹幕出现时间。如果弹幕自动播放停止的话,则需要调用NextBarrageArr启动一下

    public void SetBarrageList(BarrageType type) {barrageType = type;min = barrageClass.getBarrageByType(type).min;max = barrageClass.getBarrageByType(type).max;barrageItemsJson = BarrageClass.TYPE_Barrage[barrageType];index = 0;arrIndex = 0;if(isStop){NextBarrageArr();}}

设置下一组弹幕NextBarrageArr:

    //下一组弹幕段落public void NextBarrageArr(){isStop = false;if(barrageType == BarrageType.newbie){if(TaskClass.instance.isNewbie){//新手阶段未结束arrIndex = TaskClass.instance.newbieID;//播放下一段新手弹幕curBarrageArr = barrageItemsJson[arrIndex];baragesArr = curBarrageArr.item;StartCoroutine(nextBarrage());}else{//新手阶段已结束isStop = true;SetBarrageList(BarrageType.day);}}else if(barrageType == BarrageType.day || barrageType == BarrageType.night){//随机抽取一段弹幕arrIndex = Random.Range(0, barrageItemsJson.Count);curBarrageArr = barrageItemsJson[arrIndex];baragesArr = curBarrageArr.item;index = 0;StartCoroutine(nextBarrage());}else if(barrageType == BarrageType.success || barrageType == BarrageType.fail){//特定场景下弹幕if(arrIndex < barrageItemsJson.Count){//依次播放成功失败段落的弹幕curBarrageArr = barrageItemsJson[0];baragesArr = curBarrageArr.item;baragesArr = AddBarage();RandomList(baragesArr, curBarrageArr.item.Length, out baragesArr);//打乱各条弹幕顺序StartCoroutine(nextBarrage());arrIndex ++;}}}void RandomList(BarrageItemJson[] barrageItemsArr, int count, out BarrageItemJson[] rangeArr{List<BarrageItemJson> barrageList = new List<BarrageItemJson>();List<int> indexList = new List<int>();//一个和animalList数量相同的序列Listfor(int i = 0; i < barrageItemsArr.Length; i++) {indexList.Add(i);}int countNum = barrageItemsArr.Length;while (barrageList.Count < countNum){int rangeNum = Random.Range(0,indexList.Count-1);//随机一个数int index = indexList[rangeNum];//在List取出该随机数的indexbarrageList.Add(barrageItemsArr[index]);indexList.Remove(index);if(barrageList.Count == count) break;}rangeArr = barrageList.ToArray();}

设置下一条弹幕nextBarrage

//下一条弹幕IEnumerator nextBarrage(){curBarrage = baragesArr[index];StartCoroutine(createItem());index ++;yield return new WaitForSeconds(Random.Range(((float)min), ((float)max)));if(barrageType == BarrageType.newbie){//新手弹幕播放完后不会出新的内容if(index < baragesArr.Length){StartCoroutine(nextBarrage());}else{isStop = true;}}else if(barrageType == BarrageType.day || barrageType == BarrageType.night){//白天和黑夜都为单独一句NextBarrageArr();}else if(barrageType == BarrageType.success || barrageType == BarrageType.fail){//成功失败if(curBarrageArr.desc != "特定场景弹幕"){NextBarrageArr();}else{if(index < baragesArr.Length){StartCoroutine(nextBarrage());}else{isStop = true;}}}}

创建弹幕实例createItem,创建后像弹幕单例传入数据进行初始化:

    //创建弹幕UIIEnumerator createItem(){GameObject _obj;_obj = GameObject.Instantiate(item);_obj.SetActive(true);_obj.transform.SetParent(scroll_rect.content.transform);item.GetComponent<RectTransform>().localScale= Vector3.one ;_obj.GetComponent<BarrageItem>().setData(curBarrage);yield return new WaitForSeconds(0.1f);scrollViewNevigation.Nevigate(_obj.GetComponent<RectTransform>(), Mathf.Min(0.8f, ((float)min)/2));//缓动移动到滚动区域底部}

单条弹幕实例

创建脚本BarrageItem,进行简单的赋值初始化即可。


using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;public class BarrageItem : MonoBehaviour
{public Text userName;public Text text;public void setData(BarrageItemJson data){userName.text = UserNameClass.GetRandomName().nickName + ": ";text.text = data.desc;}private void Update() {GetComponent<RectTransform>().localScale = Vector3.one;}
}

最终效果

【unity3D】直播间滚动式弹幕效果相关推荐

  1. 利用Python给直播间提供弹幕,几十个女主播想要我联系方式

    前言 这次给大家带来的是一个2500的爬虫外包项目,在这里肯定有人说这个不值这么多,也有人会各种嘲讽.但是别忘了,人的眼界不一样,做事的决定自然会不同. 如果2500能给你带来25000的利润,那么你 ...

  2. 快手直播间实时弹幕发言API

    请求地址 HTTPGET https://www.youwk.cn/api/dm/kuaishou 请求参数 参数名 参数说明 key 用户请求密钥,可在 密钥管理页面 申请 id 快手直播间live ...

  3. python3+selenium实现自动进熊猫直播间发弹幕的脚本

    学完python+selenium后突然觉得进入主播的直播间刷一波弹幕是个不错的想法(虽然这样的做法不是很好,但是完全可以证明自己的技术) 这里进入熊猫直播间的秋日房间(你们被封号了我不管) # co ...

  4. 抖音直播间弹幕protocbuf分析

    免责任声明: 任何可操作性的内容与本文无关,文章内容仅供参考学习,如有侵权, 损害贵公司利益, 请联系作者,会立刻马上进行删除 分析下: 1.protocolbuffer(以下简称PB)是google ...

  5. 抖音直播聊天窗口如何关闭,抖音直播间看不到弹幕

    最近有朋友问我怎么才能关闭直播间的弹幕,今天和大家讲解一下. 1.点击手机桌面"抖音短视频"图标,运行抖音软件. 2.登录手机抖音短视频APP,进入开直播界面,点击"开始 ...

  6. python 爬取直播弹幕视频_调用斗鱼API爬取直播间弹幕信息(用户昵称及弹幕内容)...

    调用斗鱼API爬取直播间弹幕信息(用户昵称及弹幕内容) 查看<斗鱼弹幕服务器第三方接入协议v1.4.1>,了解斗鱼API的使用方法,即如何连接斗鱼弹幕服务器.维持连接及获取弹幕信息 Pyt ...

  7. JS逆向-B站直播间弹幕protocbuf分析【10-24】

    先简单的记录下,有空再详细补充下. bibi直播间的弹幕协议已经从https变成wss. 抓包分析得知请求地址为:wss://hw-bj-live-comet-05.chat.bilibili.com ...

  8. PHP直播爬虫,B 站直播间数据爬虫

    前言 起因 去年在 B 站发现一个后期超强的 UP 主:修仙不倒大小眼,专出 PDD 这样知名主播的吃鸡精彩集锦,涨粉超快.于是想怎么做这样的 UP,遇到的第一个问题便是素材,精彩时刻需要手动从直播录 ...

  9. GPT虚拟直播Demo系列(二)|无人直播间实现虚拟人回复粉丝

    摘要 虚拟人和数字人是人工智能技术在现实生活中的具体应用,它们可以为人们的生活和工作带来便利和创新.在直播间场景里,虚拟人和数字人可用于直播主播.智能客服.营销推广等.接入GPT的虚拟人像是加了超强b ...

最新文章

  1. 云原生应用程序的架构应该怎么设计?
  2. 简单排列习题2.5 的 2 - 6 P35
  3. LeetCode算法题9:递归和回溯-N皇后问题
  4. nyoj 47 江 河问题 【贪婪】
  5. CodeForces - 1213E Two Small Strings(暴力+构造)
  6. ubuntu下修改网卡名称
  7. POJ 1862 amp; ZOJ 1543 Stripies(贪心 | 优先队列)
  8. BZOJ3230 相似子串 【后缀数组】
  9. 私有云对企业来说有什么好处
  10. leetcode python3 简单题26. Remove Duplicates from Sorted Array
  11. Linux生成子进程函数fork()
  12. linux系统root用户忘记密码的重置方法
  13. 【生信进阶练习1000days】day6-OrganismDb packages
  14. 原生开发跟混合开发两者有什么区别
  15. python另存为excel_python 将数据保存为excel的xls格式(实例讲解)
  16. 学生用计算机的感叹号在哪,感叹号怎么打电脑(感叹号的用法及举例)
  17. bcm43142 linux 驱动下载,CentosRedhat下bcm43142博通无线网卡linux驱动之二
  18. TCP断开连接的四次握手
  19. pycharm报错warning: iCCP: known incorrect sRGB profile
  20. 通过Field Of View值计算屏幕成像的宽高

热门文章

  1. jenkins-凭证管理
  2. 【转】全国80几所重点大学ftp资源库(经常逛逛可能有惊喜哦)很难收集的,知道其他的友友可以留言完善
  3. 不知道今天吃什么?今天吃什么 API 告诉你
  4. 初级会计实务--第七章第一节、管理会计概述
  5. 山石网科资深产品规划架构师任亮:安全的第一性原理是预防
  6. CMake Error at CMakeLists.txt:97 (ADD_TARGET_DEFINITIONS): Unknown CMake command ADD_TARGET_DEFIN
  7. 毕业设计 单片机智能避障扫地机器人 -物联网 嵌入式
  8. vmware 安装win2003笔记
  9. 【C语言中缀转后缀】
  10. 【华为OD机试真题 python】 简单的自动曝光【2022 Q4 | 100分】