HarmonyOS應(yīng)用開發(fā)-popup氣泡指示組件練習(xí)

1、蛟龍騰飛學(xué)習(xí)分享材料HarmonyOS應(yīng)用開發(fā)-popup氣泡指示組件練習(xí)效果展示：說明：該組件從API version 4開始支持。后續(xù)版本如有新增內(nèi)容，則采用上角標(biāo)單獨(dú)標(biāo)記該內(nèi)容的起始版本。氣泡指示。在點(diǎn)擊綁定的控件后會(huì)彈出相應(yīng)的氣泡提示來引導(dǎo)用戶進(jìn)行操作。屬性：名稱類型默認(rèn)值必填描述targetstring-是目標(biāo)元素的id屬性值，不支持動(dòng)態(tài)切換。placementstringbottom否彈出窗口位置?？蛇x值為：left：位于目標(biāo)元素左邊；right：位于目標(biāo)元素右邊；top：位于目標(biāo)元素上邊；bottom：位于目標(biāo)元素下邊；topLeft：位于目標(biāo)元素左上角；topRight：位于目

2、標(biāo)元素右上角；bottomLeft：位于目標(biāo)元素左下角；bottomRight：位于目標(biāo)元素右下角。keepalive5+booleanfalse否設(shè)置當(dāng)前popup是否需要保留。設(shè)置為true時(shí)，點(diǎn)擊屏幕區(qū)域或者頁面切換氣泡不會(huì)消失，需調(diào)用氣泡組件的hide方法才可讓氣泡消失；設(shè)置為false時(shí)，點(diǎn)擊屏幕區(qū)域或者頁面切換氣泡會(huì)自動(dòng)消失。clickable5+booleantrue否popup是否使用點(diǎn)擊彈窗，當(dāng)設(shè)置為false時(shí)，只支持方法調(diào)用顯示。arrowoffset5+0否popup箭頭在彈窗處的偏移，默認(rèn)居中，正值按照語言方向進(jìn)行偏移，負(fù)值相反。事件：名稱參數(shù)描述visibility

3、change visibility: boolean 當(dāng)氣泡彈出和消失時(shí)會(huì)觸發(fā)該回調(diào)函數(shù)。方法：名稱參數(shù)描述show5+-彈出氣泡提示。hide5+-取消氣泡提示。說明：popup氣泡彈窗屬性、樣式均不支持動(dòng)態(tài)更新。popup氣泡彈窗的margin樣式是相對(duì)于target元素進(jìn)行生效的，如popup在target元素下方，此時(shí)只生效margin-top樣式，popup在target元素左上方，此時(shí)只生效margin-bottom和margin-right樣式。popup的border四邊樣式需一致，若四邊設(shè)置不一致且圓角為零，則按左、上、右、下的順序取第一個(gè)被設(shè)置的樣式，否則border不生效

4、。popup的target組件的click事件不生效。代碼示例： Click to show the pop-up Text content of the pop-up Click to show the pop-up/* xxx.css */.container flex-direction: column; align-items: center; padding-top: 200px;.popup mask-color: gray;.text color: white;.button width: 220px; height: 70px; margin-top: 50px;/ xxx.jsimport prompt from mptexport default visibilitychange(e) prompt.showToast( message: visibility change visibility: + e.visibility, duration: 3000, ); , showpopup() this.$