Is it possible to put more than one UI element in Custom tile?

[former_member317001]

Hi,

Currenlty, I need to display two different kind of UI elements on tile control.

I tried using custom tile as below.

<CustomTile xmlns="sap.m"

  id="id"

  removable="true"

  press=""

  frameType="TwoByOne" width="100%">

  <tooltip></tooltip> <!-- sap.ui.core.TooltipBase -->

  <dependents></dependents> <!-- sap.ui.core.Control, since 1.19 -->

  <content>

  <vbm:GeoMap id="vbi" width="50%" height="100%" NavigationControl="false"  initialPosition="72.8258;18.9750;0" initialZoom="15" scaleVisible="false" render="render" zoom="zoom" submit="open" openWindow="open">

  <vbm:vos>

  <vbm:Spots spots="{/Spots}" >

  <vbm:Spot  position="{pos}" tooltip="{tooltip}" text="2" image="{pin}" />

  </vbm:Spots>

  <!-- <vbm:Spots spots="{/OtherSpots}" >

  <vbm:Spot position="{pos}" tooltip="{tooltip}"/>

  </vbm:Spots> -->

    </vbm:vos>

    </vbm:GeoMap>

<vbm:GeoMap id="vbi2" width="50%" height="100%" NavigationControl="false"  initialPosition="72.8258;18.9750;0" initialZoom="15" scaleVisible="false" render="render" zoom="zoom" submit="open" openWindow="open">

  <vbm:vos>

  <vbm:Spots spots="{/Spots}" >

  <vbm:Spot  position="{pos}" tooltip="{tooltip}" text="2" image="{pin}" />

  </vbm:Spots>

  <!-- <vbm:Spots spots="{/OtherSpots}" >

  <vbm:Spot position="{pos}" tooltip="{tooltip}"/>

  </vbm:Spots> -->

    </vbm:vos>

    </vbm:GeoMap>

  </content>

  <!-- sap.ui.core.Control -->

</CustomTile>

I tried putting 2 geomap control on custom tile, but second map is getting displayed on top of first map.

Because of which I am not able to see the first map.

So please let me know, Is it possible to put more than one control on custom tile in horizontal layout or vertical layout.

Regards,

Chandru.

[former_member182372 · Accepted solution]

did you try to put them in HBox

like

<HBox>

<content>

<vbm:GeoMap id="vbi" ...

<vbm:GeoMap id="vbi2"....

</content>

</HBox>

[former_member317001 · Accepted solution]

Hi Maksim,

I tried <HBOX> but it's not working.

Regards,

Chandru.

[saivellanki · Accepted solution]

Hi Chandru,

When you're wrapping two GeoMaps in a HBox, you have to use width and height in form of "px".

Check the working sample with two GeoMaps in Custom Tile using HBox - Plunker - GeoMap

Regards,

Sai Vellanki.

[former_member317001 · Accepted solution]

Yes it's working..

Thanks Sai Vellanki...

[saivellanki]

Hi Chandru,

Yes you can add multiple UI elements in Custom Tile. But, make sure that you're increasing the width and height of custom tile. Since, the default width is 8.5em and height is 10em.

Check this sample, where I used multiple UI elements in custom tile - Plunker - CustomTile

Regards,

Sai Vellanki.

[SergioG_TX]

HI Chandru,

are you able to add css to the xml containers.. perhaps some padding between the two geo map containers.. or some margin. this will definitely allow you to have them next to each other...

[former_member317001]

Hi Sergio,

I have not added css to my xml.

Please refer my code and suggest something to play around within xml, by which I can show two maps side by side on custom tile.

Regards,

Chandru.