Skip to Content
0

Master/Detail+ObjectHeader+IconTabBar: How to Scroll only IconTab content?

Oct 05, 2017 at 08:57 AM

17

avatar image
Former Member

Hi,

I have a master/detail application .

the detail page consists of an ObjectHeader and an IconTabBar with several Tabs.

I want especially the IconTabBar to be always visible and have scrolling only on the IconTab content. How do I achieve this best?

Regards,

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

1 Answer

Vedaradhya Agrahar Oct 05, 2017 at 12:32 PM
0

Hi Ramji,

If you want IconTabBar always expanded, their is a property in IconTabBar Control expandable="false" , next one

you can use panel and scrollcontainer inside IconTabFilter to enable scrolling the content of IconTabBar.

for example:

<semantic:DetailPage title="detailTite">
	<semantic:content>
		<ObjectHeader id="objectHeader" title="{ContactName}"></ObjectHeader>
		<IconTabBar id="iconTabBar" class="sapUiResponsiveContentPadding" expandable="false">
			<items>
		 	    <IconTabFilter id="iconTabBarFilter1" icon="sap-icon://hint">
				<Panel height="200px">
				     <ScrollContainer>
                                          <!--content code here-->
				     </ScrollContainer>
                                </Panel>
			     </IconTabFilter>
				
                            <IconTabFilter id="iconTabBarFilter2" >
                               <Panel height="200px">
				     <ScrollContainer>
                                          <!--content code here-->
				     </ScrollContainer>
                                </Panel>
                            </IconTabFilter>
			</items>
		</IconTabBar>
	</semantic:content>
</semantic:DetailPage>
  

Note: Instead of using Panel and ScrollContainer you can also handle this by setting height to IconTabBarContent using your own custom css.

Regards,

Vedaradhya.

Share
10 |10000 characters needed characters left characters exceeded