Всплывающее окно в SAP UI5, автоматическое закрытие, когда указатель мыши выходит за пределы всплывающего окна

Я создал всплывающее окно SAP UI5, используя Fragment. Фрагмент содержит XML-код для открытия всплывающего окна.

Мое требование состоит в том, что когда всплывающее окно открыто и когда указатель мыши выходит за пределы всплывающего окна (не щелкает мышью снаружи), всплывающее окно должно закрываться автоматически.

Пожалуйста, помогите мне с этим.


sapui5 tooltip mouseout mouseleave
person Kardeepanr R    schedule 02.06.2020    source источник
comment
Пробовали ли вы использовать событие mouseleave так же, как показано в документации для Popover для события click? sap.github.io/ui5-webcomponents/playground/components/Popover   -  person Palo    schedule 05.06.2020
comment
Что вы уже пробовали? Пожалуйста, добавьте код в вопрос.   -  person Boghyon Hoffmann    schedule 21.08.2020
comment
Я предполагаю, что вы ищете всплывающую подсказку: stackoverflow.com/a/45490191/5846045. Вы также можете расширить TooltipBase, как объяснено в ответе.   -  person Boghyon Hoffmann    schedule 22.08.2020

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете использовать так называемые «Делегаты событий». Посмотрите это маленькое демо:

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta charset="utf-8">
        <script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
            id="sap-ui-bootstrap"
            data-sap-ui-libs="sap.m,sap.ui.layout,sap.f"
            data-sap-ui-theme='sap_fiori_3'></script>
        <script>

            var btn = new sap.m.Link({
                text:'Hello World',
                press: function(evt){
                    var pop = new sap.m.Popover({
                        title: "MyPopOver",
                        placement: "Bottom",
                        contentWidth: "200px",
                        content: [new sap.m.Text({text: "My Text"})]
                    })
                    pop.addEventDelegate({
                        onmouseout: function() {
                            pop.close()
                        }
                    }, this);
                    pop.openBy(evt.getSource());
                }
            });
            btn.placeAt('content');
        </script>
    </head>
    <body id="content" class="sapUiBody">
    </body>
</html>

Осторожно, это уже закрывается, если вы коснетесь текста внутри всплывающего окна, но вы получите общую идею.

person A.vH    schedule 17.06.2020