Eclipse interface case (2) - Understanding layout 3

xiaoxiao2021-03-06  58

2.3 GridLayout

GridLayout may be the most commonly used, most powerful standard layout class, of course it is also the most complicated. GridLayout placed the components in the container in a lattice, which has many set domains, and similar to RowLayout, the components can have corresponding layout data, called GridData. GridLayout's power is that it can set each control via GrIDATA.

2.3.1 GridLayout can set the domain

Numcolumns

The NumColumns domain is the most important domain of GridLayout, and is usually the first domain that needs to be set. The components are placed from left to right in the column. When NumColumns 1 component is added to the container, a new row will be created. There is only one column by default. The following code creates a shell that has 5 buttons with different widths managed by GridLayout, and subsequent lists show the effect when NumColumns is set to 1, 2 or 3.

Display display = new display ();

Shell shell = new shell (display);

GridLayout GridLayout = New GridLayout ();

GridLayout.NumColumns = 3;

Shell.setLayout (GridLayout);

New Button (shell, swt.push) .Settext ("b1");

New Button (Shell, Swt.push) .Settext ("Wide Button 2");

New Button (Shell, Swt.push) .Settext ("Button 3");

New Button (shell, swt.push) .Settext ("b4");

New button (shell, swt.push) .Settext ("Button 5");

Shell.pack ();

shell.open ();

While (! shell.isdisposed ()) {

IF (! Display.readDispatch ()) Display.sleep ();

}

Numcolumns = 1

Numcolumns = 2

Numcolumns = 3

Makecolumnsequalwidth

Makecolumnsequalwidth domain forced columns have the same width. The default is false. Change the above example to a column containing 3 equivalences, the effect is as shown below (note that the components are aligned in the column, see later introduction):

Marginwidth, marginheight, horizontalspacing, and verticalspacing

The GridLayout margins and the spacing domain are similar to RowLayout, and the difference is that the left distance and the right side are unified as marginwidth, the upper distance and the lower distance are marginheight. It is also possible to set HorizontalsPacing and VerticalSpacing, respectively (the spacing in RowLayout sets the horizontal spacing or vertical spacing according to its TYPE type).

2.3.2 The domain of the GridData object

GridData is a layout data corresponding to GridLayout, which can set the layout data of the component via setLayOutdata. For example, you can use the GridData of the following code setting buttons:

Button button1 = new button (shell, swt.push);

Button1.setText ("B1");

Button1.setLayOutdata (New GridData ());

The above code created a GridData object with the default value, and its effects are the same as the layout data. There are two ways to create a GridData object with a specified domain value. The first method is to directly set various domain values, such as GridData Griddata = New GridData ();

Griddata.horizontalalignment = griddata.fill;

Griddata.grabexcesshorizontalspace = true;

Button1.setLayOutdata (Griddata);

The second way is to set the griddata style bit by using a convenient API:

