Inventory page type not displaying on mobile phone

Hi Xerte Community,
Sorry, me again hoping you can help with the Inventory page type. My colleague has developed an Inventory page but there are problems when it displays on a mobile phone. For example, the text is bunched up together on the chart. I attach screenshots of how the page is displaying and below is the text from my colleague.

"Image 0711 shows the bunched up text when you get the inventory chart

Image 0712 shows the accordion menu on the final page. Whilst I have taken the pic with the Digital Guru collapsed, this is normally expanded as you enter the page and you have to go right to the bottom to find the next item and click onto it. If I click onto the expand item next to digital guru then it will expand the menu but then refuses to collapse again."

I have looked on your 'Accessibility' grid and have seen that the Inventory page is rated as 3 (high) meaning it should display OK.

Please help!
Thank you
Anne

Hi Anne
These look like bugs - I'll log them & see what we can do
Thanks
Fay

Hi Fay, thank you for logging the bugs. My colleague is looking forward to using this page type as it fits well with what we are trying to do. So hopefully it will be sorted. Thanks. Anne

HI all Xerte developers,
With version 3.8.1 has the bug been fixed with the Inventory page so that it displays properly on a mobile device? The bunched up text on the phone was previously concluded as being a bug and I just wondered if it is fixed in the 3.8.1 release?

Thanks in advance for your reply .
Anne

Hi Anne
I know Fay described this as a bug previously but it isn't really. Depends on definition of a bug.
Nothing has changed in v3.8 as far as the issue you reported.
Looking at your previous screenshots I can see that what you reported is that in portrait mode on a mobile phone the bar chart labels overlap because there isn't room for 5 or 6 lengthy labels when viewed in portrait mode on a smart phone. If you had fewer class names, or shorter class names it will probably display ok even in portrait mode. So I think there are two or three possible solutions for now which would work with Xerte X and 3.8x:

1. Prompt the user in the instructions
e.g. If you are viewing this page on a smartphone switch to landscape view before completing this interaction.

2. Shorten the class names and provide a key
e.g. use DG, MM, DN etc and provide a key in the instructions as to what they refer to. e.g. DN = Digital Networker

3. Prompt the user to only interact with this particular page when using a larger screen device

The bottom line is your current interaction has too many classes and the class names are too long to fit horizontally in portrait view on a smart phone. Also the canvas element used to draw and display the results doesn't automatically change size and shape when you change orientation so you need to switch to landscape on a phone before doing the interaction. If we tried to make the text small enough to fit on portrait mobile with the number and length of classes you currently have it wouldn't be readable anyway.

HTH
Ron

Hi Ron,
Thanks for your reply which is really useful. I have passed your reply to my colleague who is developing this Xerte so that he knows where to make his changes with his Learning Object. Thanks again. Anne