question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Add support to qlayout for fixed page

See original GitHub issue

Is your feature request related to a problem? Please describe. I have read dozens of posts concerning quasar layout and scrolling. I have responded to quite a few based on my understanding and experimentation. I have spent countless hours reading quasar code and debugging layout in the browser. I think I understand how it works and adding just a little more info to the docs would help. For example: when a drawer is fixed, if the content is to tall for the window it automatically gets a scrollbar. If it is not fixed then the browser window gets a scrollbar.

When the drawers aren’t fixed the browser scrollbar scrolls the drawers and the page. If the drawers are fixed then the browser scrollbar scrolls the page, even though it might be on the other side of the drawer. It will also extend up beside the header if there is one.

All that was background to say that adding the ability to “fix” the page/pagecontainer would cause the page to have its own scrollbar which is preferable in many instances.

Describe the solution you’d like My proposal is that using a capital P in the page position of the layout string “hHh lPr lFf” would fix the page and also provide the magic and automatic scrolling of the page content if necessary. This would work just like using a capital L in the layout string to fix the left drawer prevents it from scrolling with the browser window and instead magically provides a scrollbar if necessary.

Describe alternatives you’ve considered I have implemented a fixed page with a page scrollbar when necessary by

  1. adding class="fixed fit scroll" to qpagecontainer in mainlayout.
  2. I also had to add class="fit scroll" to the qpage, but I am not sure why.

Adding fixed to the page container gets rid of the browser scrollbar when drawers are fixed, which was my initial goal. My “workaround” requires me to modify every page for it to work. I don’t like that but I am new to quasar and don’t fully understand all the details of the qlayout implementation. I am also not very experienced with CSS.

Additional context Add any other context or screenshots about the feature request here.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:7

github_iconTop GitHub Comments

1reaction
pdanpdancommented, Oct 30, 2021

I modified the example here: https://codepen.io/pdanpdan/pen/bGrRXRR?editors=1000 For the scroll area bar visible or not just play with its properties

1reaction
pdanpdancommented, Oct 28, 2021

You can do it like this: https://codepen.io/pdanpdan/pen/bGrRXRR?editors=1010

But you would lose reveal and QPageScroller

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to have a fixed-size layout that also keeps the window ...
it has setMaxmimumWidth and setMaximumHeight defined. I put an QHBoxLayout container there. adding widgets to it (with fixed width/height too).
Read more >
Layout Management | Qt Widgets 6.4.1 - Qt Documentation
It is used by QLayout::add(), by the QLayout constructor that takes a layout as parent. If your layout has advanced placement options that...
Read more >
PyQt5 Layouts - Using QVBoxLayout, QHBoxLayout ...
Layouts are the Qt approach to positioning widgets in your GUI applications. Widgets placed in layouts will be automatically arranged.
Read more >
Layout | Quasar Framework
Multiple pages can share the same QLayout, so the code is reusable, which is one of their key points. QLayout is NOT mandatory,...
Read more >
Form Layout | Grid Layout | (Qt C++ Tutorial #12) - YouTube
... qlayout example,qlayoutitem, qlayout attempting to add qlayout ... update, qlayout frame, qlayout fixed spacing, qlayout stretch factor ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found