SapUI5 Popover arrow is not pointing to dependent element which is clicked after setting the offsetY

I am using sap.m.Popover and i have a button and made that button as a dependent element for that popover.Now if i set the offsetY to that popover the popover is moving according to the offsetY value but the arrow that was pointing to the dependent element will be moved and it will not be pointing to that element also.How to make popover pointer to pointing to dependent element even after adding offsetY ?

1 answer

  • answered 2018-01-03 05:40 Péter Cataño

    The Popover component itself doesn't offer any method to set offsetY of the arrow element. The arrow can be repositioned with the _afterAdjustPositionAndArrowHook:

    Hook called after adjusment of the Popover position.

    To do so, after instantiate the popover fragment in Controller event handler function add _afterAdjustPositionAndArrowHook to the popover and reposition the arrow: (by offsetY I assume placement="Right")

    var self = this;
    this._oPopover =
        sap.ui.xmlfragment("sap.m.sample.Popover.Popover", this);
    
    this._oPopover._afterAdjustPositionAndArrowHook = function() {
        var arrow = jQuery('#myPop-arrow');
        arrow.css('top', Math.max(21, parseInt(arrow.css('top')) -
            self._oPopover.getOffsetY()));
    };
    
    this.getView().addDependent(this._oPopover);
    

    View:

    <Popover id="myPop" placement="Right" offsetY="100" ...>
    

    Based on the Popover Sample