Discussion :

[Anselme45]

Bonjour à tous,

J'ai des TEdit dans une App Android développée avec Delphi Rio.

Avec un clavier virtuel qui couvre presque 50% de la zone d'affichage, des TEdit se retrouvent cachés sous le clavier virtuel quand on veut y saisir des données.

Selon un webinaire de pprem, il semble qu'il n'y ait pas d'autre solution que l'usine à gaz consistant à "bricoler" avec du code le déplacement dynamique du TEdit caché vers une zone non couverte par le clavier virtuel quand on veut y saisir des données.

Est-ce que quelqu'un à connaissance d'une autre approche?

Merci d'avance

[Anselme45]

Bonjour,

J'ai découvert sur mon smartphone de test (un samsung) que je peux changer le mode d'affichage du clavier et le mettre en mode "clavier flottant". Cela résout le problème puisque l'on peut déplacer le clavier pour qu'il ne couvre plus le champs de saisie.

3 questions se posent:

1. Est-ce que cette possibilité existe sur tous les smartphones Android et/ou sur toutes les versions de l'OS Android?

2. Question 1 pour les smartphones iOS

3. Est-il possible de forcer ce mode "clavier flottant" via programmation?

Merci pour vos avis

[Paul TOTH]

j'ai fait ça il y a longtemps...

le premier point c'est de ne pas permettre aux composants de se trouver sous le clavier

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
procedure TMain.FormVirtualKeyboardShown(Sender: TObject;
  KeyboardVisible: Boolean; const Bounds: TRect);
begin
  Padding.Bottom := Bounds.Height;
end;
 
procedure TMain.FormVirtualKeyboardHidden(Sender: TObject;
  KeyboardVisible: Boolean; const Bounds: TRect);
begin
  Padding.Bottom := 0;
end;

ensuite je place mes composants dans un TVertScrollBox et je fixe la position de celle-ci de telle sorte que le composant soit au dessus du clavier

voici un code plus ou moins générique que j'utilise dans une application, c'est un peu vieux je ne me souviens plus de tous les détails

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
 
procedure TMain.FormVirtualKeyboardShown(Sender: TObject;
  KeyboardVisible: Boolean; const Bounds: TRect);
var
  Obj: TFmxObject;
  Ctl: TControl;
  DY : Single;
  SB : TCustomScrollBox;
  DH : Single;
begin
  Padding.Bottom := Bounds.Height;
  if Focused = nil then
    Exit;
// on prend l'objet qui a le focus pour le rendre visible
  Obj := Focused.GetObject;
  if (Obj is TControl) then
  begin
    Ctl := TControl(Obj);
    Obj := Ctl.Parent;
// position du composant
    DY := Ctl.Position.Y;
// support des empilements de composants avant d'atteindre la ScrollBox
    while not (Obj is FMX.Layouts.TScrollContent) do
    begin
   // on arrive sur la fiche, il n'y a donc pas de scrollbox
      if not (Obj is TControl) then  // under FMX TForm is not a TControl !
        Exit;
   // position relative au parent
      DY := DY + TControl(Obj).Position.Y;
      Obj := Obj.Parent;
    end;
// finalement on a trouvé la scrollbox
    SB := FMX.Layouts.TScrollContent(Obj).ScrollBox;
// nouvelle position
    DY := SB.ViewportPosition.Y - (DY - 25);
// ça je ne sais plus à quoi ça sert :D
    if (DY < 0) then
    begin
      DH := 25 + 42 - SB.Size.Height;
      if (DY > DH) then
      begin
        DY := 0;
      end else begin
        DY := DY - DH;
      end;
    end;
// et hop !
    SB.ScrollBy(0, DY);
  end;
end;

[Anselme45]

ensuite je place mes composants dans un TVertScrollBox et je fixe la position de celle-ci de telle sorte que le composant soit au dessus du clavier
...
voici un code plus ou moins générique que j'utilise dans une application, c'est un peu vieux je ne me souviens plus de tous les détails

Merci Paul pour ton exemple de code.

J'ai testé et cela fonctionne mais le problème est que l'on se retrouve à avoir la moitié inférieure de l'écran qui est occupé par le clavier virtuel et le TVertScrollBox sur la moitié supérieure de l'écran. Donc au final, on a qu'un demi-écran disponible pour afficher l'ensemble des champs de saisie avec certains qui ne sont pas visibles à l'affichage de la form (car dans la zone non-visible du TVertScrollBox).

Par contre, si à l'affichage de la form, on donne le focus à un champ de saisie localisé initialement dans la zone non-visible du TVertScrollBox, l'application pointe sur le champ de saisie à l'ouverture du clavier virtuel et on peut visualiser ce que l'on tape au clavier virtuel.

Par contre, ta partie "le premier point c'est de ne pas permettre aux composants de se trouver sous le clavier" ne semble pas fonctionner (à moins que je ne comprenne pas ce que tu voulais dire).

[Paul TOTH]

Merci Paul pour ton exemple de code.

