cancel
Showing results for 
Search instead for 
Did you mean: 
Read only

Flexible Column Layout in SAP UI5

ishanki7
Associate
Associate
0 Kudos
183

Is there a way to manually change the values for layout data for desktop or tablet. In thinkpad laptops, the Device API detects the device as both desktop and tablet hence providing only 33 and 67% ratios in the below provided layout, though I want it to be 25/50/25 as provided for desktop. 

ishanki7_0-1737916402628.png

I even tried using this approach, but doesn't seem to work. 

    <App>
        <pages>
            <f:FlexibleColumnLayout
                id="flexibleColumnLayout"
                layout="ThreeColumnsMidExpanded"
            >
                <f:layoutData>
                    <f:FlexibleColumnLayoutData>
                        <f:desktopLayoutData>
                            <f:FlexibleColumnLayoutDataForDesktop
                                threeColumnsMidExpanded="20/60/20"
                            />
                        </f:desktopLayoutData>
                        <f:tabletLayoutData>
                            <f:FlexibleColumnLayoutDataForTablet
                                threeColumnsMidExpanded="20/60/20">
                               
                            </f:FlexibleColumnLayoutDataForTablet>
                        </f:tabletLayoutData>
                    </f:FlexibleColumnLayoutData>
                </f:layoutData>
                <f:beginColumnPages>
                    <Page showHeader="false">
                        <content>
                            <List
                                id="userTrainingPlansList"
                                items="{userTrainingPlans>/}"
                                headerText="{i18n>existingPlans}"
                            >
                                <items>
                                    <StandardListItem
                                        title="{userTrainingPlans>TrainingPlanName}"
                                    />
                                </items>
                            </List>
                        </content>
                    </Page>
                </f:beginColumnPages>
                <f:midColumnPages />
                <f:endColumnPages />
            </f:FlexibleColumnLayout>
        </pages>
    </App>

Kindly provide a solution for this if possible. 

Accepted Solutions (0)

Answers (0)