Div Text

Div-Text is a string used to specify a rule of layout how child windows are sized/placed within its parent window.

Field

A basic concept is field. It represents an area in the window. Define a field

<> It represents the whole area of the window.

Define fields

<><> The two fields represent left area and right area of the window.

Fields can be nested, one outter field and three nested fields

<<><><>> The three nested fields represent left area, center area and right area of the window.

Attributes of Field

Name

If a field has a name, the field can be operated. The name is a field's identifier.

<id_you_specify> A named field can be addressed by using following statement.

place.field("id_you_specify");
//or
place["id_you_specify"];

vert

Specifies a field that all its nested fields and contents are positioned vertically. If vert is not specified, the nested fields and contents are positioned horizontally. For example.

place plc{fm}; //fm is an instance of nana::form
plc.div("<abc>"); //name abc for the field.
plc["abc"]<<btn0<<btn1<<btn2<<btn3; //These buttons are child widgets of fm.
plc.collocate();

Place horizontal

//Replace the line
plc.div("<abc>"); 
//with
plc.div("<vert abc>");

Then, the buttons are positioned vertically.

Place vertical

weight

Specifies the width or height of a field. It depends on the type of its owner field. If the owner field is vertical, the weight indicates the width. If the owner field is horizontal, the weight indicates the height. The weight supports different units type.

<weight=200 def> If the width of form is 1000px, the field abc is 800px and def is 200px. <weight=60% def> If the width of form is 1000px, the field abc is 200px, def is 600px and ghi is 200px.