ResizeLayout

ResizeLayout is similar to SimpleLayout, allowing you to position views horizontally or vertically. However, with ResizeLayout you can also resize the views being managed. You can construct a ResizeLayout object by using the resizelayout tag.

To resize a view, assign “releasetolayout” to the options attribute of the view you want to resize. This attribute causes the corresponding view to be resized to fill in the width or height of the container that is not taken by the fixed-length views. If more than one view have their options attribute assigned “releasetolayout”, the available space is split evenly among those views.

The ResizeLayout class’s attributes are given in Table 4.3.

Table 4.3. The attributes defined in the ResizeLayout class
NameUsageTypeDefaultAccessibility
axisTag and JSstringyread-write
 Description. The axis to lay out components. The value for this attribute is either “x” or “y”.
spacingTag and JSnumber0read-write
 Description. The distance between two views in pixels.

The following are the methods defined in the ResizeLayout class.

hold(subview)

Prevents the specified subview from being resized when the parent view is resized.

release(subview)

Allows the specified subview to be resized after being held.

setAxis(axis)

Sets the axis attribute.

For example, the LZX application in Listing 4.5 demonstrates a canvas that uses resizelayout.

Listing 4.5. Using resizelayout
<canvas height="200">
    <resizelayout axis="y" spacing="5"/>
    <view width="20" height="20" bgcolor="silver"/>
    <view width="20" height="20" bgcolor="gray"/>
    <view width="20" height="20" bgcolor="black"
            options="releasetolayout"/>
</canvas>

To test the application in Listing 4.4, use this URL:

http://localhost:8080/lps-4.0.x/app04/resizeLayoutTest1.lzx

Figure 4.5 shows the result

Figure 4.5. Using ResizeLayout


..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset