Discussion :

[Invité]

Bonjour,

j'ai posé la question en FireMonkey, mais je remets au gout du jour une Form VCL. Et je ne m'en sors pas mieux +

On reste donc en VCL.
Je voudrais que le panel central paCT soit centré dans la Form lors des resize de celle-ci... Déjà on fait cela comment sur un TPanel vide ?

Pour réaliser le TPanel centré, j'ai pris le composant le plus sophistiqué un gridPanel... J'ai un problème de programmation de ce composant pour définir les hauteurs et largeurs de ces cellules comme dans FMX d'ailleurs.

Je veux que les TLabels laLOGIN et laPASSWORD soient autosize. Une fois ceci fait, je veux qu'il y ait un espace de 8 pixels entre le bord droit de laPASSORD, en réalité max(laLOGIN.width, laPASSWORD.width), et le bord gauche des 2 TEdits, edLOGIN et edPASSWORD (edLOGIN.Left) sachant que edLOGIN et edPASSWORD ont une taille définie et identique. Une fois ceci fait je veux que le paCT soit autosize puis centré dans la Form. Je le fais mais avec des calculs et un TPanel (pas un Gridpanel qui refuse obstinément de faire ce que je veux). Je fais exactement la même chose sans aucun calcul en Lazarus : ce sont les ancrages qui font le travail.

Pour la partie Right-Bottom (le TPanel paRB), c'est le délire complet. Les btQUIT et btVALID ont une taille définie. Je les veux l'un à gauche de l'autre sur une même ligne horizontale. Mais un paRB autosize les place verticalement l'un au dessus de l'autre ?!

Les Delphiens font comment avec cette approche que je n'assimile pas et qui me semble pour l'instant limitée ?

Alors je sais cela semble anecdotique. En réalité je ne trouve pas que cela le soit. Voici de copie d'écran du même programme (là c'était en FMX avec un TGridpanelLayout) sur 2 windows, un XP et un 7.

Le problème se trouve au niveau du label "Votre mot de passe"... Plus près en 7, il était mangé en XP... Visiblement la gestion dynamique est "moyenne". Je n'ai jamais rencontré ce problème en lazarus et pourtant les polices Win/Nux ne sont pas identiques... Peut-être est-ce la raison pour laquelle les ancrages sont si bien pensés en Lazarus.

[ShaiLeTroll]

tu le pose au centre en Design Time
Tu définis Anchors sur [] (oui oui rien du tout, faut RETIRER Top Left)
Et cela restera au centre et ce peut importe la taille, il calcul de lui même le centrage
En fait le Anchors par défaut sur [Top, Left] est le moins couteux car ne nécessite aucun calcul

[Invité]

Bonjour,

OK pour la première question... Mais pour le reste qui est quand même plus important ?

La gestion de l'autosize des champs et de leur position relative ? Le "Votre mot de passe en XP" qui va rentrer dans le TEdit alors qu'en 7 (IDE utilisé sur cet OS), il est correct ? Je pratique comment ?

En VCL c'est peu important. Ce qui m'inquiète plus, c'est que j'ai posé la question 2 fois déjà. Une fois en FMX Desktop et une fois en FMX mobile... Et pour les 2 je m'en suis sorti avec du calcul. A la rigueur ce n'est pas difficile sauf qu'il faut que j'automatise l'approche... Heureusement que je n'ai pas encore porté le programme en Mac OS X. Mais c'est apparenté à Nux (un maintenant lointain cousin).... Je ne vais pas refaire l'interface graphique à chaque fois, d'autant que ce sera en aveugle !

[Lung]

La gestion de l'autosize des champs et de leur position relative ?

Moi j'utiliserais un TLabeledEdit avec un LabelSpacing à 8 et LabelPosition à lpLeft.

[ShaiLeTroll]

OK pour la première question... Mais pour le reste qui est quand même plus important ?

Laisse donc le temps de répondre !
tu as modifié ta question, donc j'allais modifié ma réponse !

Pour réaliser le TPanel centré, j'ai pris le composant le plus sophistiqué un gridPanel... J'ai un problème de programmation de ce composant pour définir les hauteurs et largeurs de ces cellules comme dans FMX d'ailleurs.

Un peu comme un Java avec du swing et ses Layout (Flow, Grid)

Je veux que les TLabels laLOGIN et laPASSWORD soient autosize. Une fois ceci fait, je veux qu'il y ait un espace de 8 pixels entre le bord droit de laPASSORD, en réalité max(laLOGIN.width, laPASSWORD.width), et le bord gauche des 2 TEdits, edLOGIN et edPASSWORD (edLOGIN.Left) sachant que edLOGIN et edPASSWORD ont une taille définie et identique. Une fois ceci fait je veux que le paCT soit autosize puis centré dans la Form. Je le fais mais avec des calculs et un TPanel (pas un Gridpanel qui refuse obstinément de faire ce que je veux). Je fais exactement la même chose sans aucun calcul en Lazarus : ce sont les ancrages qui font le travail.

J'aurais aussi pensé au TLabeledEdit mais il ne va pas gérer le plus grand label des deux !

