Sunday, March 22, 2015

Panels behavior inside scrollable panels

In a previous post I talked about a problem that exist in WPF that happens when you display a control that can expand with its content needs and can have its own scrollbars inside a ScrollViewer.

My suggested design had a lot of limitations and restrictions. And today, I would like to revisit the problem analyze it, figure out generated issues and see if we can find a solution to resolve it:

In order to do this analysis we need first to really understand How do panels and their children interact and talk to each other to form the final view?

As we all know this happens in a two phase process that starts at the top of the tree and ripples to the bottom of the tree down to each child.

  1. Phase One: loop through all of the children of a parent/panel and give it the chance to dream of their desirable size according to suggested (by the parent) available space (set to infinity most of the time).
  2. Phase Two: loop through all of the children of a parent/panel and give them our decision regarding their wish.
Possible routes:
  1. measure phase:
    1. available space (equals to infinity most of the time) passed down to each child.
    2. a child (Measure) would calculate its dimensions and return it back to its parent by a property called DesiredSize.
    3. a panel will determine its own final size according to all of its children's sizes when arranged in a certain order.
  2. arrange phase:
    1. Top parent will pass down the final available space for this panel
    2. Panel will calculate each child's position and size and will pass it down to the child by calling Arrange


The problem with ScrollViewer is that it tills its children , I am going to make all of your wishes come true. Ironically this is not a favorable solution: Why? because when a child has the ability to display its own scrollbars, it becomes meaningless when they can grow as much as they want to display their content.

From a different point of view. A gui designer does not want to see a text box inside of a form that takes a whole lot of a space to display its content. We have other stuff to show, please behave your self and share with others available space and this is why you have scrollbars.

Semaphore : My solution is to ask your future employee what is your minimum acceptable salary and I will do my best to give you even more. And then you make a decision about it? This way, you can make better decision. Prevent your employee from going so far with their dreams. Of course this works in an ideal world like computers ! So this should be a good solution.

How it should ideally work according to my vision to achieve a better behavior?  It should go through three phase process:
  1. Phase One : loop through all the children and ask them what is the (Minimum) desirable size that is going to fit their content (recursively: without screwing its children's minimum sizes).
  2. Phase Two : loop through the children and tell them, this is the size that I can give to you, it can be less than what they wanted, same or even more.
  3. Phase three : the child will have to live with what is given to it , unless it was more than what it wants and can ignore given size and be as small as it wants.