[header] Page content hidden behind Header
Affects | Status | Importance | Assigned to | Milestone | |
---|---|---|---|---|---|
Ubuntu UI Toolkit |
Fix Released
|
High
|
Tim Peeters | ||
ubuntu-ui-toolkit (Ubuntu) |
Fix Released
|
Undecided
|
Unassigned |
Bug Description
Attached example code does
1. Not show the Button inside the Page
2. Shows a lot of extra space on top of the ListView
--- Irc log with greyback ---
<greyback> matge: hey, in that example code, the Button is under the header. But your example is showing strange things are happening - for instance notice the ListView has lots of extra space at the top - that should not be.
<matge> greyback: under the header? I thought parent references the page content (which is the area below the header). Where should I anchor the button's top to make it visible?
<greyback> matge: it appears the header draws itself on top (MainView is the source of the header). Flickables & ListViews are cleverly adjusted to compensate (you can see it's happening), but anything else doesn't appear to work well.
<greyback> matge: I don't see any obvious anchor point. I need to see how this stuff is working underneath
<matge> greyback: So any idea how to get the expected behavior?
<greyback> matge: not yet, sorry. I'm looking, will let you know when I've something
<matge> greyback: thanks a lot!
<greyback> matge: so not a very nice solution to the button position: to the Button add "topMargin: root.header.height + units.gu(2)"
<greyback> matge: so this: http://
<matge> greyback: thanks, this seems to work!
<matge> greyback: should I fill a bug for that big space above the ListView?
<greyback> matge: do please
<greyback> matge: yours is a valid use-case, and right now we're not supporting it very well
Related branches
- PS Jenkins bot: Approve (continuous-integration)
- Zsombor Egri: Approve
-
Diff: 133 lines (+51/-4)4 files modifiedCHANGES (+1/-0)
modules/Ubuntu/Components/Header.qml (+8/-0)
modules/Ubuntu/Components/Page.qml (+39/-4)
tests/unit/tst_components/tst_tabs.qml (+3/-0)
Changed in ubuntu-ui-toolkit: | |
assignee: | nobody → Tim Peeters (tpeeters) |
Changed in ubuntu-ui-toolkit: | |
status: | New → Confirmed |
summary: |
- Page content hidden behind Header + [header] Page content hidden behind Header |
Changed in ubuntu-ui-toolkit: | |
status: | Confirmed → In Progress |
Changed in ubuntu-ui-toolkit: | |
status: | Fix Committed → Fix Released |
The Page automatically detects the ListView as its flickable and adapts the listview's contents margins accordingly. The button position is not affected and stays hidden behind the header.
Setting page.flickable: null and removing the anchors of the page should fix it for you.
However, the automatic behavior is not correct in this case, and I will try to fix it, and I will update the documentation of page.flickable.