Resizable View

UI Components for Angular
Post Reply
mikeshugar
Posts: 10
Joined: 02 Aug 2019, 23:58

07 Aug 2019, 23:12

Hi, I m new to Angular and PrimeNG.

I am trying to build a UI with manually resizable panels. Kind of like your browser has a bookmark panel that can be resized to be wider or narrower.

I want:
  • a top row panel that has fixed height and sticks to the top of the view port.
  • a bottom row panel that has fixed height and sticks to the bottom of the view port
  • a middle row content panel that has variable height and dynamically consumes 100% of the remaining viewport after the top and bottom have been drawn
    • the middle row content has two columns (a left and right) and the divider between them can be dragged to resize both columns.
    • if either of the middle row content panels needs more height, vertical scrollbars appear inside them as needed.
I have not figured out how to get the bottom row to stick to the bottom of the view port. The page just flows until it ends.

I have not figured out how to have a resizable view panel in PrimeNG.

If anyone can answer these questions or provide a complete sample, that would be great.


Thanks.

mikeshugar
Posts: 10
Joined: 02 Aug 2019, 23:58

08 Aug 2019, 21:47

I ended up using this:

https://bertrandg.github.io/angular-split/#/

It works. It was pretty easy.

But its a little rough around the edges. If anyone has better ideas, would love to see them.

Post Reply

Return to “PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 2 guests