Copie directement cet extrait de DFM sur un TForm vide
le copier-coller d'un texte DFM va créer les objets dans le PAS et le DFM
Tu peux modifier les libellés cela va décaler les Edit

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
object pnlLabelEdit: TPanel
  Left = 114
  Top = 87
  Width = 334
  Height = 64
  Anchors = []
  BevelOuter = bvNone
  Caption = 'pnlLabelEdit'
  Color = clAqua
  ParentBackground = False
  TabOrder = 0
  ExplicitLeft = 113
  ExplicitTop = 84
  object pnlLabels: TPanel
    Left = 0
    Top = 0
    Width = 79
    Height = 64
    Align = alLeft
    AutoSize = True
    BevelOuter = bvNone
    Caption = 'pnlLabels'
    Color = 15699509
    ParentBackground = False
    ShowCaption = False
    TabOrder = 0
    ExplicitHeight = 42
    object lbl1: TLabel
      AlignWithMargins = True
      Left = 9
      Top = 11
      Width = 32
      Height = 13
      Margins.Left = 8
      Margins.Top = 0
      Margins.Right = 0
      Margins.Bottom = 0
      Caption = 'login : '
    end
    object lbl2: TLabel
      AlignWithMargins = True
      Left = 8
      Top = 38
      Width = 71
      Height = 13
      Margins.Left = 8
      Margins.Top = 0
      Margins.Right = 0
      Margins.Bottom = 0
      Caption = 'mot de passe :'
    end
  end
  object pnlEdits: TPanel
    AlignWithMargins = True
    Left = 87
    Top = 8
    Width = 239
    Height = 48
    Margins.Left = 8
    Margins.Top = 8
    Margins.Right = 8
    Margins.Bottom = 8
    Align = alClient
    AutoSize = True
    BevelOuter = bvNone
    Caption = 'pnlEdits'
    Color = 9685681
    ParentBackground = False
    TabOrder = 1
    ExplicitHeight = 73
    object ed2: TEdit
      Left = 0
      Top = 27
      Width = 164
      Height = 21
      TabOrder = 0
      Text = 'ed2'
    end
    object ed1: TEdit
      Left = 0
      Top = 0
      Width = 164
      Height = 21
      TabOrder = 1
      Text = 'ed1'
    end
  end
end

Pour la partie Right-Bottom (le TPanel paRB), c'est le délire complet. Les btQUIT et btVALID ont une taille définie. Je les veux l'un à gauche de l'autre sur une même ligne horizontale. Mais un paRB autosize les place verticalement l'un au dessus de l'autre ?!

Pas compris le besoin ni le problème

[Invité]

Un peu comme un Java avec du swing et ses Layout (Flow, Grid)

Je ne pense pas être aller aussi loin en Java... surtout en swing. Aucun souvenir.

Si tu veux repasser en TPanel au lieu de TGridPanel

Je n'en sais rien. Je cherche une approche cohérente. A terme ce ne sera que du FireMonkey. Les outils FireMonkey sont plus compliqués. J'ai peu de points de repère. Pour comprendre la philosophie Delphi, je pars du VCL. Je sais que ce n'est pas nécessairement une bonne méthode... Mais faute de mieux, cela permet de cogiter.

Mais je sais 2 choses.

1. J'ai déjà travaillé sur le transfert FMX Win Desktop vers FMX Androîd (mobile). Je n'en tire aucune conclusion à ce niveau de l'organisation des Forms. Des univers totalement différents, donc je n'attendais rien de particulier. Mais Delphi m'ouvre des horizons "inespérés" compte tenu de mon niveau de "mobile".
2. Par contre pour le portage Win/Mac OS X/Linux alors là j'ai déjà donné (Lazarus/Qt...). J'ai un niveau d'exigence. Et je sais que le Designer et ses outils sont d'une importance capitale. D'autant plus qu'avec Delphi, on joue en aveugle. En Qt et Lazarus, on dispose du Designer dans l'OS cible. Donc compte tenu de cette caractéristique de Delphi, mes outils doivent être performants c'est-à dire la manière dont j'emploie les outils qui sont à ma disposition dans Delphi ou les méthodes de substitution qu'il va me falloir développer. J'en suis au stade de ne pas savoir si c'est moi qui n'arrive pas à m'adapter à ces Panels/Layouts ou si conceptuellement, ils sont "faiblards" et mal adaptés à mes approches du développement Desktop multi-plateforme. Et compte tenu de ce que je vois dans l'IO de ces objets, je pose des questions... faiblards par rapport à d'autres approches évidemment : si pour obtenir, un affichage "portable" (i.e. sans défaut en mac OS X), il me faut pour centrer mes champs 15 layouts emboîtés les uns dans les autres, ce n'est pas jouable. Il vaut mieux gérer le problème autrement. Donc comme je l'ai écrit dans le forum FMX autant automatisé l'approche et même créer un composant si nécessaire... Quiqu'en FMX, la création de composant semble bien différer de celle en Lazarus (ou probablement de VCL).

Pas compris le besoin ni le problème

Peu important. Je voulais aligner horizontalement en bas à droite de ma Form, une série de boutons espacés régulièrement et corrigée (la série affichée) si certains boutons sont invisibles. Je fais cela usuellement en Lazarus/Qt sans aucun code particulier.

J'oubliais pour l'Autosize. Pour moi, il est indispensable (y compris pour les boutons). Toutes mes productions au lycée sont bilingues. Vous imaginez le problème avec des champs de longueurs (width) fixes ? Cela m'évoque d'ailleurs une discussion avec Paul... On a déjà parlé de cela... Et je ne me rappelle plus de ce qu'il a proposé. Je fouille.

