WinForms Layout Control: Design-time templates

22 December 2014

As with all matters in development, oftentimes we find ourselves building a user interface or part of a UI that is remarkably similar to something that we’ve just built. To avoid the repetition – in code, that is – we have had up to now several strategies:

  1. UserControls. This is certainly a viable solution if you have exactly the same UI that you want to reuse. If not, then it’s more work than it’s worth.
  2. Code generation. This works pretty well (I’ve done this before in my dim and distant past, for example), apart from one drawback: you don’t get to see your UI at design-time.
  3. Visual Inheritance. Man, if you go this route, good luck. This just smacks of over-engineering to me; I think I’ll stick with UserControls.

The new version of the DevExpress WinForms Layout Control in v14.2 provides another much simpler way: design-time templates. This new feature allows you to save frequently-used layouts as templates and then be able to reuse those templates when necessary in your projects.

As an example of how this works, let’s create a compound waybill form that shows the need for some UI reuse. Here’s what we’re aiming for:

WinForms Layout Control: Example Waybill Form

Notice that the “SHIPMENT FROM” and the “TO – CONSIGNEE’ sections are very similar: they both have addresses, and also similar ‘name’ fields.

We proceed as normal when using the Layout Control by adding groups. When we get to the “SHIPMENT FROM” group we design it as normal, but before moving onto the group underneath which is very similar, we right-click the group we just created and select Create Template. Enter a unique name for the template and save it: you now have a reusable template in your repository. (All custom templates thus created are stored in the %Public%\Documents\DevExpress\XtraLayout\UserTemplates folder as XML files.)

WinForms Layout Control: creating a template

We’re now ready to use this new template. We go to the LayoutControl’s Customization Form and switch to the Templates tab. Locate the template in the list and drag it onto the form. The Customization Form allows you to see a preview of the template before we use it.

WinForms Layout Control: Using a custom template

Once the template has been dropped onto our form, we can customize the layout as desired, so changing the title to “TO – CONSIGNEE” and rearranging and re-captioning a couple of other fields.

If you find that even creating a template is too much of a nod to reuse (you only want to reuse a particular layout once, for example), then we have also improved the copy/paste functionality of the Layout Control. In essence, select the group you wish to duplicate, press Ctrl+C to copy it, and then Ctrl+V to paste it. (In actuality, this shortcut is also based on the new templates feature, but the template created is not persisted.)

Please note that the templates mechanism is version-agnostic. You can create templates in one version of the DevExpress WinForms suite and continue to reuse them in subsequent versions.

Free DevExpress Products - Get Your Copy Today

The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the DevExpress Support Center at your convenience. We'll be happy to follow-up.
No Comments

Please login or register to post comments.