Adding the KryptonGallery into the KryptonRibbon involves updating the shrinking algorithm for determining the size of group elements. It needs to be updated so that it can handle more than the existing concept of Large, Medium and Small for each group item.
As you may know, each group item has three possible sizes and the shrinking algorithm automatically downgrades items to smaller sizes when there is not enough space. So a triple container with three buttons might start off in Large size but progressively down shift to Medium and then Small as space becomes constrained. This is fine for buttons because we can easily define three distinct ways of drawing the buttons in those sizes.
The gallery component actually needs to be sized in more than 3 variations. To show this we have the following image that demos a simple group that is shrinking as size is decreased…
Our gallery still has the concept of being in Large, Medium or Small setting. But it has a couple of extra properties called LargeItemCount and MediumItemCount. At the top of the above image you can see the group when it has as much space as it wants, where the gallery is in Large setting and the default value of 6 is assigned to the LargeItemCount. You can see the gallery is displaying with 6 images.
As space becomes constrained it will reduce the size of the gallery by one item at a time until it reaches the MediumItemCount count and which point it enters the Medium setting. The MediumItemCount value is defaulted as 3. You can see this process occuring in the top four instances of the group in the above image. Each time it shrinks, one more item is removed from the gallery until it finally reaches MediumItemCount.
Notice that during this shrinking it has left the two buttons unchanged. This is because the shrinking algorithm has been changed to not only progressively reduce the gallery from LargeItemCount to MediumItemCount but also to always reduce the size of all the galleries to Medium before it reduces the size of other group elements. This is reasonable as the gallery should take up as much room as it wants if the space is available. Once the gallery is down to the minimum size required for showing a full gallery, the Medium setting, then the usual shrink semantics you are familiar with are applied. Where elements are shrunk in turn from right to left in a cyclic fashion.
The second to last instance in the above image shows that now other group elements are included in shrinking and so the buttons are reduced in size. Finally the gallery enters the Small setting, in the last example above, which replaces the full gallery appearance with the button appearance.
Of course, this sounds much more complicated than it appears when you actually play around with it. In practice you just need to set the LargeItemCount to the number of items you want to appear when space is unlimited and then set MediumItemCount to the number of items that are shown just before it is removed in favor of a button appearance. Just let the ribbon take care of the details at runtime!
(Note that the ribbon can handle multiple galleries inside a single group. In that case they will be shrunk in turn until all have reached the MediumItemCount values and then all the other elements are again including in shrink calculations.)
March 20th, 2008 at 10:07 pm
The control looks great!
Never thought that the resizing would be so complicted before – it seems very resoned.
Btw: Does the gallery support little items, too? Like an 20×20-pixel-button-gallery? Or will it be even possible to define a custom size for the items?
March 20th, 2008 at 11:14 pm
The gallery control takes an ImageList as the source of the items. You can provide any size items that you like. I provided 32×32 in the example cause I happen to have lots of icons that size available. You can provided 20×20 or any other size that you like. It only shows one line of items though.