GTK4 ScrolledWindow renders content unreadable

Question

I am learning GTK4 and Python. While playing round with the Gtk.StackSidebar class, I came across this strange behavior that I cannot seem to figure out.

I want my sidebar on the left, and my content to be scrollable. To do this I introduced a Gtk.ScrolledWindow container between the content (grid) and the stack. When I do this, the content of the grid is no longer readable, as it has been cut down in size. However, the small content is scrollable now.

Here is what it looks like: See image

I would like to understand why, when the grid is wrapped in a Gtk.ScrolledWindow its contents is shrinked, leaving extra unwanted space for the stack sidebar.

My code:

#!/usr/bin/python

import sys
import gi
gi.require_version('Gtk', '4.0')
gi.require_version('Adw', '1')
from gi.repository import Gtk, Adw


class MainWindow(Gtk.ApplicationWindow):

    def __init__(self, *args, **kwargs):

        super().__init__(*args, **kwargs)

        self.set_title("Demo")
        self.set_default_size(400, 400)

        #
        # Create grid and add some content to be scrolled
        #

        self.grid = Gtk.Grid()

        for row in range(50):
            self.grid.attach(Gtk.Label(label = "Text Text Text Text Text Text Text Text Text"), 0, row, 1, 1)
 
        #
        # Wrap grid in ScrolledWindow
        #

        self.scrollableContent = Gtk.ScrolledWindow()
        self.scrollableContent.set_child(self.grid)

        #
        # Create a stack, Add the ScrolledWindow.
        #

        self.content = Gtk.Stack()
        self.content.add_titled(self.scrollableContent, "Scrollable", "Content . . . . . . . . ")

        #
        # Create the sidebar and add the stack.
        #

        self.sidebar = Gtk.StackSidebar()
        self.sidebar.set_stack(self.content)

        #
        # Create a box to hold the sidebar and the content stack side by side Horizontaly.
        #

        self.structure = Gtk.Box(orientation=Gtk.Orientation.HORIZONTAL)

        self.structure.set_homogeneous(False) # just to be sure

        self.structure.append(self.sidebar)      
        self.structure.append(self.content)

        #
        # Set the box as the content of the window it self.
        #

        self.set_child(self.structure)




class DemoApp(Adw.Application):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.connect('activate', self.on_activate)


    def on_activate(self, app):
        self.win = MainWindow(application=app)
        self.win.present()

app = DemoApp(application_id="com.vildljung.Demo")
app.run(sys.argv)

Are you looking for a technical solution or only to understand what is happening? — BobMorane, Jul 16 '23 at 13:16

score 0 · Accepted Answer · answered Jul 18 '23 at 14:58

It seems that by default, the GtkScrolledWindow does not take into account the child widget's dimensions when computing its own.

In your case, it seems the height was computed accordingly, but not the width. The API proposes this function:

void
gtk_scrolled_window_set_propagate_natural_width (
  GtkScrolledWindow* scrolled_window,
  gboolean propagate
)

which makes sure the child's widget's dimensions are propagated to the scrolled window dimensions.

I tried it on Gtkmm3.24 and it solved the issue.

Source : https://gitlab.gnome.org/GNOME/gtk/-/issues/3515

self.scrollableContent.set_propagate_natural_width(True) Problem solved. Thank you! — Björn Vildljung, Jul 18 '23 at 20:21

GTK4 ScrolledWindow renders content unreadable

1 Answers1