Enable scrolling in StackPanel

[konst-sh]

I was able to create StackPanel which should represent a variable length array of text boxes and I'd like to be able to scroll it. I thought just specifying StackPanel.verticalScrollBarVisibility ScrollBarVisibility.Visible should at least make the scroller visible however it doesn't do anything. I have the maxHeight specified.

        let completedItemsPanel =
            let items = 
                StackPanel.create [
                    StackPanel.orientation Orientation.Vertical
                    StackPanel.dock Dock.Top
                    StackPanel.horizontalAlignment HorizontalAlignment.Center
                    StackPanel.verticalAlignment VerticalAlignment.Top
                    StackPanel.maxHeight 500.0
                    //StackPanel.height 500.0
                    StackPanel.verticalScrollBarVisibility Primitives.ScrollBarVisibility.Visible
                    //StackPanel.horizontalScrollBarVisibility Primitives.ScrollBarVisibility.Visible
                    StackPanel.children [
                        for item in state.completedItems -> renderCompletedItem item
                    ]
                ]
            items

However the app window still looks like this:

Is it suppose to work? or I need to recreate a binding for ScrollViewer component which some old SO answer recommends? Thanks!

Upd: Even if wrap this StackPanel in the ScrollViever it still doesn't help:

        let completedItemsPanel =
            let items = 
                StackPanel.create [
                    StackPanel.orientation Orientation.Vertical
                    StackPanel.dock Dock.Top
                    StackPanel.horizontalAlignment HorizontalAlignment.Center
                    StackPanel.verticalAlignment VerticalAlignment.Top
                    StackPanel.maxHeight 500.0
                    StackPanel.verticalScrollBarVisibility Primitives.ScrollBarVisibility.Visible
                    StackPanel.children [
                        for item in state.completedItems -> renderCompletedItem item
                    ]
                ]

            ScrollViewer.create [
                ScrollViewer.isEnabled true
                ScrollViewer.isVisible true
                ScrollViewer.verticalScrollBarVisibility Primitives.ScrollBarVisibility.Visible
                ScrollViewer.maxHeight 500.0
                //ScrollViewer.horizontalScrollBarValue 10.0

                ScrollViewer.content items
            ]

[JordanMarr]

I believe your issue is due to the fact that your StackPanel height is set to the same size as the outer ScrollViewer.
Remove the StackPanel height (so it can grow as needed); it will then be limited by the outer ScrollViewer height.

(btw, I deleted my last answer because it was incorrect).

[konst-sh]

Yes, it worked, thank you! What is the best place to look for nuances like this in the future? The docs on https://docs.avaloniaui.net/ seem to be pretty terse. Do I need to dig directly WPF docs?

[JordanMarr]

Awesome!

Avalonia.FuncUI has its own docs page here:
https://avaloniacommunity.github.io/Avalonia.FuncUI.Docs/

However, I think there was some talk about moving it so it could be located alongside the code (which would probably result in it getting more updates).

[JordanMarr]

Actually, scratch that...
The FuncUI docs should now be hosted on the official Avalonia site, here:
https://funcui.avaloniaui.net/