[addendum 17:40]
OK, j'ai retrouvé la discussion. Elle n'était pas avec Paul mais avec... ShaiLeTroll (tiens, tiens...) >> http://www.developpez.net/forums/d12...sation-projet/ et une autre justement sur ce problème que j'avais évoqué lors de l'essai d'une version trial sur le même sujet qui n'était pas prépondérant à l'époque... et qui est enterrée au fond de ma mémoire. A l'époque je ne pensais pas développer un jour "prochain" avec Delphi... Comme quoi. >> http://www.developpez.net/forums/d13...ancrer-objets/

[ShaiLeTroll]

Une variante qui correspond parfaitement à tes images
En utilisant une Constraints sur le Panel des Edits
Ainsi le Panel LabelEdit doit s'agrandir pour que le Panel Edit conserve sa Constrainte

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
procedure TZooVCLTestAlignForm.ed2Change(Sender: TObject);
begin
  lbl2.Caption := ed2.Text;
end;

Code dfm :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
object pnlLabelEdit: TPanel
  Left = 122
  Top = 62
  Width = 266
  Height = 64
  Anchors = []
  AutoSize = True
  BevelOuter = bvNone
  Caption = 'pnlLabelEdit'
  Color = clAqua
  ParentBackground = False
  TabOrder = 0
  object pnlLabels: TPanel
    Left = 0
    Top = 0
    Width = 79
    Height = 64
    Align = alLeft
    AutoSize = True
    BevelOuter = bvNone
    Caption = 'pnlLabels'
    Color = 15699509
    ParentBackground = False
    ShowCaption = False
    TabOrder = 0
    object lbl1: TLabel
      AlignWithMargins = True
      Left = 9
      Top = 11
      Width = 32
      Height = 13
      Margins.Left = 8
      Margins.Top = 0
      Margins.Right = 0
      Margins.Bottom = 0
      Caption = 'login : '
    end
    object lbl2: TLabel
      AlignWithMargins = True
      Left = 8
      Top = 38
      Width = 71
      Height = 13
      Margins.Left = 8
      Margins.Top = 0
      Margins.Right = 0
      Margins.Bottom = 0
      Caption = 'mot de passe :'
    end
  end
  object pnlEdits: TPanel
    AlignWithMargins = True
    Left = 87
    Top = 8
    Width = 171
    Height = 48
    Margins.Left = 8
    Margins.Top = 8
    Margins.Right = 8
    Margins.Bottom = 8
    Align = alClient
    AutoSize = True
    BevelOuter = bvNone
    Caption = 'pnlEdits'
    Color = 9685681
    Constraints.MinWidth = 170
    ParentBackground = False
    TabOrder = 1
    ExplicitWidth = 239
    object ed2: TEdit
      Left = 0
      Top = 27
      Width = 164
      Height = 21
      TabOrder = 0
      Text = 'ed2'
      OnChange = ed2Change
    end
    object ed1: TEdit
      Left = 0
      Top = 0
      Width = 164
      Height = 21
      TabOrder = 1
      Text = 'ed1'
    end
  end
end

[Invité]

OK et merci pour l'exemple que j'ai un petit peu analysé (le premier) faute de temps. Mais je reverrai demain.

Cela fonctionne presque comme je veux (dans cet exemple) :

• OK : si on modifie le caption d'un des TLabels, le TPanel varie automatiquement en largeur.
• Moins bien : La largueur utile est trop importante : le pnLabelEdit et le pnEdit sont trop longs. Je voudrais qu'ils collent au contenu (aux TEdits) notamment à droite.

PS : Modifier le dfm n'est pas suffisant. Il faut ajouter les uses nécessaires. Mais ceci fait, bien que le programme fonctionne, qu'il ne plante pas, un lbl2.caption=''; n'est pas reconnu. J'ai dû ajouter à la main dans le code de la TForm un lbl2: TLabel...

Encore merci pour votre aide.

[ShaiLeTroll]

PS : Modifier le dfm n'est pas suffisant. Il faut ajouter les uses nécessaires. Mais ceci fait, bien que le programme fonctionne, qu'il ne plante pas, un lbl2.caption=''; n'est pas reconnu. J'ai dû ajouter à la main dans le code de la TForm un lbl2: TLabel...

il ne faut pas modifier le DFM en mode Texte mais tout simplement coller directement en mode DesignTime !
Comme si tu copias un bouton pour le recoller sur une autre fenêtre en mode Builder (pas en mode texte)

[Paul TOTH]

Le problème se trouve au niveau du label "Votre mot de passe"... Plus près en 7, il était mangé en XP... Visiblement la gestion dynamique est "moyenne". Je n'ai jamais rencontré ce problème en lazarus et pourtant les polices Win/Nux ne sont pas identiques... Peut-être est-ce la raison pour laquelle les ancrages sont si bien pensés en Lazarus.

quelle est la police utilisé ? si elle n'existe pas sous XP Windows la remplace au pif et ça peu donner n'importe quoi.

[Invité]

Bonjour Paul,

