前言
當我們的游戲開發進度接近尾聲的時候,不僅要做教學引導的事情,還有一件對于中大型游戲來說非常重要的事情就是紅點提示,它有別于教學引導,但也是引導的作用,指引性更明確,而且不會影響UI外觀和體驗的流暢,
開始
- 通過配置兩張資料表來記錄紅點提示的相關資料,

提示資訊表,僅表明都有哪些提示型別,

每個紅點提示使用的界面及控制元件名稱,
第二列為屬于哪個提示,所以宣告為索引型別,比如1來說,就是由GridLayerListViewTest的buttonBack和ItemView的bg兩個按鈕組成,也就是當有新道具添加時,GridLayerListViewTest的buttonBack和ItemView兩個控制元件都應該有紅點,
第三列和第四列宣告為類名和控制元件名
第五列標識控制元件是否為道具,因為道具和普通控制元件的記錄方式不同, - 讀取配置資料,初始化資訊,
init() {
let redtipData: XlsxData = https://www.cnblogs.com/cgw0827/p/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數量,
結語
制作紅點的方式很多,我見過有人把所有紅點手動添加到指定的按鈕上,然后再通過代碼顯示和隱藏,我比較懶,所以我選擇動態添加紅點圖片,
歡迎關注公眾號《微笑游戲》,瀏覽更多內容,

歡迎掃碼關注公眾號《微笑游戲》,瀏覽更多內容,
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/674.html
標籤:其他
下一篇:在Unity中檢測死回圈和卡死
