前言
当咱们的游戏开发进度靠近序幕的时候，不仅要做教学疏导的事件，还有一件对于中大型游戏来说十分重要的事件就是红点提醒。它有别于教学疏导，但也是疏导的作用，指引性更明确，而且不会影响UI外观和体验的晦涩。
开始
- 通过配置两张数据表来记录红点提醒的相干数据。
提示信息表，仅表明都有哪些提醒类型。
每个红点提醒应用的界面及控件名称。
第二列为属于哪个提醒，所以申明为索引类型。比方1来说，就是由GridLayerListViewTest的buttonBack和ItemView的bg两个按钮组成，也就是当有新道具增加时，GridLayerListViewTest的buttonBack和ItemView两个控件都应该有红点。
第三列和第四列申明为类名和控件名
第五列标识控件是否为道具，因为道具和一般控件的记录形式不同。
- 读取配置数据，初始化信息。
init() { let redtipData: XlsxData = ModuleManager.dataManager.get(RedTipItemModel.CLASS_NAME) redtipData.forEach((key, data) => { let item = new RedTipItemModel() item.init(key, data) this.redtipMap.set(key, item) }) let redtipStep: XlsxData = ModuleManager.dataManager.get(RedTipStepModel.CLASS_NAME) let indexs = redtipStep.getIndex(Redtip_step_dataEnum.tipID); for (const key in indexs) { if (indexs.hasOwnProperty(key)) { const list = indexs[key]; for (let index = 0; index < list.length; index++) { const stepID = list[index]; let step = new RedTipStepModel() step.init(stepID, redtipStep.getRowData(stepID)) this.redtipMap.get(step.getTipID()).addStep(step) // if (index == 0) { let className = step.getClassName(); let classMap = this.classNameMap.get(className) if (!classMap) { classMap = [] this.classNameMap.set(className, classMap) } classMap.push(step.getTipID()) } } } }初始化函数中次要做了两件事件：
一是 产生提醒所对应的界面和控件数据。
二是 产生界面对应的提醒id信息。次要是为了疾速断定某个界面是否存在某个提醒
- 当取得新物品时调用增加函数
增加函数也是做了两件事件
一是排重：记录哪些正在进行中的提醒，如果曾经存在将不再增加。
二是更新记录数据并告诉界面解决红点操作。
- 当一个新物品被点击时，移除红点提醒
此办法与增加提醒的办法是绝对的。也做了更新记录数据和告诉ui的事件。
- 在增加和移除时更新记录的数据
/** * * @param eventName 事件名称 * @param step 哪个控件 * @param id 道具id */ private updateRecordCount(eventName: string, step: RedTipStepModel, id: number = -1) { let className = step.getClassName(); let widgetName = step.getWidgetName(); let tipID = step.getTipID(); let widgetMap = this.getWidgetMap(className, widgetName) if (eventName == RedTipEventName.ADD_ITEM_TIP) {//增加 if (!step.isItem()) {//如果控件不是道具，只是界面上的按钮 let list = widgetMap.get(tipID) if (!list) { list = [] widgetMap.set(tipID, list) } list.push(id) if (list.length == 1) { this.emit(eventName + className, step, id) } } else {//如果是道具 let list = widgetMap.get(id) if (!list) { list = [] widgetMap.set(id, list) } list.push(tipID) if (list.length == 1) { this.emit(eventName + className, step, id) } } } else {//移除 if (!step.isItem()) { let list = widgetMap.get(tipID) if (list.length > 0) { list.shift() if (this.isWidgetMapNull(widgetMap)) { this.emit(eventName + className, step, id) } } } else { let list = widgetMap.get(id) let index = list.indexOf(tipID) if (index >= 0) { list.splice(index, 1) if (list.length <= 0) { this.emit(eventName + className, step, id) } } } } }应用
- 如果是一般的控件，将WidgetRedTip托到 界面的预制体的根节点上即可。
- 如果是道具首先须要将ItemRedTip组件拖到道具预制体的根节点上。而后在道具中申明一个ItemRedTip类型的属性，在更新数据时调用。
- 产生新道具时调用提醒管理器的增加函数
- 点击道具时移除提醒
- demo展现
只是一个简略的demo，点击增加物品按钮，登陆按钮上会呈现红点；间接点击道具红点会隐没,所有道具都点过一遍后左上角按钮的红点才会隐没。
注意事项
- 因为应用了事件告诉的形式，所以须要留神监听者的数量，如果道具成千盈百，而且并没有应用ListView的形式，那么最好不要应用这种告诉的形式，监听者太多。
- 因为应用的是控件名称的形式，所以同一界面中的控件不能够重名
- 如果滑动层没有做分层治理，须要留神红点图片产生的dc数量。
结语
制作红点的形式很多，我见过有人把所有红点手动增加到指定的按钮上，而后再通过代码显示和暗藏。我比拟懒，所以我抉择动静增加红点图片。
欢送关注公众号《微笑游戏》，浏览更多内容。
欢送扫码关注公众号《微笑游戏》，浏览更多内容。