PDA

Ver la Versión Completa : Material Design TextFields con Firemonkey


el-mono
06-07-2018, 01:13:03
Hola Gente les comparto un poco de código que descubrí en https://www.youtube.com/watch?v=6J9qKvPfbiI



Lo que hace este codigo es que en nuestras aplicaciones Firemonkey nuestros TEdit se comporten como dicta Material Design.


Dejo adjunto mi codigo para que jueguen un poco.


unit Unit7;

interface

uses
System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants,
FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs,
FMX.Controls.Presentation, FMX.Edit, FMX.StdCtrls;

type THelperObject = Class Helper for TFMXObject
Public
procedure Caption(Desc: String);
End;



type
TForm7 = class(TForm)
Edit1: TEdit;
StyleBook1: TStyleBook;
Edit2: TEdit;
Edit3: TEdit;
Edit4: TEdit;
procedure FormCreate(Sender: TObject);
procedure Edit1Enter(Sender: TObject);
procedure Edit1Exit(Sender: TObject);
private
{ Private declarations }
public
{ Public declarations }
end;

var
Form7: TForm7;

implementation

{$R *.fmx}

{ THelperObject }

procedure THelperObject.Caption(Desc: String);
var
lbl :Tlabel;
begin
lbl := TLabel.create(Self);
lbl.Text := desc;
lbl.Name := 'Label'+ self.Name;
lbl.StyledSettings := [TstyledSetting.Family];
lbl.Position.X := 3;
lbl.Position.Y := 0;
lbl.TextSettings.Font.Size := 18;
lbl.TextSettings.FontColor := Talphacolors.Darkgrey;
lbl.Parent := self;

end;

procedure TForm7.Edit1Enter(Sender: TObject);
var
runlbl: Tlabel;
begin
if (Sender as TEdit).text = '' then
begin
runlbl := Tlabel((Sender as TEdit).FindComponent('Label' + (Sender as TEdit).Name ));
runlbl.AnimateFloat('Font.Size',9,0.1, TAnimationtype.InOut,tinterpolationType.Linear);
runlbl.AnimateFloat('Position.y',-16,0.1, TanimationType.InOut, TInterpolationType.Linear );
runlbl.FontColor := TAlphacolors.Blue;
end;

end;

procedure TForm7.Edit1Exit(Sender: TObject);
var
runlbl: Tlabel;
begin
if (Sender as TEdit).text = '' then
begin
runlbl := Tlabel((Sender as TEdit).FindComponent('Label' + (Sender as TEdit).Name ));
runlbl.AnimateFloat('Font.Size',14,0.1, TAnimationtype.InOut,tinterpolationType.Linear);
runlbl.AnimateFloat('Position.y',3,0.1, TanimationType.InOut, TInterpolationType.Linear );
runlbl.FontColor := TAlphacolors.Black;
end;


end;

procedure TForm7.FormCreate(Sender: TObject);
begin
Edit1.Caption('Nombre');
Edit2.Caption('Domicilio');
Edit3.Caption('Telefono');
Edit4.Caption('Email');

end;

end.




Lo que buscamos conseguir:

https://material.io/design/components/text-fields.html#

ElKurgan
06-07-2018, 07:33:00
Gracias por el aporte

Saludos