T.K
T.K

Reputation: 67

How can a dialog determine the correct size for contained NavContainers?

I want to add a popup to my application that contains a NavContainer. I need this to switch between two different views within the popup later. Now the NavContainer seems to need a fixed value for height and width to display content. Otherwise the popup will only be displayed in the size of the header and footer line. I realized that I can fix the size, but that's not the sense of a responsive application.

My code looks like this without the fixed information:

<core:FragmentDefinition
  xmlns="sap.m"
  xmlns:core="sap.ui.core"
  xmlns:l="sap.ui.layout"
  xmlns:f="sap.ui.layout.form"
>
  <Dialog id="genericDialog"
    showHeader="false"
    title="Detail View"
  >
    <NavContainer>
      <Page id="page1">
        <List items="{/avGenericSet}">
          <CustomListItem class="sapUiResponsiveMargin">
            <ObjectIdentifier title="{title}"/>
            <Input value="{value}"/>
          </CustomListItem>
        </List>
      </Page>
      <Page id="page2">
        <!-- ... -->
      </Page>
    </NavContainer>
    <endButton>
      <Button text="Close" press="closeGenericDialog"/>
    </endButton>
  </Dialog>
</core:FragmentDefinition>

The behavior can be observed in all popup types (Dialog, Popover, ResponsivePopover). Does any of you know a workaround or do I have to say goodbye to a "responsive" popup?

Upvotes: 1

Views: 8269

Answers (1)

Boghyon Hoffmann
Boghyon Hoffmann

Reputation: 18054

Try with contentHeight="100%" (and contentWidth if required) from the Dialog. Here is an example: https://embed.plnkr.co/7nimup1UMGsifeDQ?show=view/fragment/Dialog.fragment.xml,preview

openui5 sapui5 navcontainer and page within Dialog

Upvotes: 3

Related Questions