Panel Scroll Issue in SAP Mobile BI APP on IPAD

[Former Member]

Hi All.

I have used a Checkboxgroup component inside a panel container component in SAP BO Design Studio 1.5 and added the below css class for the panel container. When checkboxgroup list overflows, the panel container adds a scroll to the panel. It is working fine in desktop, when i try to use it in SAP BI mobile app, the scroll bar is not showing up. I readScrollable Panel in Design Studio (to show bigger content) which mentions about iscroll. Any idea how to modify the below css class to include iscroll? Also is there another way to add scroll to a panel container while consuming on BI Mobile APP?

div.zenborder div.scroll-y {

  /* do not allow X scroll */

  overflow-x: hidden !important;

  /* allow Y scroll */

  overflow-y: auto !important;

}

Searched the forum, didn't find anything on how to modify the CSS to include scroll for panel containers on mobile device.

Appreciate any help on this.

Thanks,

Nithin

[MustafaBensan · Accepted solution]

Hi Nithin,

This presents a bit of a dilemma.  In my experience and as you have seen from the discussion in the post you have referenced, there definitely seems to be issues with mobile scrolling in Design Studio.  The problem is that for some reason, native scrolling does not get activated in the iOS browser.  The issue is not limited to the BI Mobile app but also occurs when you launch the Design Studio app directly in the iOS browser (via the Send to Mobile Device option for example).

Using iScroll is a workaround to this problem but since it is a JavaScript library you need to load and invoke it from within an SDK component.  However, in your case, as I understand it you are trying to use the standard panel and checkbox group components with CSS.  Unless others have suggestions, as far as I am aware, in your scenario you can't simply invoke iScroll only from the CSS.

I suppose you could raise an SAP Support Ticket indicating that your current CSS is not working on mobile although it works on desktop but it might be considered non-standard usage given that mobile scrolling on other standard components such as the Listbox does work.

Regards,

Mustafa.

[Former Member · Accepted solution]

Hi Mustafa,

Thanks for the response. We will create a ticket with SAP and see what they suggest. For now i will be replacing the checkbox group component with a listbox with multi select which works fine on IPAD. since the script properties of checkbox group and listbox is very similar, all i have to do is just add the listbox and delete the checkbox group and rename the listbox with exact name i was using for checkbox group. It works fine. I tested it on ipad. luckily there is no script change for this 🙂

I wish scrolling should have been part of the container components itself just like any other tools.

Regards,

Nithin

[MustafaBensan · Accepted solution]

Hi Nithin,

Thanks for the feedback.  Please share the result of the SAP Support Ticket .

Regards,

Mustafa.

[xjhacking · Accepted solution]

Nithin GopalaKrishna wrote:

For now i will be replacing the checkbox group component with a listbox with multi select which works fine on IPAD. 

Hi Nithin,

Did you also get this working on an iPhone? I tried it with a Listbox component but it just won't scroll at my iPhone using the SAP BO Mobile app (iPhone 5s, Design Studio 1.6).

Thanks,

Xavier

[xjhacking · Accepted solution]

Okay, I think I found the solution for my Listbox mobile scrolling problem: Use the new sap.m library. I tested this and it now does scroll in mobile, even with a multiple select option! So I'll migrate my app to SAPUI5 m Mode (Tools menu).

/Xavier