Responsive design

Most prominent question - Does GTK want to move towards the kind of responsive design that web browsers implement? If not, what alternative do we want to offer?

• We make a lot of custom containers for responsive design at Endless. First of all it would be good to figure out how to make these more general.
• Examples of what we've written:

  • GtkOverflowBox

    • 1-D box, widgets that fall off the end are not shown
    • Patch from feaneron?

  • GtkBin subclass for responsive margins

    • Adds CSS classes .small, .medium, etc. depending on widget width
  • Many containers that implement something like this

    • +-------+-----+       +-----+---+
      |       |  B  |       |     | B |
      |       +-----+       |  A  +---+
      |   A   |  C  |  -->  |     | C |
      |       +-----+       +-----+---+
      |       |  D  |
      +-------+-----+

  • GtkWindow subclass that adds .composite CSS class when on a composite TV out screen

• API proposal for widget to add to GTK:

  • Merge GtkOverflowBox from Endless and GsHidingBox from Software

  • One-dimensional box with orientation property

  • Don't inherit from GtkBox (pack from one side only)

  • "Priority" child property; when there is not enough room for all widgets, the one with the lowest priority drops off
  • in the event of a priority tie, endmost widget of that priority drops off
  • The above implies that the default behaviour when priority not set is that widgets drop off the end one by one when there is no room for them
  • No provisions made for reparenting the widgets elsewhere
• Can only use child-visible, not real show/hide
  • This is probably OK

  • Case that would be pathological with real show/hide: three buttons in a GtkOverflowBox, with this CSS:

    • button:nth-child(even):last-child {
        font-size: 100px;
      }

• Difficult to write widgets that are general for this purpose. Currently our custom containers only work with our custom widgets as children
  • Need to make sure to implement height-for-width and minimal/natural size correctly
• Impossible to change things like font-size in response to window size, without degrading performance and causing second size allocate
• @media queries

  • Spec

  • It's way more appropriate to put as much as possible into the CSS than in code
  • In web browser, the CSS cannot influence the viewport size, but in GTK it can
    • Infinite loops are a problem because of this:

      • @media(max-width: 500px) {
            window { padding-left: 550px; }
        }

  • Device width/height/aspect-ratio should be possible and useful
    • Other ideas from Company, such as media queries for GTK minor versions
    • Would accept patch for media queries that don't touch the viewport
  • Are @media queries on the viewport even a desired feature in GTK if someone were to implement them?
    • ???
• @media queries "lite": CSS features that would help a lot even if not all the way

  • Viewport units

  • Percentages interpreted as percentage of parent size
  • max-width
  • Would these be desired features if someone were to implement them?
    • Possibly for CSS properties that don't affect widget size, such as background-size.
    • Would be difficult to implement, because we don't have access to the widget (let alone its parents) during either the actual value computation or the rendering.