J'ai testé et cela fonctionne mais le problème est que l'on se retrouve à avoir la moitié inférieure de l'écran qui est occupé par le clavier virtuel et le TVertScrollBox sur la moitié supérieure de l'écran. Donc au final, on a qu'un demi-écran disponible pour afficher l'ensemble des champs de saisie avec certains qui ne sont pas visibles à l'affichage de la form (car dans la zone non-visible du TVertScrollBox).

euh...ben oui, c'est le principe même des applications Android non ? tu voudrais le mettre où ton clavier ? à côté de l'écran ?

Par contre, si à l'affichage de la form, on donne le focus à un champ de saisie localisé initialement dans la zone non-visible du TVertScrollBox, l'application pointe sur le champ de saisie à l'ouverture du clavier virtuel et on peut visualiser ce que l'on tape au clavier virtuel.

c'est le but

Par contre, ta partie "le premier point c'est de ne pas permettre aux composants de se trouver sous le clavier" ne semble pas fonctionner (à moins que je ne comprenne pas ce que tu voulais dire).

ben si c'est ce dont tu parles en premier point ci-dessus

[Anselme45]

euh...ben oui, c'est le principe même des applications Android non ? tu voudrais le mettre où ton clavier ? à côté de l'écran ?

Mon but aurait été d'avoir mon champs de saisie n'importe où sur l'écran et d'afficher le clavier virtuel à un endroit de l'écran où il n'empêche pas de voir le champ de saisie.

Si j'utilise le clavier virtuel en mode standard, il s'affiche toujours au même endroit (la moitié inférieure de l'écran) et il semble qu'il ne soit pas possible de le position ailleurs via programmation.


Autre solution: Sur mon smartphone samsung de test, le clavier virtuel offre une option permettant de l'afficher en "mode flottant" et là j'obtiens ce que je veux: Le clavier est plus petit et je peux le glisser n'importe où sur l'écran. Par contre, je ne sais pas si ce "mode flottant" existe sur tous les modèles de smartphone et je ne sais pas s'il est possible de mettre le clavier virtuel en mode flottant via programmation.

[Paul TOTH]

Mon but aurait été d'avoir mon champs de saisie n'importe où sur l'écran et d'afficher le clavier virtuel à un endroit de l'écran où il n'empêche pas de voir le champ de saisie.

Si j'utilise le clavier virtuel en mode standard, il s'affiche toujours au même endroit (la moitié inférieure de l'écran) et il semble qu'il ne soit pas possible de le position ailleurs via programmation.


Autre solution: Sur mon smartphone samsung de test, le clavier virtuel offre une option permettant de l'afficher en "mode flottant" et là j'obtiens ce que je veux: Le clavier est plus petit et je peux le glisser n'importe où sur l'écran. Par contre, je ne sais pas si ce "mode flottant" existe sur tous les modèles de smartphone et je ne sais pas s'il est possible de mettre le clavier virtuel en mode flottant via programmation.

la gestion du clavier samsung est propriétaire, et tu as toutes les chances de ne pas pouvoir faire la même chose sur une autre marque, voir sur un modèle Samsung d'entrée de gamme.

la seule autre alternative est de créer ton propre clavier, mais tu pers toutes les fonctionnalités d'assistance à la saisie, copier/coller etc...

sur mon S8 dans toutes les applications, le clavier vient prendre le bas de l'écran...si j'active le clavier flottant, il vient juste se superposer à l'écran, et je trouve ça peu pratique car il cache la zone de saisie.

[Anselme45]

la gestion du clavier samsung est propriétaire, et tu as toutes les chances de ne pas pouvoir faire la même chose sur une autre marque, voir sur un modèle Samsung d'entrée de gamme.

Tu as raison pour le "clavier flottant", j'ai passé en revue tous les appareils Android qui passaient à porter de main: L'option "clavier flottant" n'est même pas disponible sur l'ensemble des appareils de Samsung!

Donc solution à oublier!

[Anselme45]

la seule autre alternative est de créer ton propre clavier, mais tu pers toutes les fonctionnalités d'assistance à la saisie, copier/coller etc...

Je pense à une autre solution:

Quand le TEdit reçoit le focus, tu empêches l'ouverture du clavier virtuel et tu affiches une "fenêtre" de saisie dédiée dans une nouvelle form ou un nouveau TabItem avec un TEdit placé dans la zone supérieure de l'écran, en dehors de la zone d'affichage du clavier virtuel. On saisit dans cette "fenêtre" les données à l'aide du clavier virtuel officiel puis ferme cette "fenêtre" de saisie en transmettant les données saisies dans le TEdit d'origine.

[Paul TOTH]

Je pense à une autre solution:

Quand le TEdit reçoit le focus, tu empêches l'ouverture du clavier virtuel et tu affiches une "fenêtre" de saisie dédiée dans une nouvelle form ou un nouveau TabItem avec un TEdit placé dans la zone supérieure de l'écran, en dehors de la zone d'affichage du clavier virtuel. On saisit dans cette "fenêtre" les données à l'aide du clavier virtuel officiel puis ferme cette "fenêtre" de saisie en transmettant les données saisies dans le TEdit d'origine.

dans ce cas le premier TEdit n'est pas un TEdit mais un label avec un OnClick...et en tant qu'utilisateur je me dirais que voilà encore un informaticien qui a cru bon réinventer le fils à couper le beurre...