En général en Lazarus (donc Win/Nux), je ne définis pas la police. Donc est utilisée celle retenue par l'OS par défaut . Je n'ai commencé à "imposer" des polices qu'avec Qt. C'est plus simple parce que je peux utiliser la même approche qu'en HTML (i.e. une liste de polices substituables en cas d'absence).

Bonjour ShaiLeTroll,

Cela fonctionne. Je suis en train de me construire un tuto. Une fois le principe et les approches définis, c'est effectivement gérable. Mais jusqu'à preuve du contraire, j'estime que c'est nettement plus compliqué que Qt et Lazarus... et même si je n'en ai pas la certitude, ni encore l'argumentation, disons moins adapté que ce que je pratique et veux obtenir en référence à Qt, Lazarus et Windev... Cela fait beaucoup quand même.

Pour me faire la main, je reproduis cet exemple simple :

Description Form1
A gauche en haut : Button1 (ancré)
A droite en haut : Button2 (ancré).
Entre les 2TButton, TStringGrid1 dont les bords verticaux devront rester exactement à 24 pixels des bords opposés des boutons. Et le bord inférieur de la TStringGrid devra atteindre exactement la moitié de la hauteur de la Form.
Sous les 2 bouttons : une Tlist qui devra rester exactement alignée sous les 2 boutons et devra descendre jusqu'à 24 px du bord inférieur de la Form. Enfin, si possible, les bords jaune aurant une épaisseur constante quelque soit la taille de la page. Je précise si c'est possieble parce que Delphi semble utiliser un ratio lorsqu'il calcule. Autrement dit si la distance séparant 2 objets est 12 pixels quand la Formx.width = 640, la distance devient 24 pixels quand Formx.width = 1280.

Je vous fais le schema sans un seul TPanel ou TLayout en Lazarus (dfm dispo ci-dessous) avec les 11 points d'ancrage nécessaires. Le seul point non directement utilisable et le point de centrage de la Form (en rouge au milieu). par simplicité ici j'ai utilisé un TLabel sans caption.
L'ancrage de la TStringGrid :

