sap.f.SemanticPage: не удается добавить более 1 элемента управления содержимым

Я пытаюсь отобразить три панели на странице моего объекта, но по какой-то причине отображается только последняя панель, как показано на снимке экрана:

Объектная страница

Object.view.xml выглядит следующим образом:

<mvc:View controllerName="ns.mngportfolios.controller.Object" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" xmlns:semantic="sap.f.semantic" xmlns:form="sap.ui.layout.form">

  <semantic:SemanticPage id="page" headerPinnable="false" toggleHeaderOnTitleClick="false" busy="{objectView>/busy}" busyIndicatorDelay="{objectView>/delay}">

    <semantic:titleHeading>
      <Title text="{PORTFOLIO_NUMBER}" level="H2" responsive="true" />
    </semantic:titleHeading>

    <semantic:headerContent>
      <ObjectNumber number="{
                        path: 'EBITDA',
                        formatter: '.formatter.numberUnit'
                    }" />
      <ObjectAttribute text="{COMPANY_NAME}" />
    </semantic:headerContent>

    <Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>portfolioTitle}" expandable="{device>/system/phone}" expanded="true">
      <content>
        <form:SimpleForm id="objectForm">
          <form:content>
            <Label text="{i18n>portfolioSharesLabel}" />
            <Text text="{PORTFOLIO_SHARES}" />
            <Label text="{i18n>portfolioNameLabel}" />
            <Text text="{PORTFOLIO_NAME}" />
            <Label text="{i18n>portfolioDepreciationLabel}" />
            <Text text="{= ${DEPRECIATION} + ' ' + 'EUR'}" />
          </form:content>
        </form:SimpleForm>
      </content>
    </Panel>

    <Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>yearTitle}" expandable="{device>/system/phone}" expanded="false">
      <content>
        <List id="companyList">
          <items>
            <StandardListItem icon="sap-icon://building" title="Building1" />
            <StandardListItem icon="sap-icon://email" title="[email protected]" />
            <StandardListItem icon="sap-icon://world" title="google.com" />
            <StandardListItem icon="sap-icon://phone" title="+00123456789" />
            <StandardListItem icon="sap-icon://map" title="23 Wall st, 10005 NY" />
          </items>
        </List>
      </content>
    </Panel>

    <Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>mapTitle}">
      <Image src="{
                        parts: [
                            '23 Wall St',
                            '10005',
                            'New York',
                            'United States'
                        ],
                        formatter: '.formatter.formatMapUrl'
                    }" />
    </Panel>

    <semantic:sendEmailAction>
      <semantic:SendEmailAction id="shareEmail" press=".onShareEmailPress" />
    </semantic:sendEmailAction>


  </semantic:SemanticPage>

</mvc:View>

Может ли кто-нибудь помочь мне определить недостающую часть здесь?


sapui5 sap-fiori
person Maissa BM    schedule 28.08.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

агрегация контента sap.f.semantic.SemanticPage имеет кардинальность 0..1. Это означает, что мы можем добавить максимум один дочерний элемент управления. Чтобы выполнить задачу отображения 3 панелей, попробуйте встроить все три панели в контейнер. Несколько примеров контейнеров, которые можно использовать, можно найти на странице примеры в категории контейнеры и макеты.

Чтобы привести пример: -

<mvc:View controllerName="ns.mngportfolios.controller.Object" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" xmlns:semantic="sap.f.semantic" xmlns:form="sap.ui.layout.form">
  <semantic:SemanticPage id="page" headerPinnable="false" toggleHeaderOnTitleClick="false" busy="{objectView>/busy}" busyIndicatorDelay="{objectView>/delay}">
    <semantic:titleHeading>
      <Title text="{PORTFOLIO_NUMBER}" level="H2" responsive="true" />
    </semantic:titleHeading>
    <semantic:headerContent>
      <ObjectNumber number="{
                        path: 'EBITDA',
                        formatter: '.formatter.numberUnit'
                    }" />
      <ObjectAttribute text="{COMPANY_NAME}" />
    </semantic:headerContent>
    <VBox>
    <items>
    <Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>portfolioTitle}" expandable="{device>/system/phone}" expanded="true">
      <content>
        <form:SimpleForm id="objectForm">
          <form:content>
            <Label text="{i18n>portfolioSharesLabel}" />
            <Text text="{PORTFOLIO_SHARES}" />
            <Label text="{i18n>portfolioNameLabel}" />
            <Text text="{PORTFOLIO_NAME}" />
            <Label text="{i18n>portfolioDepreciationLabel}" />
            <Text text="{= ${DEPRECIATION} + ' ' + 'EUR'}" />
          </form:content>
        </form:SimpleForm>
      </content>
    </Panel>

    <Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>yearTitle}" expandable="{device>/system/phone}" expanded="false">
      <content>
        <List id="companyList">
          <items>
            <StandardListItem icon="sap-icon://building" title="Building1" />
            <StandardListItem icon="sap-icon://email" title="[email protected]" />
            <StandardListItem icon="sap-icon://world" title="google.com" />
            <StandardListItem icon="sap-icon://phone" title="+00123456789" />
            <StandardListItem icon="sap-icon://map" title="23 Wall st, 10005 NY" />
          </items>
        </List>
      </content>
    </Panel>

    <Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>mapTitle}">
      <Image src="{
                        parts: [
                            '23 Wall St',
                            '10005',
                            'New York',
                            'United States'
                        ],
                        formatter: '.formatter.formatMapUrl'
                    }" />
    </Panel>
    </items>
    </VBox>
    
    <semantic:sendEmailAction>
      <semantic:SendEmailAction id="shareEmail" press=".onShareEmailPress" />
    </semantic:sendEmailAction>
  </semantic:SemanticPage>
</mvc:View>

Выберите элемент управления контейнером, который лучше всего соответствует вашим требованиям к макету. Это всего лишь пример.

person PKV    schedule 28.08.2020