Empty rows in ITSMobile screens
More fun deploying ITSMobile screens for mobile devices. This time, I was tasked with finding a way to shrink the screens so they fit better on the handheld devices used in our factories. It took a lot of research and trial and error, but I finally satisfied my users. Here’s a summary, all in one place.
First I concentrated on reducing the horizontal size of the screen elements. This turned out to be pretty easy: I created a custom generation style using this excellent walkthrough. I overrode the _COMPUTE_WIDTH_STRING method and changed the emfactor value from 1.0 to 0.8.
The vertical dimension proved more challenging. I knew I could save a lot of space by removing all the empty lines at the bottom of every screen, but it took me a while to figure out how to do this. Here’s the solution I ended up with: In my custom generator class, I overrode the _CONTENT_EMPTY_SPACE method, which is called for every empty cell. In the case of a empty row the generator writes a single empty cell that spans the entire screen. To trap this condition I added the following check:
IF pi_columns = _screen_header-columns.
Inside this block I grabbed the value of the style attribute ( l_replacement-value) and added ” height:1px; “. Now all the empty rows are shrunk down to 1 pixel in height, effectively removing them.
One last trick – our mobile devices use Internet Explorer which has a feature where the vertical scrollbar is always visible, even when it’s not needed. I added the following entry to my mobile.css stylesheet to hide the vertical scrollbar and regain some screen real estate:
/* --- HIDE VERTICAL SCROLLBAR -----*/
html, body {
overflow: auto;
}
Hey!!
One question. How did you delete the empty lines in ITSMobile?
I am getting a lot of lines like this:
/
/
/
/
/
/
/
/
/
/
Take as an example, dynpro 2212 of SAPLLMOB….
Thank you
The 3rd and 4th paragraphs of this article describe how to eliminate that empty space by reducing the vertical height of empty lines to 0.