Centering and responsive

[naotoxxx]

Hi everyone , i have this table width=100% but as you can see there's too much losted space so i want to reduce it to 60% of width and centering i could do it with css but i'm sure that sapui5 have tools for this

i tried this:

<Panel>
	<FlexBox
		height="auto"
		alignItems="Center"
		justifyContent="Center">
			<items>
				<Table items="{ path : '/MaterialListSet' }" width="50%">
				<columns>
					<Column>
						<Text text="Material" />
					</Column>
					<Column
						minScreenWidth="Tablet"
						demandPopin="true">
						<Text text="Responsable" />
					</Column>
					<Column
						minScreenWidth="Desktop"
						demandPopin="true"
						hAlign="End">
						<Text text="Ult. Modif" />
					</Column>
					<Column
						minScreenWidth="Desktop"
						demandPopin="true"
						hAlign="Center">
						<Text text="Tipo de Material" />
					</Column>
					<Column
						hAlign="End">
						<Text text="Grupo de Material" />
					</Column>
				</columns>
				
				
				<items>
				
					<ColumnListItem>
						<cells>
							<ObjectIdentifier
								text="{MATERIAL}"/>
							<Text
								text="{RESPONSABLE}" />
							<Text
								text="{ULT_MODIF}" />
							<Text text="{MTYPE}" />
							<ObjectNumber
									number="{GP_ART}" />
						</cells>
					</ColumnListItem>
				
				</items>
				
				</Table>
			</items>
		</FlexBox>
</Panel>

and in mobile devices i need that this table with width 100%, what do you suggest ???

[francesco_alborghetti · Accepted solution]

One option is to set property fixedLayout of sap.m.Table to false. This will adapt the table to the content. But it will overflow on mobile device.

You can set it to :

fixedLayout="{device>/system/phone}"

So that in mobile device the layout will be fixed again.

Here a jsfiddle.

Please check also sap.m.Table API, because setting fixedLayout to false can have some impacts on table rendering.

[naotoxxx · Accepted solution]

oh thanks! with the vertical align what do you recommend?