I’m building a new app with WiseJ – so far, so good (despite many, many bugs in the designer, but I’m getting by).
The majority of my UI is a single UserControl containing a TabControl with several pages. This control is displayed docked in a fullscreen window. So far, so good.
Now, I need an “output window” – what I’d like is a scrollable panel within a tab of the tab control in which I can dynamically inject a variable amount of content, and have the panel display a vertical scroll bar when the content is too large.
So far, no luck though. I’ve tried:
I’d like to do this within the WiseJ control suite and not resort to emitting HTML for this portion, although I suppose that’s an option. I’m not an HTML/CSS developer, so I prefer the stylistic consistency of staying with controls.
How would you go about building this UI?
See attached sample.
The TabPage is already a scrollable panel. You can simply set AutoScroll=true and it will scroll when the content exceeds the container. You can also set the scroll margin and min size, etc.
The FlowLayoutPanel manages the child controls using the flow layout engine. You can also set AutoScroll=true (margins, etc) and it will scroll automatically when the layout of the children exceeds the container. If you set the layout direction to TopToBottom then the flow is top to bottom and wraps to the next column. It will eventually scroll horizontally. The default is LeftToRight, which places the children left to right. You can also set a flow break on a child, or set the FillWeight to let children in a row expand horizontally.
The TabelLayoutPanel managed the child controls using a grid layout. This is the most complex one. It can also auto scroll, set the AutoScroll to true. You can also set if it automatically adds columns or rows when adding controls. You can preset columns and rows, when adding controls they will automatically occupy the next available cell (1 control per cell). When the cells are finished, it will automatically add a new row (or column). When it overflows it scrolls. Rows and columns can be set to autosize (fit the content), be a percentage of the container, or fixed size. You can also set the RowSpan and ColSpan properties for child controls to occupy more than 1 cell.
FlowLayoutPanel and TableLayoutPanel are also property extenders, which means that they add properties to the controls in the same container. You will see those properties in the designer only. To set the extender’s properties programmatically, use this: flowLayoutPanel1.Set[PropertyName](control, value).
HTH
Please send a list of bugs you have found in the designer.
Please login first to submit.