delphifiremonkeydelphi-xe5

Allowing keyboard input to a FireMonkey TEdit nested inside a FireMonkey TPopup


I'm struggling to get a FireMonkey TEdit nested inside a FireMonkey TPopup to receive keyboard input. Happens both for desktop and mobile projects, though it's the latter I'm interested in:

  1. Create a new FMX project.

  2. Add a TButton and a TPopup to the form, and a TEdit to the TPopup.

  3. Set the popup's Placement property to plCenter and its PlacementTarget to Button1.

  4. Handle the button's OnClick event by setting the popup's IsOpen property to True.

  5. Run the project, click/tap the button, and try to enter text in the edit control.

Any ideas? The correct answer may of course be: keyboard input isn't supported, but the documentation doesn't say either way.


Solution

  • Keyboard Input seems not to work on TPopup. An easy solution is to use a TForm as popup form:

    unit Popup;
    
    interface
    
    uses
      System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants,
      FMX.Types, FMX.Graphics, FMX.Controls, FMX.Forms, FMX.Dialogs, FMX.StdCtrls, FMX.Edit;
    
    type
      TfmPopup = class(TForm)
        Edit1: TEdit;
        Panel1: TPanel;
        procedure FormDeactivate(Sender: TObject);
        procedure FormKeyDown(Sender: TObject; var Key: Word; var KeyChar: Char; Shift: TShiftState);
      private
      protected
      public
      end;
    
    var
      fmPopup: TfmPopup;
    
    implementation
    
    {$R *.fmx}
    
    procedure TfmPopup.FormDeactivate(Sender: TObject);
    begin
      Close;
    end;
    
    procedure TfmPopup.FormKeyDown(Sender: TObject; var Key: Word; var KeyChar: Char; Shift: TShiftState);
    begin
      if Key = vkEscape then begin
        Close;
      end;
    end;
    
    end.
    

    The form resources:

    object fmPopup: TfmPopup
      Left = 0
      Top = 0
      BorderStyle = None
      Caption = 'Form1'
      ClientHeight = 94
      ClientWidth = 142
      FormFactor.Width = 320
      FormFactor.Height = 480
      FormFactor.Devices = [Desktop, iPhone, iPad]
      OnDeactivate = FormDeactivate
      OnKeyDown = FormKeyDown
      DesignerMobile = False
      DesignerWidth = 0
      DesignerHeight = 0
      DesignerDeviceName = ''
      DesignerOrientation = 0
      DesignerOSVersion = ''
      object Panel1: TPanel
        Align = Client
        Height = 94.000000000000000000
        Width = 142.000000000000000000
        TabOrder = 1
        object Edit1: TEdit
          Touch.InteractiveGestures = [LongTap, DoubleTap]
          TabOrder = 1
          Position.X = 20.000000000000000000
          Position.Y = 32.000000000000000000
          Width = 100.000000000000000000
          Height = 22.000000000000000000
        end
      end
    end
    

    Of course you can improve this simple example: Do not place the TEdit on this form but inherit this form and place the edit there. E.g.:

    TfmMyPopup = class(TfmPopup)
      Edit1: TEdit;
    private
    protected
    public
    end;
    

    Improve the base class of TfmPopup with some features like TPopup: E.g. placement. May you can use a never shown TPopup within TfmPopup to use the placement routines of the TPopup without rewriting this code.