« GLayout » : différence entre les versions

De GENIUS
Aller à la navigation Aller à la recherche
Aucun résumé des modifications
Aucun résumé des modifications
 
(19 versions intermédiaires par le même utilisateur non affichées)
Ligne 1 : Ligne 1 :
<font color=#556B2F>'''GENIUS'''</font> gives a specific <font color=#FF0000>Layout</font> (based on [http://www.miglayout.com MigLayout] well adapted to conditional display.
<font color=#556B2F>'''GENIUS'''</font> gives a specific <font color=#FF0000>Layout</font> (based on [http://www.miglayout.com MigLayout]) well adapted to conditional display.


'''Remark''': since the V1.2 version, a new API is availaible to manage it. The old one (using strings) is yet available via the <font color=#4169E1>setStringContraint()</font> method. It is preferable to use the new API. Anyway, the old one will allow to access to all Miglayout funnctionalities.
'''Remark''': since the V1.2 version, a new API is availaible to manage it. The old one (using strings) is yet available via the <font color=#4169E1>setStringContraint()</font> method. It is preferable to use the new API. Anyway, the old one will allow to access to all Miglayout funnctionalities.
Ligne 31 : Ligne 31 :
Thus, the result of such code will give us:
Thus, the result of such code will give us:


{{:user_manual:miglayout1.jpg|}}
 
[[File:MigLayout1.jpg]]
 


Anyway, be careful of the fact that this layout is based on on a <u>grid cell</u> => the size of a cell may depend on another component situated below …
Anyway, be careful of the fact that this layout is based on on a <u>grid cell</u> => the size of a cell may depend on another component situated below …


{{:user_manual:miglayout2.jpg|}}


=== The setConstraint method ===
[[File:MigLayout2.jpg]]
 
 
== The setConstraint method ==


