Matlab App Designer: Scrolling within tab. Does not scroll down enough to see image.

Hello,

I'am using App Designer. I can scroll down within a tab but it stops halfway I would like to go. So the bottom image is not vissible.

It simply does not scroll down far enough.

The INTERACTIVITY - Scrollable checkbox is checked.

Does anyone have any sugestion?

Thanks

[Geoff Hayes]

@Thomas Meesters - can you attach a small working example that demonstrates this behaviour?

[Thomas Meesters]

Hi Geoff,

This is an example of two options, which I tried. Maybe I'm doing something wrong.

Thanks,

Thomas

[Geoff Hayes]

@Thomas Meesters - I wonder if the issue is because both of your image controls extend outside of the top and the bottom of the tab group. If only the top one extends outside, then the scroll bar appears and you can scroll as expected.

I looked at the example from https://www.mathworks.com/matlabcentral/answers/466402-how-can-i-enable-scrolling-on-a-tab-in-app-designer. Maybe you need to do the same.

[Megan Renny]

I'd like to mention I'm also having this issue, and looking at the suggestions "make sure your component extends off your scrollable-enabled parent container isn't working. I am attaching images of what my app design looks like and the app's page missing the scroll bar.

The Panel, which is a child of the tab with scroll enabled, itself has UIAxis objects inside of it that just aren't rendred, but you can see from the Component Browser are being accepted as present and inside the panel. These 10 axes are stacked vertically in the panel and the pannel goes off the tab.

As you can see from the second image, no scroll bar was generated in the app when run.

Answer 1

[David Meissner]

I agree this is a little tough to figure out from the doc, but you have to have your app look like what's shown in the image on the left so that, when run, it looks like what's shown in the image on the right. I found the trick is to first make everything that is going to go into a tab or a panel (the thing I'm going to make scrollable) fit nicely. Then carefully select everything in that (here I used a panel, so I'll call it...) panel and click and drag it upward so that 1) the only what you expect to show in the soon to be smaller scrollable panel is left in the panel. Note: The way to know you're doing it right and not just moving things out of the panel is when you're doing this you've got everything selected and while moving it the panel is still that blue color that tells you "hey, that object you're dragging is inside this panel. 2) Select the panel and grab the bottom outside border and drag it up to where you want the bottom of the final scrollable panel. 3) Ensure you have scrollable checked for that panel or have set its scrollable property to "on" if you're doing it programmatically. Please ignore the fact that I have tabs in this image. They have nothing to do with this other than you can do everything I talked about doing on a panel, on a tab instead. Also, if you want a horizontal scroll bar to show up, the content has to "not fit" horizontally when you start the app.

[David Meissner]

btw I'm using release 2022b here.