VisualLayout.NET Documentation

Table of Contents

• VisualLayout.NET Documentation
• Table of Contents
• Description
• Features
• System Requirements
• Installation and Testing
• Layout concept
• Layout properties description
• Sample Layout
• Links and References

Description

VisualLayout.NET is design time enabled .NET component which helps to create professional form layouts with no programming efforts. Working together with Microsoft Visual Studio.NET component brings new quality in form design allowing complex sizing and positioning relations between form elements to be defined visually just with few mouse clicks. CoolLayout.NET alters the sizes and positions of controls on forms as they are sized. This gives your applications resolution independence. Design applications at one resolution and run them at a different resolution. Controls remain proportional in size to the forms on to the other controls and located relatively as you have specified it at design time. Number of sizing and positioning settings are available.

Features

• Keeps look and feel of the form even when it is resized in runtime mode
• Simple to use and intuitive visual add-on to the standard Microsoft Visual Studio.NET form designer
• All possible sizing and positioning options for every form control or container
• Any option can be specified absolutely or relatively to any other form element
• Works with any controls or containers no matter if it is standard or custom
• Optionally supplied with C# source code that can be used as example of good .NET component development techniques.

System Requirements

• Runtime: Microsoft .NET Framework runtime
• Development: Microsoft .NET Framework SDK
• Design-time support: Microsoft Visual Studio.NET

Installation and Testing

1. Please follow steps below to install CoolLayout.NET component
2. Check if your system meets requirements
3. Order the component and receive it attached to order confirmation e-mail
4. Save component from e-mail message to disk and unzip *.msi file
5. Launch the VisualLayout.NET.msi from within the Windows Explorer or execute msiexec.exe /I VisualLayout.NET.msi manually from the console
6. Follow instructions of the installer
7. Launch your Microsoft Visual Studio .NET IDE
8. Position your mouse over the toolbox*. Click your right mouse button and select "Add Tab" option from activated popup menu. Give the newly created tab some meaningful name. We would recommend "VisualLayout.NET" as this is the name we will be referring to in our further documentation
9. Make "VisualLayout.NET" pane active by clicking on its caption. Click your right mouse button and select "Customize Toolbox" option from activated popup menu. On the appeared dialog box switch to the ".NET Framework Components" page. Find and check the components from the CoolLayout.Windows.Forms.dll then click "Ok"
10. Enjoy comfortable visual form design!

_{* Please refer to the Visual Studio.NET Help system to find out what the toolbox is and what it is used for}

Layout concept

When you place CoolLayout.NET on you form it extends all controls with layout related properties.

Additionally layout settings for selected element(s) are indicated on the form with special icons and links that you can add and modify visually with the mouse.

Layout setting can be applied by both modifying properties and building relations visually on the form.

Layout properties description

Positioning and sizing relations are displayed on the form with red lines and side icons. Find relation source icons (first column) and relation destination icons (last column) in appropriate cells of the table below.

Property Description Valid values   HorizontalPositioning Specifies how control is positioned horizontally Center – control is center positioned relatively to its container   Relative – control positioned relatively to some other control (set with properties: LeftOrigin, RightOrigin)   VerticalPositioning Specifies how control is positioned vertically Center – control is center positioned relatively to its container   Relative – control positioned relatively to some other control (set with properties: TopOrigin, BottomOrigin   WidthMode Specifies how the width of the control is calculated Fixed – the width of the control is  fixed as to the value specified in control’s property box unless both LeftOriginMode and RightOriginMode are specified   Relative – the width of the control is calculated relatively as the width of the origin control is changed WidthOrigin Specifies control that is used as origin when WidthMode is specified as Relative (see item above) Any valid control from the selection box   HeightMode Specifies how the height of the control is calculated Fixed – the height of the control is  fixed to the value specified in control’s property box unless both TopOriginMode and BottomOriginMode are specified   Relative – the height of the control is calculated relatively as the height of the origin control is changed HeightOrigin Specifies control that is used for origin when HeightMode is specified as Relative (see item above) Any valid control from the selection box   LeftOriginMode Specified how left edge of the control is aligned when HorizontalPositioning is set as Relative Left – left edge of the control is aligned to the left edge of the origin control Center – left edge of the control is aligned to the center of the origin control Right – left edge of the control is aligned to the right edge of the origin control None – No alignment for the left edge of the control   LeftOrigin Specifies control that is used as origin for the LeftOriginMode setting (see item above) Any valid control from the selection box   RightOriginMode Specified how right edge of the control is aligned when HorizontalPositioning is set as Relative Left – right edge of the control is aligned to the left edge of the origin control Center – right edge of the control is aligned to the center of the origin control Right – right edge of the control is aligned to the right edge of the origin control None – No alignment for the right edge of the control   RightOrigin Specifies control that is used as origin for the RightOriginMode setting (see item above) Any valid control from the selection box   TopOriginMode Specified how top edge of the control is aligned when VerticalPositioning is set as Relative Top – top edge of the control is aligned to the top edge of the origin control Center – top edge of the control is aligned to the vertical center of the origin control Bottom – top edge of the control is aligned to the bottom of the origin control None – No alignment for the top edge of the control   TopOrigin Specified how top edge of the control is aligned when VerticalPositioning is set as Relative Any valid control from the selection box   BottomOriginMode Specified how bottom edge of the control is aligned when VerticalPositioning is set as Relative Top – bottom edge of the control is aligned to the top edge of the origin control Center – bottom edge of the control is aligned to the vertical center of the origin control Bottom – bottom edge of the control is aligned to the bottom of the origin control None – No alignment for the bottom edge of the control   BottomOrigin Specified how bottom edge of the control is aligned when VerticalPositioning is set as Relative Any valid control from the selection box

Sample Layout

Links and References

• VisualLayout.NET product page
• VisualLayout.NET documentation
• Order VisualLayout.NET component
• Softcomplex Inc. site
• Contact support dept