Le résultat obtenu (La Form sous 2 tailles diffrentes et évidemment avec la même échelle de copie d'écran) :

et le dfm (lfm)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
object Form1: TForm1
  Left = 238
  Height = 232
  Top = 145
  Width = 852
  Caption = 'Form1'
  ClientHeight = 232
  ClientWidth = 852
  LCLVersion = '1.2.0.3'
  object Button1: TButton
    AnchorSideLeft.Control = Owner
    AnchorSideTop.Control = Owner
    Left = 18
    Height = 25
    Top = 12
    Width = 75
    BorderSpacing.Left = 18
    BorderSpacing.Top = 12
    Caption = 'Button1'
    TabOrder = 0
  end
  object Button2: TButton
    AnchorSideTop.Control = Button1
    AnchorSideRight.Control = Owner
    AnchorSideRight.Side = asrBottom
    Left = 759
    Height = 25
    Top = 12
    Width = 75
    Anchors = [akTop, akRight]
    BorderSpacing.Right = 18
    Caption = 'Button2'
    TabOrder = 1
  end
  object ListBox1: TListBox
    AnchorSideLeft.Control = Button1
    AnchorSideTop.Control = Button1
    AnchorSideTop.Side = asrBottom
    AnchorSideRight.Control = Button1
    AnchorSideRight.Side = asrBottom
    AnchorSideBottom.Control = Owner
    AnchorSideBottom.Side = asrBottom
    Left = 18
    Height = 171
    Top = 37
    Width = 75
    Anchors = [akTop, akLeft, akRight, akBottom]
    BorderSpacing.Bottom = 24
    ItemHeight = 0
    TabOrder = 2
  end
  object ListBox2: TListBox
    AnchorSideLeft.Control = Button2
    AnchorSideTop.Control = Button2
    AnchorSideTop.Side = asrBottom
    AnchorSideRight.Control = Button2
    AnchorSideRight.Side = asrBottom
    AnchorSideBottom.Control = Owner
    AnchorSideBottom.Side = asrBottom
    Left = 759
    Height = 171
    Top = 37
    Width = 75
    Anchors = [akTop, akLeft, akRight, akBottom]
    BorderSpacing.Bottom = 24
    ItemHeight = 0
    TabOrder = 3
  end
  object StringGrid1: TStringGrid
    AnchorSideLeft.Control = Button1
    AnchorSideLeft.Side = asrBottom
    AnchorSideTop.Control = Button1
    AnchorSideRight.Control = Button2
    AnchorSideBottom.Control = ptCenter
    Left = 117
    Height = 104
    Top = 12
    Width = 618
    Anchors = [akTop, akLeft, akRight, akBottom]
    BorderSpacing.Left = 24
    BorderSpacing.Right = 24
    TabOrder = 4
  end
  object ptCenter: TLabel
    AnchorSideLeft.Control = Owner
    AnchorSideLeft.Side = asrCenter
    AnchorSideTop.Control = Owner
    AnchorSideTop.Side = asrCenter
    Left = 426
    Height = 1
    Top = 116
    Width = 1
    ParentColor = False
  end
end

J'ai privilégié Lazarus pour le test parce qu'en Qt l'approche est plus compliquée disons mal aisée pour agrandir la Grid et la faire coller au 2 QPushButton. Le système Lazarus est conceptuellement le meilleur système que j'ai pu rencontrer : simple et puissant à la fois. Je ne dis pas (encore) que celui de Delphi ne permet pas de réaliser mon approche mais déjà, il faut remarquer que celui de Lazarus est centralisé sur une seule propriété de chaque objet à ancrer (enfin plusieurs regroupées en un même "lieu" cf la copie d'écran ci-dessus) alors que sous Delphi, il faut jouer avec des propriétés différentes (i.e. non regroupées) et des Layouts (donc couches supplémentaires)... Prise de tête en vue car je refuse de régresser à ce niveau... Toute aide est bienvenue pour me permettre de m'adapter.

Don en Delphi, je place les mêmes éléments sur ma Form. J'enlève pour le recalcul les akLeft et akTop, qui comme vous l'indiquez empêche les recalculs et donc j'obtiens ceci.

Si je réduis la taille de la Form ou l'augmente :

[SergioMaster]

Bonjour,

pour faire ce dernier écran , j'aurais procédé (vite fait) de la manière suivante :

bouton1 et colonne1 dans un panel1 (aligné à gauche, avec marges)
bouton2 et colonne2 idem dans un panel2 mais aligné à droite
et enfin la grid alignée soit client avec peut être contrainte de taille max en hauteur , soit en haut (toujours avec marges)

bon c'est vrai les panels sont peut être superflus et remplaçables par des ancrages mais dans ce cas , il faut alors ancrer également la grid

en d7

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
 
object Form1: TForm1
  Left = 209
  Top = 102
  Width = 832
  Height = 328
  Caption = 'Form1'
  Color = clBtnFace
  Font.Charset = DEFAULT_CHARSET
  Font.Color = clWindowText
  Font.Height = -11
  Font.Name = 'MS Sans Serif'
  Font.Style = []
  OldCreateOrder = False
  DesignSize = (
    816
    289)
  PixelsPerInch = 96
  TextHeight = 13
  object Button1: TButton
    Left = 24
    Top = 24
    Width = 113
    Height = 25
    Caption = 'Button1'
    TabOrder = 0
  end
  object Memo1: TMemo
    Left = 24
    Top = 64
    Width = 113
    Height = 201
    Anchors = [akLeft, akTop, akBottom]
    Lines.Strings = (
      'Memo1')
    TabOrder = 1
  end
  object StringGrid1: TStringGrid
    Left = 152
    Top = 24
    Width = 504
    Height = 153
    Anchors = [akLeft, akTop, akRight]
    TabOrder = 2
  end
  object Button2: TButton
    Left = 672
    Top = 24
    Width = 113
    Height = 25
    Anchors = [akTop, akRight]
    Caption = 'Button2'
    TabOrder = 3
  end
  object Memo2: TMemo
    Left = 672
    Top = 64
    Width = 113
    Height = 201
    Anchors = [akTop, akRight, akBottom]
    Lines.Strings = (
      'Memo1')
    TabOrder = 4
  end
end

[Invité]

Bonjour Serge,

Ce que je n'arrive pas à comprendre c'est la "ballade" des objets les uns par rapport aux autres... puisque tout est défini par rapport à la Form...

Il y a un truc qui me laisse coi : Tu vois, je place mes 5 éléments. Je "laisse" calculer comme ci-dessus. Le résultat obtenu est significatif : il doit être corriger.

Tu fais la même chose en Lazrus, d'abord il ne fait rien par défaut. Ensuite tu ajoutes tes contraintes, relativement objet par objet et prenant comme base l'objet de ton choix pour indiquer la référence du traitement à accomplir. Je ne peux pas faire cela en Delphi... Donc je dois trouver une approche différente.

En Delphi, conceptuellement, il y a un truc qui m'échappe. Au départ, il ne se passe rien, tu n'as rien à corriger puisque akLeft et akTop sont sélectionnés. Ensuite...
Maintenir la longueur d'un intervalle quelque soit la taille de la Form ? Je veux maintenir aucun espace entre le bord inférieur du bouton et le bord supérieur du ListBox. Je lui indique cela comment ? C'est quand même pas lui qui va décider ?
Ensuite en supposant que j'utilise un TPanel, comment j'intègre mes 24 px entre le bord droit de mon bouton et le bord gauche de ma StringGrid ? Un autre TPanel ?
Quel est intéret du TPanel ? Il n'est pas fixable autrement que les autres objets graphiques. Que je place mon TButton dans un TPanel qui lui est réservé qu'est-ce que cela apporte de plus ?

J'ai par contre partiellement compris l'intérêt des TGridPanel et TGridPanelLayout sauf que leur RowSpan et le ColSpan n'en sont pas... mais permettent de placer sur les intersections... et que la gestion des width et height des col et row est bizarre... Enfin chez moi, elles ne répondent pas comme attendu.... mais j'attends peut-être l'impossible. Finement et à volonté du programmeur, c'est possible ?

[SergioMaster]

Gilles,

je n'ai jamais vraiment adhéré au TGridPanel et TGridlayout (vieux delphiste habitué a peu )

Quel est intéret du TPanel ? Il n'est pas fixable autrement que les autres objets graphiques. Que je place mon TButton dans un TPanel qui lui est réservé qu'est-ce que cela apporte de plus ?

les panels sont gérés par les propriétés align (bien que tu puisses bien sur les ancrer) et les ancrages par contre sont par rapport au parent et non par rapport à la forme (toujours vieux delphiste quant on a pas on fait avec ce qu'on a ,d3 n'a même pas d'ancrages , d7 pas de margins )

j'ai quelque peu modifié mon dernier post (pendant que toi aussi d'ailleurs ) et la proposition D7 (uniquement ancrage) n'a pas le comportement que tes dernières images écrans montre , mais bien le même que tes écrans lazarus

[Edit] PS. idem avec XE4 , cependant il y a juste un truc concernant la grid , tu veux quelle soit extensible en hauteur/largeur ou juste en largeur ? ou ?...
juste pour essai , j'ai mis une valeur maxheight pour la grid avec un ancrage haut+bas et là , je "tombe" sur un truc pas prévu , je ne peux plus agrandir au max la forme


Serge

[Invité]

Oui Serge,

Pour l'ancrage, je l'ai zippé. Je viens de vérifier. Tous les Anchors sont []. Et le comportement est.... ce qu'il est. Le problème c'est donc de le corriger.

Pour les parents, oui : mais ce système est-il adapté ?
Le bouton Haut Gauche, il sert de référence

• à la TListBox (en son dessous) pour le Top, le Left et le Right de cette dernière
• à la TStringGrid (à sa droite) pour le Top et le Left de cette dernière

Mais le bouton Haut Droit, il sert lui aussi de référence à la TStringGrid. En croisant ces 2 aspect, la TStringGrid devrait avoir 2 parents ?

Pour utiliser les parents, il faut que quoi au juste ? Que j'imbrique des Tpanels dans les Tpanels ? C'est une obligation sinon le TParent reste la Form. Un peu comme ShaileTroll m'a proposé ? Mais dans l'autre exemple, il n'y avait que 4 champs pour 3 TPanels... Alors si je veux utiliser les 2 techniques (tu imagines, l'exemple dessus et dans le centre de la partie vide en dessous de le TStringGrid, je place les TPanels de ShaileTroll... Je laisse mijoter une petite semaine et je veux modifier (déplacer) un champ utile (pas un TPanel de construction)... C'est jouable ?

[SergioMaster]

rapidement , avant de partir en ville , en xe4 / vcl

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
object Form1: TForm1
  Left = 0
  Top = 0
  Caption = 'Form1'
  ClientHeight = 406
  ClientWidth = 618
  Color = clBtnFace
  Font.Charset = DEFAULT_CHARSET
  Font.Color = clWindowText
  Font.Height = -11
  Font.Name = 'Tahoma'
  Font.Style = []
  OldCreateOrder = False
  PixelsPerInch = 96
  TextHeight = 13
  object Panel1: TPanel
    Left = 0
    Top = 0
    Width = 177
    Height = 406
    Align = alLeft
    Caption = 'Panel1'
    TabOrder = 0
    object Button1: TButton
      AlignWithMargins = True
      Left = 4
      Top = 4
      Width = 169
      Height = 25
      Align = alTop
      Caption = 'Button1'
      TabOrder = 0
      ExplicitLeft = 32
      ExplicitTop = 16
      ExplicitWidth = 121
    end
    object ListBox1: TListBox
      AlignWithMargins = True
      Left = 4
      Top = 35
      Width = 169
      Height = 367
      AutoComplete = False
      Align = alClient
      ItemHeight = 13
      TabOrder = 1
      ExplicitLeft = 32
      ExplicitTop = 55
      ExplicitWidth = 121
      ExplicitHeight = 314
    end
  end
  object Panel2: TPanel
    Left = 441
    Top = 0
    Width = 177
    Height = 406
    Align = alRight
    Caption = 'Panel1'
    TabOrder = 1
    ExplicitLeft = 8
    object Button2: TButton
      AlignWithMargins = True
      Left = 4
      Top = 4
      Width = 169
      Height = 25
      Align = alTop
      Caption = 'Button1'
      TabOrder = 0
    end
    object ListBox2: TListBox
      AlignWithMargins = True
      Left = 4
      Top = 35
      Width = 169
      Height = 367
      AutoComplete = False
      Align = alClient
      ItemHeight = 13
      TabOrder = 1
    end
  end
  object Panel3: TPanel
    Left = 177
    Top = 0
    Width = 264
    Height = 406
    Align = alClient
    Caption = 'Panel3'
    TabOrder = 2
    ExplicitLeft = 224
    ExplicitTop = 200
    ExplicitWidth = 185
    ExplicitHeight = 41
    DesignSize = (
      264
      406)
    object StringGrid1: TStringGrid
      AlignWithMargins = True
      Left = 8
      Top = 8
      Width = 256
      Height = 185
      Anchors = [akLeft, akTop, akRight, akBottom]
      TabOrder = 0
    end
  end
end

[Invité]

Merci Serge.

J'ai implanté le dfm. Ce n'est pas loin de ce que je veux obtenir. La gestion de la taille de la TStringGrid est approximative (mais pour du vite fait c'est beaucoup mieux que ce que je suis capable de faire actuellement en beaucoup plus de temps)... et tout est "figé" (par exemple la largeur du bouton).

Donc j'arrête d'écrire. Je démonte les différentes approches proposées. J'essaye de comprendre comment cela fonctionne... Je regarde si c'est portable FMX... Et je reformule après... A mon avis, j'en ai pour jusqu'à ce soir.

Merci à tous. Si j'arrive à quelque chose, je te transmets les résultats de ce que j'ai compris sous odt avec les copies d'écran à côté... Sinon, je développerai mon approche commencée avec un système perso de positionnement sur le même principe que Lazarus (i.e. les mêmes propriétés que Lazarus).

[Invité]

Une petite pause. J'en profite pour évoquer un problème idiot, qui n'a pas pour autant ralentit mon analyse du problème.

Le projet (vite fait) mais bien utile de Serge : 3 panels principaux. Je lis le dfm du Panel1 et calcule la position "automatique" du ListBox.

J'ouvre le dfm. Les AlignWithMargins sont activées avec des margins de 3 par défaut. Mais le compte n'est jamais juste. Je suis incapable de calculer les marges enfin d'obtenir les nombres précisés dans le dfm notamment le ListBox1.Top = 35. C'est un calcul effectué par l'IDE et je n'obtiens pas 35 de manière raisonnée, pas plus en tenant compte des BevelWidth -qui d'ailleurs ne semblent pas intervenir dans le sens de la hauteur*- que d'une aucune autre manière.

*Sur un exemple plus simple utilisé par soucis de compréhension, j'ai cette interprétation faute de mieux. Une Form sans margins et un TPanel alClient, AlignWithMargins désactivé.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
object Form2: TForm2
  Left = 0
  Top = 0
  Margins.Left = 0
  Margins.Top = 0
  Margins.Right = 0
  Margins.Bottom = 0
  ClientHeight = 320
  ClientWidth = 186
  Color = clBtnFace
 
  object Panel1: TPanel
    Left = 0
    Top = 0
    Width = 185
    Height = 320
    Margins.Left = 0
    Margins.Top = 0
    Margins.Right = 0
    Margins.Bottom = 0
    Align = alLeft
    ExplicitHeight = 41
 end
end

AlignWithMargins n'est pas activé et de toute façon j'ai défini les Margins.xx à 0.
Je prends note également du fait que BevelWidth est forcément supérieur strictement à 0 (1 par défaut).

Alors je lis :
Form 2 :

• ClientHeight = 320
• ClientWidth = 186

Le Panel qu'elle contient est alClient... donc occupe normalement toute la surface. On peut imaginer un décalage de 2, bord à bord à touche touche donc -1 à gauche, -1 à droite... ou on peut envisager un "effet de bord BevelWidth" sur la largeur uniquement (d'où le nom), ou une superposition totale.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
    Width = 185
    Height = 320

La perte de 1 dans la largeur est à mon sens assimilable à la 2ème solution. Mais je ne vois rien dans le sens de la hauteur qui expliquerait le 35 du dfm.

[Invité]

OK. Le problème est réglé en VCL à condition que le Design ne soit pas trop compliqué et surtout pas trop "dynamique" avec par exemple des captions variant suivant la langue car là contrairement à Lazarus, les calculs deviennent ponctuellement nécessaires. En combinant les codes de Serge et de ShaileTroll et avec l'aide des TGridPanels, j'obtiens tous les effets désirés. Reste ce problème de calculs un peu bizarroïde mais qui n'a absolument aucune incidence sur la présentation (mais que j'aimerais comprendre) et un autre problème déjà évoqué, un TGridPanel d'une seule colonne ou d'une seule ligne. Je suis obligé d'intervenir dans le dfm pour régler le problème (en Qt aussi d'ailleurs ).

Bref, pour le Desktop, le système est moins ingénieux que celui adopté par Lazarus mais néanmoins fonctionnel au prix d'une consommation importante de Panels. Il est du même niveau de complexité que celui de Qt pour des raisons différentes. C'est d'ailleurs dans les 2 cas, l'ergonomie qui cloche à mon sens. J'envoie le CR à Serge pour la partie VCL s'il veut le mettre en ligne. Et je tente maintenant l'approche en FMX.

Encore merci pour l'aide apportée... et votre patience

Bonne fin de WE.

[SergioMaster]

Bonjour,

J'envoie le CR à Serge pour la partie VCL s'il veut le mettre en ligne. Et je tente maintenant l'approche en FMX.

pourquoi moi non je plaisante

Quant à la fenêtre d'"ancrage des commandes sélectionnées" de Lazarus je pense qu'il s'agit d'un plugin qui , si ça se trouve existe (bien caché)/à déjà été développé également pour Delphi , le tout bien sur serait de le trouver ou bien d'en faire un chose que je n'ai jamais tenté .

Quant à l'approche en FMX , je pense que j'utiliserai dans ce cas des Layouts en lieu et place des Panels .
[Edit] vite fait aussi ma proposition FMX (toujours sans gridlayout , j'ai essayé sans succès de faire un lien sur propriété itemwith et ai abandonné le gridlayout ,je n'a pas assez d'expertise sur ce dernier) . J'ai également essayé d'étudier la problématique du label , pour l'instant je sèche (ou seiche <- ma proie favorite) , je pensais au scaledlayout mais cela ne fonctionnerai pas , du moins si l'on change le texte du label .

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
object Form1: TForm1
  Left = 0
  Top = 0
  Caption = 'Form1'
  ClientHeight = 480
  ClientWidth = 640
  FormFactor.Width = 320
  FormFactor.Height = 480
  FormFactor.Devices = [dkDesktop, dkiPhone, dkiPad]
  DesignerMobile = False
  DesignerWidth = 0
  DesignerHeight = 0
  DesignerDeviceName = ''
  DesignerOrientation = 0
  object Layout1: TLayout
    Align = alLeft
    Height = 480.000000000000000000
    Width = 129.000000000000000000
    object Button1: TButton
      Anchors = [akLeft, akTop, akRight]
      Height = 22.000000000000000000
      Position.X = 24.000000000000000000
      Position.Y = 24.000000000000000000
      TabOrder = 0
      Text = 'Button1'
      Width = 80.000000000000000000
    end
    object ListBox1: TListBox
      Anchors = [akLeft, akTop, akRight, akBottom]
      Height = 401.000000000000000000
      Position.X = 24.000000000000000000
      Position.Y = 64.000000000000000000
      TabOrder = 1
      Width = 81.000000000000000000
      DefaultItemStyles.ItemStyle = ''
      DefaultItemStyles.GroupHeaderStyle = ''
      DefaultItemStyles.GroupFooterStyle = ''
    end
  end
  object Layout2: TLayout
    Align = alRight
    Height = 480.000000000000000000
    Position.X = 511.000000000000000000
    Width = 129.000000000000000000
    object Button2: TButton
      Anchors = [akLeft, akTop, akRight]
      Height = 22.000000000000000000
      Position.X = 24.000000000000000000
      Position.Y = 24.000000000000000000
      TabOrder = 0
      Text = 'Button1'
      Width = 80.000000000000000000
    end
    object ListBox2: TListBox
      Anchors = [akLeft, akTop, akRight, akBottom]
      Height = 401.000000000000000000
      Position.X = 24.000000000000000000
      Position.Y = 64.000000000000000000
      TabOrder = 1
      Width = 81.000000000000000000
      DefaultItemStyles.ItemStyle = ''
      DefaultItemStyles.GroupHeaderStyle = ''
      DefaultItemStyles.GroupFooterStyle = ''
    end
  end
  object Layout3: TLayout
    Align = alClient
    Height = 480.000000000000000000
    Width = 382.000000000000000000
    object StringGrid1: TStringGrid
      Align = alTop
      Height = 189.000000000000000000
      Margins.Left = 2.000000000000000000
      Margins.Top = 4.000000000000000000
      Margins.Right = 2.000000000000000000
      Position.X = 2.000000000000000000
      Position.Y = 4.000000000000000000
      TabOrder = 0
      Width = 378.000000000000000000
      RowCount = 100
      RowHeight = 21.000000000000000000
      object StringColumn1: TStringColumn
        Height = 168.000000000000000000
        TabOrder = 0
        Width = 100.000000000000000000
      end
      object StringColumn2: TStringColumn
        Height = 168.000000000000000000
        Position.X = 100.000000000000000000
        TabOrder = 1
        Width = 100.000000000000000000
      end
      object StringColumn3: TStringColumn
        Height = 168.000000000000000000
        Position.X = 200.000000000000000000
        TabOrder = 2
        Width = 100.000000000000000000
      end
      object StringColumn4: TStringColumn
        Height = 168.000000000000000000
        Position.X = 300.000000000000000000
        TabOrder = 3
        Width = 100.000000000000000000
      end
      object StringColumn5: TStringColumn
        Height = 168.000000000000000000
        Position.X = 400.000000000000000000
        TabOrder = 4
        Width = 100.000000000000000000
      end
    end
    object Label1: TLabel
      Anchors = [akLeft, akTop, akRight]
      Height = 17.000000000000000000
      Position.X = 8.000000000000000000
      Position.Y = 224.000000000000000000
      Text = 'Texte normal'
      Width = 105.000000000000000000
      object Edit1: TEdit
        Anchors = [akLeft, akTop, akRight]
        TabOrder = 0
        Position.X = 107.000000000000000000
        Position.Y = -3.000000000000000000
        Width = 100.000000000000000000
        Height = 22.000000000000000000
        KillFocusByReturn = False
      end
    end
    object Label2: TLabel
      Anchors = [akLeft, akTop, akRight]
      Height = 17.000000000000000000
      Position.X = 8.000000000000000000
      Position.Y = 256.000000000000000000
      Text = 'un texte qui serait trop long '
      Width = 105.000000000000000000
      Trimming = ttWord
      object Edit2: TEdit
        Anchors = [akLeft, akTop, akRight]
        TabOrder = 0
        Position.X = 107.000000000000000000
        Position.Y = -3.000000000000000000
        Width = 100.000000000000000000
        Height = 22.000000000000000000
        KillFocusByReturn = False
      end
    end
  end
end

tu noteras que le label est parent du tedit associé (l'équivalent du TlabelEdit de VCL ) peut être faut il faire l'inverse (c'est une piste) .
Note bis , il n'y a aucun code , pas de calculs de positionnement (du moins de ma part)
[fin edit]

Pour ce qui est des traductions (et j'en fait quelques unes depuis peu) le mieux , et qui reste encore le plus simple est souvent de changer la disposition des Labels (au dessus de la zone de saisie au lieu de à gauche, en tout cas c'est ce que préconise une démo de dxGettext, si je la retrouve , je mets le lien ) .