Thursday, March 6, 2014

ADF Mobile - Popup at center of the window

Sometimes you may want to position amx:popup at the center of the window. At this moment, in 11.1.2.4.0 there is no declarative solution for this usecase, In this post I'm sharing a code snippet that I noticed from Denis Tyrell(Oracle) for the same.

You can align the amx:showPopupBehavior with overlapTop property, this indicates how the popup should be aligned relative to the panelPage and then in the amx:popup code you can set the inlineStyle as below:
<amx:popup id="p1" autoDismiss="true"
     inlineStyle="position:relative;margin-top:#{(deviceScope.hardware.screen.availableHeight-200)/2}px;margin-left:#{(deviceScope.hardware.screen.availableHeight*10)/100}px;margin-right:#{(deviceScope.hardware.screen.availableHeight*10)/100}px;width:#{deviceScope.hardware.screen.availableWidth};height:200px;">
    <amx:outputText value="Popup at center of the window" id="ot4"/>
</amx:popup>
Application screen looks like below when it deployed to IOS simulator.

7 comments:

  1. awesome post i really like this post.

    ReplyDelete
  2. This comment has been removed by the author.

    ReplyDelete
  3. Thank you, it was so helpfull.


    Deepak,
    Can you please mention how to invoke a popup from java.
    Now i am using 'amx:showPopupBehavior' in the amx page.



    Thanks,
    Anish Michael

    ReplyDelete
  4. Thanks your blog is awesome.
    thanks for sharing information.
    Videocon 2.75g Internet plan
    Videocon Telecom invests approx Rs 130 Cr to upgrade its network to 2.75G EDGE, a 3G standard technology, to enhance Customer experience on data speed. Rolls out a full-fledged marketing campaign to get Customer attention.

    ReplyDelete