We may use, for each object, the <font color=#4169E1>setConstraint()</font> method:
We may use, for each object, the <font color=#4169E1>setConstraint()</font> method:
Ligne 48 : Ligne 52 :
So, we see that to use this method, we must give it a GConstraint object as a single argument. This object will wait itself for one or several arguments which implement the GBasicConstraintInterface Interface. Most of the [http://www.miglayout.com MigLayout] constraints are available via static methods already proposed by the GConstraint class as in the previous example <font color=#4169E1>GConstraint.newline()</font> or <font color=#4169E1>GConstraint.width()</font>.
So, we see that to use this method, we must give it a GConstraint object as a single argument. This object will wait itself for one or several arguments which implement the GBasicConstraintInterface Interface. Most of the [http://www.miglayout.com MigLayout] constraints are available via static methods already proposed by the GConstraint class as in the previous example <font color=#4169E1>GConstraint.newline()</font> or <font color=#4169E1>GConstraint.width()</font>.


{{:user_manual:miglayout3.jpg|}}
 
[[File:MigLayout3.jpg]]
 


For information, the "old fashion" will use the following syntax:
For information, the "old fashion" will use the following syntax:
Ligne 57 : Ligne 63 :
</syntaxhighlight>
</syntaxhighlight>


We can also take into account all the objects of a given type included in a  [[javadoc>fr/cnes/genius/current/fr/cnes/genius/lowLevel/GPanel.html|GPanel]] by calling another <font color=#4169E1>setConstraint()</font> method:
We can also take into account all the objects of a given type included in a  [{{PathCurrentJavaDoc}}/fr/cnes/genius/lowLevel/GPanel.html GPanel] by calling another <font color=#4169E1>setConstraint()</font> method:


<syntaxhighlight lang="java">
<syntaxhighlight lang="java">
Ligne 70 : Ligne 76 :
</syntaxhighlight>
</syntaxhighlight>


=== Some available « constraints » ===
== Some available « constraints » ==


The following table gives an overview of some basic [[http://www.miglayout.com|MigLayout]] constraints. To get the exact API of the GBasicConstraintInterface methods proposed by GConstraint class, see the Java doc.
The following table gives an overview of some basic [http://www.miglayout.com MigLayout] constraints. To get the exact API of the GBasicConstraintInterface methods proposed by GConstraint class, see the Java doc.


{| class="wikitable"
{| class="wikitable"
Ligne 82 : Ligne 88 :
|Go to the next line before the component (gapsize => amount of pixel before it)
|Go to the next line before the component (gapsize => amount of pixel before it)
|-
|-
|'''skip''' [count] | Skip one or several columns (depending of the value of count, 1 by default)
|'''skip''' [count]
| Skip one or several columns (depending of the value of count, 1 by default)
|-
|-
|'''span''' [countx [county]],<br /> '''spanx''' [countx], '''spany''' [county]
|'''span''' [countx [county]],<br /> '''spanx''' [countx], '''spany''' [county]
| Allows to the component to spread on several cells (countx for horizontal axis and county for vertical axis)
| Allows to the component to spread on several cells (countx for horizontal axis and county for vertical axis)
|-
|-
| '''split''' [count] | Allows to put several components on a single cell
| '''split''' [count]
| Allows to put several components on a single cell
|-
|-
| '''flowx''', '''flowy''' | Direction when a component is added (flowx by default)
| '''flowx''', '''flowy'''
| Direction when a component is added (flowx by default)
|-
|-
| '''height''', '''width''' size | Specify the height (resp. width) of the component in pixel (preferred size)
| '''height''', '''width''' size
| Specify the height (resp. width) of the component in pixel (preferred size)
|-
|-
| '''push''' ('''pushx''', '''pushy''') | « Push » the next components (visible when the main window is enlarged)
| '''push''' ('''pushx''', '''pushy''')
| « Push » the next components (visible when the main window is enlarged)
|-
|-
| '''grow''' ('''growx'''', '''growy''') | Fill the cell with the component
| '''grow''' ('''growx'''', '''growy''')
| Fill the cell with the component
|-
|-
| '''gap''' left [right] [top] [bottom],<br /> **gaptop**, **gapbottom**,<br /> **gapleft**, **gapright** [gap] | Specify the gap  (in pixels by default)                                                                     |
| '''gap''' left [right] [top] [bottom],<br /> '''gaptop''', '''gapbottom''',<br /> '''gapleft''', '''gapright''' [gap]
| **align** [alignx, aligny],\\ **alignx**, **aligny** [align] | Specifiy alignment: (left, center, right) for alignx and (top, center, bottom) for aligny
| Specify the gap  (in pixels by default)
|-
|-
| '''align''' [alignx, aligny],<br /> '''alignx''', '''aligny''' [align]
| Specifiy alignment: (left, center, right) for alignx and (top, center, bottom) for aligny
|}


For more constraints, one may read the [[http://www.miglayout.com|MigLayout]] user manual.
For more constraints, one may read the [http://www.miglayout.com MigLayout] user manual.


On the following window, we can see several examples of such use of these layout constraints ...
On the following window, we can see several examples of such use of these layout constraints ...


{{:user_manual:miglayout4.jpg|}}


We can see that the management of a [[javadoc>fr/cnes/genius/current/fr/cnes/genius/highLevel/GEntryReal.html|GEntryReal]] (for example) may be more confuse than for a simple [[javadoc>fr/cnes/genius/current/fr/cnes/genius/lowLevel/GButton.html|GButton]]. Indeed, this widget is composed of several other subwidgets :
[[File:MigLayout4.jpg|frameless|850px]]
 


<syntaxhighlight>
We can see that the management of a [{{PathCurrentJavaDoc}}/fr/cnes/genius/highLevel/GEntryReal.html GEntryReal] (for example) may be more confuse than for a simple [{{PathCurrentJavaDoc}}/fr/cnes/genius/lowLevel/GButton.html GButton]. Indeed, this widget is composed of several other subwidgets :
 
<syntaxhighlight lang="java">
=> subwidget 0: GLabelWithIndicator
=> subwidget 0: GLabelWithIndicator
   => subwidget 0.0: GLabel
   => subwidget 0.0: GLabel
Ligne 122 : Ligne 139 :


For example, if we want:
For example, if we want:
  - to apply "newline" to the global widget
# to apply "newline" to the global widget
  - to set 200 pixels for the textfield width
# to set 200 pixels for the textfield width
  - to skip a cell to the Gunit field
# to skip a cell to the Gunit field
the solution is this one :
the solution is this one :


Ligne 138 : Ligne 155 :
</syntaxhighlight>
</syntaxhighlight>


At last, be careful by using <font color=#4169E1>Constraint.gap()</font>, <font color=#4169E1>Constraint.alignx()</font>
and <font color=#4169E1>Constraint.aligny()</font> methods as they allways used strings as arguments (will be modified in a next version).
<syntaxhighlight lang="java">
// Corresponds to gap left=0 right=10 top=20 bottom=30
// ... will be replaced by gap(i1, i2, i3, i4)
wid.setConstraint(new GConstraint(GConstraint.gap("0 10 20 30"));
// Corresponds to gap top 10
// ... will be replaced by gaptop(i)
wid.setConstraint(new GConstraint(GConstraint.gap("top 20"));
// Does not work as the first gap is cleared by the second one
// ... will be replaced by gaptop(i), gapbottom(j)
wid.setConstraint(new GConstraint(GConstraint.gap("top 20"), GConstraint.gap("bottom 30"));
// Will be replaced by enums ...
wid.setConstraint(new GConstraint(GConstraint.alignx("right"), GConstraint.aligny("center"));
</syntaxhighlight>


[[WELCOME_TO_THE_GENIUS_WIKI|Return to the introduction ↑]]  
[[WELCOME_TO_THE_GENIUS_WIKI|Return to the introduction ↑]]  
[[Conditional_Display|Go to the next page →]]
[[Conditional_Display|Go to the next page →]]

Dernière version du 10 juillet 2017 à 07:52

GENIUS gives a specific Layout (based on MigLayout) well adapted to conditional display.

Remark: since the V1.2 version, a new API is availaible to manage it. The old one (using strings) is yet available via the setStringContraint() method. It is preferable to use the new API. Anyway, the old one will allow to access to all Miglayout funnctionalities.

By default, every new graphic widget will be set to the next line,

public class MyPanel extends GPanel {
 
  private GButton but1;
  private GButton but2;
  private GButton but3;
 
  public myPanel() {
    but1 = new GButton("Bouton 1");
    but2 = new GButton("Bouton 2");
    but3 = new GButton("Bouton 3");
  }
 
  public void display() throws GException {
    put(but1);
    put(but2);
    put(but3);
  }
 
  public void generic() { }
 
};

Thus, the result of such code will give us:


MigLayout1.jpg


Anyway, be careful of the fact that this layout is based on on a grid cell => the size of a cell may depend on another component situated below …


MigLayout2.jpg


The setConstraint method

We may use, for each object, the setConstraint() method:

but2.setConstraint(null); // No more “by default” way => on the same line
but3.setConstraint(new GConstraint(GConstraint.newline(), GConstraint.width(150)));

So, we see that to use this method, we must give it a GConstraint object as a single argument. This object will wait itself for one or several arguments which implement the GBasicConstraintInterface Interface. Most of the MigLayout constraints are available via static methods already proposed by the GConstraint class as in the previous example GConstraint.newline() or GConstraint.width().


MigLayout3.jpg


For information, the "old fashion" will use the following syntax:

but2.setConstraint(""); // No more “by default” way => on the same line
but3.setConstraint("newline, width 150");

We can also take into account all the objects of a given type included in a GPanel by calling another setConstraint() method:

// Height of all the buttons of the panel "pan" fixed to 50 pixels
this.setConstraint(GButton.class, new GConstraint(GConstraint.height(50)));

Old fashion ...

pan.setConstraint(GButton.class, "height 50");

Some available « constraints »

The following table gives an overview of some basic MigLayout constraints. To get the exact API of the GBasicConstraintInterface methods proposed by GConstraint class, see the Java doc.

wrap [gapsize] Go to the next line after the component (gapsize => amount of pixel after it)
newline [gapsize] Go to the next line before the component (gapsize => amount of pixel before it)
skip [count] Skip one or several columns (depending of the value of count, 1 by default)
span [countx [county]],
spanx [countx], spany [county]
Allows to the component to spread on several cells (countx for horizontal axis and county for vertical axis)
split [count] Allows to put several components on a single cell
flowx, flowy Direction when a component is added (flowx by default)
height, width size Specify the height (resp. width) of the component in pixel (preferred size)
push (pushx, pushy) « Push » the next components (visible when the main window is enlarged)
grow (growx', growy) Fill the cell with the component
gap left [right] [top] [bottom],
gaptop, gapbottom,
gapleft, gapright [gap]
Specify the gap (in pixels by default)
align [alignx, aligny],
alignx, aligny [align]
Specifiy alignment: (left, center, right) for alignx and (top, center, bottom) for aligny

For more constraints, one may read the MigLayout user manual.

On the following window, we can see several examples of such use of these layout constraints ...


MigLayout4.jpg


We can see that the management of a GEntryReal (for example) may be more confuse than for a simple GButton. Indeed, this widget is composed of several other subwidgets :

=> subwidget 0: GLabelWithIndicator
   => subwidget 0.0: GLabel
   => subwidget 0.1: GIndicator (the "*" when the value is modified)
=> subwidget 1: GTextField
=> subwidget 2: GUnit

So, with the old fashion, it was possible (more or less easily) to access to such subwidgets using "|", "?", "+" syntax. We will not give more details about it here.

With the new API, it is easier to explain it with the setInnerDescendantContraint() method:

For example, if we want:

  1. to apply "newline" to the global widget
  2. to set 200 pixels for the textfield width
  3. to skip a cell to the Gunit field

the solution is this one :

GEntryReal real = new GEntryReal(...);

// Applying "newline" to the GLabel
real.setInnerDescendantConstraint(new GConstraint(GConstraint.newline(), 0, 0);
// Applying "width 200" to the texfield
real.setInnerDescendantConstraint(new GConstraint(GConstraint.width(200)), 1);
// Applying "skip"to the texfield
real.setInnerDescendantConstraint(new GConstraint(GConstraint.skip(1)), 2);


Return to the introduction ↑ Go to the next page →