ASNA WingsRPG™ Reference Manual

Using ASNA Wings™ Layout Aid

Introduced in 8.0, the Wings Layout Aid (also applicable to Monarch) allows developers the option of manipulating visible controls directly through a debugging web browser.

The Layout Aid

After opening a browser via Visual Studio's Debug option, click the Edit Page link at the bottom of the page. Each DdsRecord will be highlighted with a distinct colored border, and a small icon tray will appear in the upper right.

The DdsRecord Blocks

Each DdsRecord is highlighted with a colored border to show which controls it contains. Any number of elements within a record can be selected either by clicking on them individually or by clicking and dragging to select all of the elements in an area. The first "anchor" element is highlighted by a solid dark blue border, and the others by dotted line borders.

Controls can be moved around inside of the record, and records may be expanded to move controls to areas that are not included. Attempting to select elements that are in seperate records will fail (attempting to rubberband elements in multiple records will cause a pop up warning).

The layout assistant does not allow changes which violate Wings Validation.

All of the position changes performed by the Layout Assistant use Absolute Positioning.

The Icon Tray

The icon tray contains:

Icon	Function	Description
	Help	Opens this webpage
	Distribute Vertical	Arranges all selected elements into an evenly spaced vertical line.
	Distribute Horizontal	Arranges all selected elements into an evenly spaced horizontal line.
	Equalize Height	Sets the height attribute of all selected elements to a median height.
	Equalize Width	Sets the width attribute of all selected elements to a median height.
	Align Vertical	Arranges all selected elements in a vertical array on the center of the anchor element.
	Align Horizontal	Arranges all selected elements in a horizontal array on the center of the anchor element.
	Align Left	Arranges all selected elements in a vertical array justified by the left border of the anchor element.
	Align Right	Arranges all selected elements in a vertical array justified by the right border of the anchor element.
	Align Bottom	Arranges all selected elements in a horizontal array justified by the bottom border of the anchor element.
	Align Top	Arranges all selected elements in a horizontal array justified by the top border of the anchor element.
	Sync	Saves all changes made with the Layout Aid.
	Exit	Exits the Layout Aid. If you have made unsaved changes a dialog will appear asking if you wish to sync them.

The icon tray can be repositioned along the top and sides of the page by clicking and dragging its edges.

Subfiles

When clicking on a subfile a dialog will appear to determine whether an individual record or the entire subfile should be selected. The subfile as a whole can be repositioned or resized as normal.

Subfiles are handled differently from other elements, as are the records that they contain. Subfile records can't be moved or rearranged, but they can be resized by dragging an element outside of its cell. Resizing one cell will cause all other cells to be resized to match.

WingsLayoutAidRsc.ashx

The data for the Wings Layout Aid is stored in a file named WingsLayoutAidRsc.ashx, which is kept in the Developer folder (visible in Visual Studio's Solution Explorer). This folder and its contents should always be deleted before deployment.

The following Web.config setting, found in older versions of Monarch, disables the "Saving" of the Layout changes:


  <pages controlRenderingCompatibilityVersion="3.5" clientIDMode="AutoID"/>

The WLA assumes "default" naming conventions for "client IDs" (HTML element id attribute). Running in compatibility mode with older ASP.NET versions produces "client IDs" differently, and since WLA needs to find the "server ID" associated with the modified "client IDs" to update the markup, the matching process fails and all layout changes are lost.