Skip to content

Container queries (WidthQuery/HeightQuery) only work for Visuals #22166

Description

@OleRoss

Describe the bug

Container queries can attach to every StyledElement.

However for WidthQuery/HeightQuery, they require this styled element to be a Visual (as far as I understand because they have to walk the visual tree to find the tagged Layoutable). This leads to Styles in ContainerQueries not being applied just because they do not extend Visual which is very confusing.

From my understanding, this is a similar underlying issue to #21819, where parts of the codebase assume all StyledElements are Visuals.

To Reproduce

An example is TableViewColumn:

Basically, my goal is to dynamically show/hide certain columns based on the width of the Table that is available:

<TableView
    Container.Name="sensorTable"
    Container.Sizing="Width" >
  <TableView.Columns>
      <TableViewColumn Header="My Column" Classes="secondary-column" />
  </TableView.Columns>
</TableView>

and

<ContainerQuery Name="sensorTable" Query="max-width:649">
    <Style Selector="TableViewColumn.secondary-column">
        <Setter Property="Width" Value="0" />
    </Style>
</ContainerQuery>

Expected behavior

The style should be applied.

Avalonia version

v12.1.2

OS

No response

Additional context

The alternative I am doing right now is to create an attached property on my view, use a selector on my TableView and then enable/disable columns based on this.

This is clunky however and feels wrong.

Usecase mostly seems to be the TableViewColumn and maybe certain text elements. I am not really aware of other StylableElements that work with StyleSelectors but are not a Visual

I could also understand if this is an intended limitation; in this case, it should probably be documented accordingly (I could not find anything in the docs regarding this).

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions