Fonctionnement du TComboEdit

Bonjour,

Je suis sous Delphi Seattle /Win10.
Je dois utiliser les FMX dans mon projet.

Les ComboBox entre la VCL et les FMX ne fonctionnent pas pareil. Pour la VCL, nous pouvons ecrire dans la parti Edit tandis que les FMX nous autorisent seulement à ouvrir et sélectionner un élément dans la liste déroulante.

Il existe le TComboEdit qui ressemblerai plus au TComboBox(VCL) mais il n'a pas le même comportement.

Mon but est de pouvoir saisir un article dans le combo en mettant à jour la liste déroulante avec le texte saisi (Commence par) et de pouvoir choisir mon article dans la liste avec les touche de direction/Entrée. Je voudrais aussi faire de l’auto-complétion.

exemple. Je tape "A" , je mets à jour ma liste déroulante avec tous les articles qui commencent par un "A", j'ouvre la liste déroulante, je descend avec la fleche bas et je sélectionne en tapant "Entrée".
Dans le ComboEdit, le fait de faire "Entrée" n'affecte pas la valeur à la zone de saisie. L'itemIndex change uniquement sur le Clic d'un élément. Je ne trouve pas le moyen de savoir sur quel élément est la sélection par les flèches.

Avez vous une idée comment faire ?

Les LiveBindings devraient t'aider :

http://edn.embarcadero.com/article/41708

Bonjour,

un tutoriel sur ce sujet est prévu par votre serviteur, seulement il se trouve loin dans la série à peine débutée ;) le premier est publié, le second est en relecture, le troisième est bien avancé en écriture (je crois que je me suis surpassé pour celui là ;)) les Combos et autres Lookups n'arrivent que loin derrière.

Confronté aux LookupCombox lié à une table plutôt qu'aux ComboEdit j'ai plus pioché sur ce premier.
Pour ce qui est voulu je ne suis pas sûr mais je crois que je pencherai vers un mix TEdit(avec recherche)+TLisbox à moins que TMS m'offre une possibilité toute faite :koi:.

[Edit]
En y réfléchissant , voici une démarche qui devrait faire l'affaire
dans un TLayout poser

un TEdit (aligné Top) et lui rajouter deux éléments (via clic droit sur le TEdit) : un TSearchEditButton et un TDropDownEditButton voire même ajouter un TClearEditButton
un TList (aligné Client)

"YAPLUKA" :

gérer les boutons de recherche (pour limiter la liste)
gérer "l'ouverture/fermeture" de cette pseudo boite (le Layout) on peut même y ajouter du "mouvement" en rajoutant un TAnimation qui va gérer la hauteur du TLayout
gérer la touche <Enter> dans la liste

Le tout avec quelques livebindings (dépendant d'où vient le remplissage de cette "combobox") ça devrait le faire

N.B. Il va falloir que je garde cette solution pour mon futur Tuto ;)

Ca peut peut-être vous aider, pour un TEdit avec un autocomplete dans une liste déroulante, j'ai utilisé le composant TStyledAutocompleteEdit (fichier FMX.Edit.Autocomplete.pas) :
http://yaroslavbrovin.ru/new-approac...tocomplete-en/

C'est un peu comme ce que dit SergioMaster mais avec un TListBox dans un TPopup (faut que ça se ferme quand on clique ailleurs par exemple).

Il s'utilise en mettant PresenterName := 'AutocompleteEdit-style'; dans le OnPrestationNameChoosing du TEdit puis en lui donnant une liste : Edit1.Model.Data['suggestion_list'] := TValue.From<TArray<string>>(SuggestionList); où Suggestionlist est un TArray<string>

Il faut le modifier si vous voulez ajouter des choses lors d'une nouvelle saisie, mais ça peut être une base.

Je me le suis modifié pour ajouter notamment un TClearEditButton, que ça ne cherche pas que le début du mot mais n'importe où dans les mots, et aussi passer une fonction avec SetOnSelect pour avoir un callback, et des détails pour mon besoin, je vous copie le code si ça peut vous intéresser :

Code:

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
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
 
unit FMX.Edit.Autocomplete;
 
interface
 
uses
  FMX.Edit.Style, FMX.Controls.Presentation, FMX.Controls.Model, FMX.Presentation.Messages,
  FMX.Controls, FMX.ListBox, System.Classes, System.Types, FMX.Presentation.Style, FMX.Objects, FMX.Edit, FMX.Forms;
 
type
  TProc = procedure of object;
 
  TStyledAutocompleteEdit = class(TStyledEdit)
  private
    FSuggestions: TArray<string>;
    FPopup: TPopup;
    FListBox: TListBox;
    FDropDownCount: Integer;
    FItemIndex: Integer;
    FProc: TProc;
    FClearButton: TClearEditButton;
  protected
    procedure MMDataChanged(var AMessage: TDispatchMessageWithValue<TDataRecord>); message MM_DATA_CHANGED;
    procedure PMSetSize(var AMessage: TDispatchMessageWithValue<TSizeF>); message PM_SET_SIZE;
    procedure DoChangeTracking; override;
    procedure RebuildSuggestionList;
    procedure RecalculatePopupHeight;
    procedure KeyDown(var Key: Word; var KeyChar: Char; Shift: TShiftState); override;
    procedure ListBoxItemClick(const Sender: TCustomListBox; const Item: TListBoxItem);
    procedure DoExit; override;
  public
    constructor Create(AOwner: TComponent); override;
    destructor Destroy; override;
    function ItemIndex: Integer;
    procedure Select(const AText: string);
    procedure SetOnSelect(AProc: TProc);
  end;
 
  TStyledAutocompleteEditProxy = class(TStyledPresentationProxy<TStyledAutocompleteEdit>);
 
implementation
 
uses
  FMX.Presentation.Factory, FMX.Types, System.SysUtils, System.Math, System.UITypes, System.StrUtils,
  FMX.Dialogs;
 
{ TStyledAutocompleteEdit }
 
constructor TStyledAutocompleteEdit.Create(AOwner: TComponent);
begin
  inherited;
 
  FPopup := TPopup.Create(nil);
  FPopup.Parent := Self;
  FPopup.PlacementTarget := Self;
  FPopup.Placement := TPlacement.Bottom;
  FPopup.Width := Width;
 
  FListBox := TListBox.Create(nil);
  FListBox.Parent := FPopup;
  FListBox.Align := TAlignLayout.Client;
  FListBox.OnItemClick := ListBoxItemClick;
 
  FDropDownCount := 5;
  FItemIndex := -1;
  FProc := nil;
end;
 
destructor TStyledAutocompleteEdit.Destroy;
begin
  FPopup := nil;
  FListBox := nil;
  FClearButton := nil;
  inherited;
end;
 
procedure TStyledAutocompleteEdit.DoChangeTracking;
 
  function HasSuggestion: Boolean;
  var
    I: Integer;
  begin
    I := 0;
    Result := False;
    while not Result and (I < Length(FSuggestions)) do
    begin
      Result := ContainsText(FSuggestions[I], Model.Text);
      if not Result then
        Inc(I)
      else
        Exit(Result);
    end;
  end;
 
  function IndexOfSuggestion: Integer;
  var
    Found: Boolean;
    I: Integer;
  begin
    Found := False;
    I := 0;
    Result := -1;
    while not Found and (I < FListBox.Count) do
    begin
      Found := ContainsText(FListBox.Items[I], Model.Text);
      if not Found then
        Inc(I)
      else
        Exit(I);
    end;
  end;
 
begin
  inherited;
 
  FItemIndex := -1;
 
  if HasSuggestion then
  begin
    RebuildSuggestionList;
    RecalculatePopupHeight;
    Index := IndexOfSuggestion;
    if Model.Text.IsEmpty then
      FListBox.ItemIndex := -1
    else
      FListBox.ItemIndex := Index;
    FPopup.IsOpen := True;
  end
  else
    FPopup.IsOpen := False;
 
  if Model.Text = '' then
    FProc;
end;
 
procedure TStyledAutocompleteEdit.DoExit;
begin
  inherited;
 
  if (FItemIndex < 0) and (Text <> '') then
    Text := '';
end;
 
function TStyledAutocompleteEdit.ItemIndex: Integer;
begin
  Result := FItemIndex;
end;
 
procedure TStyledAutocompleteEdit.KeyDown(var Key: Word; var KeyChar: Char; Shift: TShiftState);
begin
  inherited;
  case Key of
    vkReturn:
      if FListBox.Selected <> nil then
      begin
        Model.Text := FListBox.Selected.Text;
        Edit.GoToTextBegin;
        FPopup.IsOpen := False;
      end;
    vkEscape:
      FPopup.IsOpen := False;
    vkDown:
      if FListBox.Selected <> nil then
        FListBox.ItemIndex := Min(FListBox.Count - 1, FListBox.ItemIndex + 1);
    vkUp:
      if FListBox.Selected <> nil then
        FListBox.ItemIndex := Max(0, FListBox.ItemIndex - 1);
  end;
end;
 
procedure TStyledAutocompleteEdit.ListBoxItemClick(const Sender: TCustomListBox; const Item: TListBoxItem);
var
  I: Integer;
  Word: string;
  bFound: Boolean;
begin
  Model.Text := Item.Text;
  Edit.GoToTextBegin;
  FPopup.IsOpen := False;
  bFound := False;
 
  I := -1;
  for Word in FSuggestions do
  begin
    Inc(I);
    if Model.Text = Word then
    begin
      bFound := True;
      Break;
    end;
  end;
 
  if bFound then
    FItemIndex := I
  else
    FItemIndex := -1;
 
  if Assigned(FProc) then
    FProc;
end;
 
procedure TStyledAutocompleteEdit.MMDataChanged(var AMessage: TDispatchMessageWithValue<TDataRecord>);
var
  Data: TDataRecord;
begin
  Data := AMessage.Value;
  if Data.Value.IsType < TArray<string>> and (Data.Key = 'suggestion_list') then
    FSuggestions := AMessage.Value.Value.AsType<TArray<string>>;
end;
 
procedure TStyledAutocompleteEdit.PMSetSize(var AMessage: TDispatchMessageWithValue<TSizeF>);
begin
  inherited;
  FPopup.Width := Width;
end;
 
procedure TStyledAutocompleteEdit.RebuildSuggestionList;
var
  Word: string;
begin
  FListBox.Clear;
  FListBox.BeginUpdate;
  try
    for Word in FSuggestions do
      if ContainsText(Word, Model.Text) then
        FListBox.Items.Add(Word);
  finally
    FListBox.EndUpdate;
  end;
end;
 
procedure TStyledAutocompleteEdit.RecalculatePopupHeight;
begin
  if FListBox.Items.Count > 0 then
  begin
    FPopup.Height := FListBox.ListItems[0].Height * Min(FDropDownCount, FListBox.Items.Count) + FListBox.BorderHeight;
    FPopup.PopupFormSize := TSizeF.Create(FPopup.Width, FPopup.Height);
  end;
end;
 
procedure TStyledAutocompleteEdit.Select(const AText: string);
var
  Word: string;
  I: Integer;
  bFound: Boolean;
begin
  I := -1;
 
  bFound := False;
  for Word in FSuggestions do
  begin
    Inc(I);
    if Word = AText then
    begin
      Text := AText;
      FPopup.IsOpen := False;
      bFound := True;
      Break;
    end;
  end;
 
  if bFound then
    FItemIndex := I
  else
  begin
    FItemIndex := -1;
    Text := '';
  end;
 
  if Assigned(FProc) then
     FProc;
end;
 
procedure TStyledAutocompleteEdit.SetOnSelect(AProc: TProc);
begin
  FProc := AProc;
end;
 
initialization
  TPresentationProxyFactory.Current.Register('AutocompleteEdit-style', TStyledAutocompleteEditProxy);
finalization
  TPresentationProxyFactory.Current.Unregister('AutocompleteEdit-style', TStyledAutocompleteEditProxy);
end.

J'ai utilisé cette technique dans un projet IOS mais je n'avais pas fait de composant réutilisable.
Merci pour ce partage de code

Merci Sergio et Coudrak.

Comme me l'a suggéré Sergio, j'ai utilisé un composant TMS. TMSFMXEdit qui a une propriété Lookup avec une liste DisplayList que je peux remplir à chaque caractère saisi. Il y a une propriété AutoComplète. On peut choisir à partir de combien de caractères saisis on recherche dans la liste. Il fonctionne à peu prêt bien (problème de taille de la liste déroulante lorsqu'on supprime le dernier caractère saisi)

Mon but est d'afficher la liste d'une colonne venant d'une table sur un serveur Datasnap. J'attends donc avec impatience le tuto d'un dbLookupComboBox en lien avec du Datasnap.

J'ai d'autres problèmes dû à l'utilisation de Parnassus mais j'ouvre un autre ticket.