SapUI5- Tile container not working

StackOverflow https://stackoverflow.com//questions/25051263

  •  21-12-2019
  •  | 
  •  

Question

For some reason the tilecontainer is not working. If I place a list instead of Tiles , its working fine. I am trying to build a simple app which contains tiles. I am new to SAPUI5. This is the code of XML.

<mvc:View height="100%" controllerName="sap.ui.demo.Onepage.view.App"
xmlns:mvc="sap.ui.core.mvc" displayBlock="true" xmlns="sap.m">
<App>
    <Page id="" title="Tiles" class="marginBoxContent">
        <headerContent>
            <Button icon="sap-icon://filter" />
            <Button icon="sap-icon://action-settings" />
        </headerContent>
        <subHeader>
        </subHeader>
        <content>
            <TileContainer id="container" tileDelete="handleTileDelete"
                tiles="{
                        path: '/items'
                    }">
                <StandardTile icon="sap-icon://{icon}" type="{type}"
                    number="{number}" numberUnit="{numberUnit}" title="{title}" info="{info}"
                    infoState="{infoState}" />
            </TileContainer>
        </content>
        <footer>
        </footer>
    </Page>
</App>

Thanks in advance.

Was it helpful?

Solution

Sometimes the TileContainer can be a bit tricky. You have to take care of some attributes in the parent container. Make sure your Page uses the following attribute:

<Page enableScrolling="false">

And one more pitfall could be that you´re using data binding. As long there is no object in your model at /items no single tile will be rendered. So either make sure that your model contains items and the model is assigned to your view or start testing it without binding the tiles property and do it static like this:

<mvc:View height="100%" controllerName="sap.ui.demo.Onepage.view.App"
xmlns:mvc="sap.ui.core.mvc" displayBlock="true" xmlns="sap.m">
<App>
    <Page id="" title="Tiles" class="marginBoxContent"
        enableScrolling="false">
        <headerContent>
            <Button icon="sap-icon://filter" />
            <Button icon="sap-icon://action-settings" />
        </headerContent>
        <subHeader>
        </subHeader>
        <content>
            <TileContainer id="container" tileDelete="handleTileDelete">
                <StandardTile icon="sap-icon://temperature" type="None"
                    number="23°" numberUnit="Celcius" title="Walldorf" info="Cloudy" />
            </TileContainer>
        </content>
        <footer>
        </footer>
    </Page>
</App>

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top