Button1.setLayOutdata (New Griddata (GridData.horizontal_Align_Fill | GridData.grab_horizontal);

In fact, in order to make it easier to provide a combination of some style bits, for example:

Button1.setLayOutdata (New GridData (GridData.Fill_horizontal);

Note that the Fill_ style simultaneously sets alignment and placeholder. GridData's style is only valid for Boolean and enumeration values, and the digital domain needs to be set directly.

(Note using Swing) The main thing is required when using GrIDDATA: Do not repeat the GridData object. Each component managed by the GridLayout container must have a separate GridData object. If the layout data of the component is empty, SWT will automatically create a separate GridData object.

Horizontalalignment and VerticalAlignmentment

The Alignment domain specifies that components are placed in the lattice or vertically. You can set the following values:

Beginning

· Center

· END

· Fill

The default horizontalalignment is set to Beginning (left alignment), and VerticalAlignment is set to Center.

Refer to the example of the five buttons in front, set three columns, and set different HorizontalaLAlignment for Button 5, as shown:

Horizontalalignment = GridData.Beginning (default)

Horizontalalignment = GridData.center

Horizontalalignment = GridData.end

Horizontalalignment = GridData.Fill

Horizontalindent

The Horizontalindent domain allows the component to move to the right of the specified pixel value. It is valid only when HorizontalaLAlignment is set to BeGinning. It cannot be indented through the style bit, and the following code demonstrates 4 pixels to indent Button 5:

Griddata griddata = new griddata ();

Griddata.horizontalindent = 4;

Button5.setLayOutdata (Griddata);

Horizontalspan and VerticalSpan

The SPAN domain allows the control to span several plaids, often use with the Fill style. The following code extends Button 5 to two plaids:

Griddata griddata = new griddata ();

Griddata.horizontalalignment = griddata.fill;

GridData.horizontalspan = 2;

Button5.setLayOutdata (Griddata);

If you want to extend Button 2 to two plaids, you can write: GridData GridData = New GridData ();

Griddata.horizontalalignment = griddata.fill;

GridData.horizontalspan = 2;

Button2.setlayOutdata (Griddata);

You can also extend the Button 3 vertically to two plaids:

Griddata griddata = new griddata ();

GridData.VerticalIgnment = griddata.fill;

GridData.VerticalSpan = 2;

Button3.setLayOutdata (Griddata);

GrabExcesshorizontalspace and Grabexcessvertories

GrabExcesshorizontalspace and GrabexcessVerticalSpace are mainly used on heavyweight components like Text, List, and Canvas, which can automatically increase them when their containers are increased. For example, if a Text component can be extended laterally, the Text component automatically extends the new horizontal space when the user adjusts the width of the shell, while the other components on the same row remain width. Of course, when the shell is hit, the components of this attribute are also first contracted. In an environment where you can adjust the size of the container, you can think of setting the GrabExcessSpace domain. As an example, we still use the front Button 3 vertically to extend the examples of the two cells, as follows:

If we adjust the size of the window, only the window becomes larger:

Now set Button 3 can be extended laterally and longitudinally, B1 and B4 are only filled (not expanded), and then re-adjusted, as shown in the figure:

This time, Button 3 varies in both directions, and B4 changes only on the vertical direction, and the other remains unchanged. This is because the Button 3 is extended in the longitudinal direction, and the last line has become high. Note that B1 has not changed, although it is set longitudinally to it because it does not change. And Button 3 also sets horizontal extensions and fill, which is widened, so it varies wide. The following is the code:

Button button1 = new button (shell, swt.push);

Button1.setText ("B1");

Griddata griddata = new griddata ();

GridData.VerticalIgnment = griddata.fill;

Button1.setLayOutdata (Griddata);

New Button (Shell, Swt.push) .Settext ("Wide Button 2");

Button button3 = new button (shell, swt.push);

Button3.Settext ("Button 3");

Griddata = new griddata ();

GridData.VerticalIgnment = griddata.fill;

GridData.VerticalSpan = 2;

Griddata.grabexcessverticalspace = true;

Griddata.horizontalalignment = griddata.fill;

Griddata.grabexcesshorizontalspace = true; button3.setlayOutdata (GridData);

Button button4 = new button (shell, swt.push);

Button4.Settext ("b4");

Griddata = new griddata ();

GridData.VerticalIgnment = griddata.fill;

Button4.setLayOutdata (Griddata);

New button (shell, swt.push) .Settext ("Button 5");

In a typical application window, at least one component can be set to extension. If there are more than one component can be expanded, then they allocate the extended space, as shown in the figure:

Finally, it is important to note that if a component can be extended laterally, and its parent container is widened, the entire column where the component is width. Also, if the component can be expanded, and its parent container is higher, the reach of the component is high. This allows these components to be stretched if other components are set up in the corresponding rows or columns. Has a left alignment, in the middle alignment, the right alignment component will not be stretched, they are still aligned in the row or column of collapse, aligned or right.

Widthhint and Heighthint

The Widthnt and Heighthint domain indicate the width and height of the hope that the components can have, provided that there is no contradiction with other requirements of GridLayout. See the previous five buttons, three columns, assume that Button 5 width 70 pixels, high 40 pixels, the code is as follows:

Griddata griddata = new griddata ();

Griddata.widthhint = 70;

GridData.heighthint = 40;

Button5.setLayOutdata (Griddata);

Button 5 natural size is shown on the left, the right picture is 70 pixels wide, 40 pixels high.

Note that if the HorizontalaLAlignment in Button 5 is set to Fill, GridLayout does not satisfy its width of 70 pixels.

The last point, performs good settings on a platform, may have differentials on another platform. Since the font size and the natural size of the components are different between the different platforms, the hard-coded pixel value is not the best way to layout form. Thus, unless there is no need to have, try to use the size hint.

2.3.3 A complex GridLayout Example

The GridLayout examples listed above are relatively simple, just to explain how the effects of each domain. Next, a very complicated example is to integrate the effects of each domain. Let's first hand draw a sketch of the form to create, help us decide how many columns need to be needed, those components need to be extended:

Then the coding is started according to the top of the top, as shown below. Note that we have added some logic to make examples more vivid, such as Browse ... Open a FileDialog dialog, uses an image file, canvas displays the image, delete delete images, Enter prints current information. The sample code is placed in a single main method, and the purpose is to make us pay attention to the layout code, not the program style.

Import org.eclipse.swt. *;

Import org.eclipse.swt.widgets. *;

Import org.eclipse.swt.layout. *;

Import org.eclipse.swt.events. *; import org.eclipse.swt.graphics. *;

Public class complexgridlayoutexample {

Static Display Display;

STATIC shell shell;

Static text Dogname;

STATIC Combo Dogbreed;

Static Canvas DogPhoto;

Static Image Dogimage;

Static List Categories;

Static text Ownername;

Static Text Ownerphone;

Public static void main (String [] args) {

Display = new display ();

Shell = new shell (display);

Shell.Settext ("Dog Show Entry");

GridLayout GridLayout = New GridLayout ();

GridLayout.NumColumns = 3;

Shell.setLayout (GridLayout);

New label (shell, swt.none) .SETTEXT ("Dog's Name:");

Dogname = new text (shell, swt.single | swt.border);

GridData griddata = new griddata (griddata.horizontal_align_fill);

GridData.horizontalspan = 2;

Dogname.setLayOutdata (Griddata);

New label (shell, swt.none) .SETTEXT ("BREED:");

Dogbreed = New Combo (Shell, SWT.NONE);

Dogbreed.SetItems (New String [] {"Collie", "Pitbull", "Poodle", "Scottie"};

Dogbreed.setLayOutdata (New GridData (GridData.horizontal_align_fill)

Label label = new label (shell, swt.none);

Label.setText ("categories");

Label.setLayOutdata (New GridData);

New label (shell, swt.none) .SETTEXT ("Photo:");

DogPhoto = New Canvas (Shell, Swt.Border);

Griddata = new griddata (griddata.fill_both);

Griddata.widthhint = 80;

GridData.heighthint = 80;

GridData.VerticalSpan = 3;

DogPhoto.setLayOutdata (Griddata);

Dogphoto.addpaintlistener (new pointlistener () {

Public void PaintControl (Final Paintevent Event) {

IF (DogImage! = null) {

Event.gc.drawImage (Dogimage, 0, 0);

}

}

});

Categories = new list (shell, swt.multi | swt.border | swt.v_scroll); categories.setitems (new string [] {

"Best of Breed", "Prettyst Male", "Handsomest Male",

"Best Dressed", "Fluffiest Ears", "MOST Colors",

"BEST Performer", "Loudest Bark", "Best Behaved",

"Prettiest eyes", "MOST Hair", "Longeest Tail",

"Cutest trick"});

Griddata = new griddata (griddata.horizontal_align_fill | griddata.vertage_align_fill);

GridData.VerticalSpan = 4;

INT LISTHEIGHT = Categories.getItemHeight () * 12;

Rectangle Trim = Categories.Computetrim (0, 0, 0, ListHeight);

Griddata.heighthint = trim.height;

Categories.setLayOutdata (Griddata);

Button Browse = New Button (Shell, Swt.push);

Browse.Settext ("Browse ...");

Griddata = new griddata (griddata.horizontal_align_fill);

Griddata.horizontalindent = 5;

Browse.setLayOutdata (Griddata);

browse.addselectionListener (New SelectionAdapter () {

Public void widgetSelected (SelectionEvent Event) {

String filename = new filedialog (shell) .open ();

IF (filename! = NULL) {

Dogimage = New Image (Display, FileName);

}

}

});

Button Delete = New Button (shell, swt.push);

Delete.setText ("delete");

Griddata = new griddata (griddata.horizontal_align_fill | griddata.vertage_align_beginning);

Griddata.horizontalindent = 5;

Delete.setLayOutdata (GridData);

delete.addseelectrionListener (New SelectionAdapter () {

Public void widgetSelected (SelectionEvent Event) {

IF (DogImage! = null) {

Dogimage.dispose ();

Dogimage = NULL;

DogPhoto.redraw ();

}

}

});

Group ownerinfo = new group (shell, swt.none);

Ownerinfo.setText ("Owner Info"); GridLayout = New GridLayout ();

GridLayout.NumColumns = 2;

Ownerinfo.setLayout (GridLayout);

Griddata = new griddata (griddata.horizontal_align_fill);

GridData.horizontalspan = 2;

Ownerinfo.setLayOutdata (Griddata);

New label (OwnerInfo, SWT.NONE) .SETTEXT ("Name:");

Ownername = new text (OwnerInfo, SWT.SINGLE | SWT.BORDER);

Ownername.setLayOutdata (New GridData (GridData.Fill_horizontal);

New Label (OwnerInfo, SWT.NONE) .SETTEXT ("Phone:");

Ownerphone = new text (OwnerInfo, SWT.SINGLE | SWT.BORDER);

Ownerphone.setLayOutdata (New GridData (GridData.Fill_horizontal);

Button Enter = New Button (Shell, SWT.PUSH);

ENTER.SETTEXT ("ENTER");

Griddata = new griddata (griddata.horizontal_align_end);

Griddata.horizontalspan = 3;

Enter.setLayOutdata (Griddata);

Enter.addSelectionListener (New SelectionAdapter () {

Public void widgetSelected (SelectionEvent Event) {

System.out.println ("/ NDOG NAME:" DOGNAME.GETTEXT ());

System.out.println ("DOG BREED:" Dogbreed.getText ());

System.out.println ("Owner Name:" OwnerName.getText ());

System.out.println ("Owner Phone:" OwnerPhone.getText ());

System.out.println ("Categories:");

String cats [] = categories.getSelection ();

For (int i = 0; i

System.out.println ("/ t" cats [i]);

}

}

});

Shell.pack ();

shell.open ();

While (! shell.isdisposed ()) {

IF (! Display.readDispatch ()) Display.sleep ();

}

IF (DogImage! = null) {

Dogimage.dispose ();

}

}

}

The following shows the effect after the Mary Smith inputs FIFI:

If the form size becomes large, the layout is re-adjusted as shown below:

Note the following:

l There are 3 columns of 7 lines;

l DogPhoto Canvas can be widely width and high because it sets fills and extensions in the horizontal and vertical direction (this example does not adjust the size of the image, can be programmed); l Dogbreed Combo can be widened because it sets it horizontally filled, And and canvas in the same column;

l DogName Text can be widened because it has a transverse fill and it contains Canvas;

l Ccategories List can becomes high because it sets it longitudinally filled, and it contains CANVAS across the row;

L Because the Categories List becomes higher, its vertical scroll bar disappears (it does not become widens);

l OwnerInfo Group is wide, because it is set to be transversely filled, and it contains Canvas;

l OwnerInfo Group As the subclass of Composite, you have your own 2 lines of GridLayout;

l OwnerName and OwnerPhone Texts are widened because groups are widened, and they are set in GridLayout in Groupout;

l Browse and the Delete button slightly interleaved, due to the horizontal fill, they are consistent;

l Delete Button is aligned on its line;

l Categories tags are aligned in Categories List;

l Enter button is aligned in the three columns of it across it;

l DogPhoto Canvas sets the width and height hints because we want to set the image size as much as possible to 80 x 80 pixels;

l Categories List sets the height initial value, 12 times the height of the LIST font, because we want the list to initially display 12 lines.

转载请注明原文地址:https://www.9cbs.com/read-111750.html

New Post(0)