Scrolling container with sub containers

Targets Web
1

I have a container named conScroller where it is set as scroll direction vertical

I then have the code below to fill it with 20 containers called conNewMatch

The code sets the conScroller hight to a fixed height after filling with the 20 conNewMatch containers.

All works well but there is no vertical scroll bar. Is this my code or a bug?

Thanks

Windows 11 pro
R25.2


Var conscroller1 As New conScroller
conscroller1.EmbedWithin(Self, 0, 0, Self.Width, Self.Height)

Var topOffset As Integer = 30
Var itemHeight As Integer = 100 
For i As Integer = 1 To 20
  
  Var listItem As New connewmatch
  listItem.EmbedWithin(conScroller1, 30, topOffset, conScroller1.width, itemHeight)
  topOffset = topOffset + itemHeight
Next

conScroller1.height= 400
2

You’re responsible for implementing the scroll behavior on a Container or a Canvas control. You’ll probably need to add a Scrollbar control and/or implement the ScrollVertical event on the Container itself.

3

@Eric_Williams -this is web, not desktop

4

Does the container scroll even though there’s no scroll bar?

5

Hi Thanks for the response,

Using the mouse wheel works fine its just no visible scroll bar

6

Oops, thanks. Didn’t notice the tag.

7

Thanks to Robin and Ricardo

To “make it work” you can move the code from WebPage1 Opening event to Shown event.

Maybe use LockRight = True after EmbedWithin, that way the scrollbar will stay on the browser right side.

8

Now you can upload zip files to your posts. This can help others help you.
I was able to comment on your Issue because it had an example so I was able to see what you meant.

Here is your project:
containerScroll.xojo_binary_project.zip (9.5 KB)

That is what I said :wink:

The Opening event of a WebPage the Self.Width is the size defined using the IDE but once the browser shows the page the Width can be larger or smaller than that.
Your code set the width as 1200 but if your browser is narrow you won’t see the scrollbar. If your browser is wider, then you will see the scrollbar way to the left of the right side of the browser edge.

Changing your code from Opening to Shown event, the Self.Width now is what the browser is actually showing, it could be 900 or 2000.

I hope this help you understand the problem you had.

9

Hi Alberto

Thanks for that ,sorry I missed your original post.

Grant