Change caption Label.

[picyka]

procedure TMainForm.lbAtualizarDashBoardClick(Sender: TObject);
begin
  var lIconOld := Self.lbAtualizarDashBoard.Caption;
  try
    Self.lbAtualizarDashBoard.Caption := '<i class="fas fa-sync fa-spin"></i>';
    Self.LoadGraficos(Self.cbMesDadosGrafico.Text);
  finally
    Self.lbAtualizarDashBoard.Caption := lIconOld;
  end;
end;

Good morning, I hope everyone is well. How to click on a label, change its caption to an animation,

then go back to the original caption ?

 

Grateful.

[Sherzod]

Hello,

Could you please explain in more detail? 

[picyka]

Dois minutos atrás, Sherzod disse:

Olá

Poderia explicar com mais detalhes?

I have a label, when I click on it, I want to trigger a process, changing its caption to an

animated font Self.lbUpdateDashBoard.Caption := '<i class="fas fas-sync fa-spin"></i>';

 

after finishing the process, go back to the original source

[Sherzod]

UniLabel ?

[picyka]

4 minutes ago, Sherzod said:

A UniLabel?

yes

[Sherzod]

1 hour ago, picyka said:

yes

You need to do this on Click event ("on the client side").

[picyka]

1 minuto atrás, Sherzod disse:

Você precisa fazer isso no evento Click ("no lado do cliente").

procedure TMainForm.lbAtualizarDashBoardClick(Sender: TObject);
begin
  var lIconOld := Self.lbAtualizarDashBoard.Caption;
  try
    Self.lbAtualizarDashBoard.Caption := '<i class="fas fa-sync fa-spin"></i>';
    Self.lbAtualizarDashBoard.JSInterface.JSCode('MainForm.lbAtualizarDashBoard.setHtml('''+Self.lbAtualizarDashBoard.Caption+''');');
    Self.LoadGraficos(Self.cbMesDadosGrafico.Text);
  finally
    Self.lbAtualizarDashBoard.Caption := lIconOld;
    Self.lbAtualizarDashBoard.JSInterface.JSCode('MainForm.lbAtualizarDashBoard.setHtml('''+Self.lbAtualizarDashBoard.Caption+''');');
  end;
end;

I tried something like this but it didn't work

[Sherzod]

26 minutes ago, picyka said:

I tried something like this but it didn't work

You can take the approach from here:

 

[picyka]

41 minutos atrás, Sherzod disse:

Você pode fazer a abordagem daqui:

 

{ TUniLabelHelper }

procedure TUniLabelHelper.ConfigureIcon(Icon: String);
begin
  Self.ClientEvents.UniEvents.Values['ajaxCallback'] := 'function ajaxCallback(sender, response) { try {sender.setDisabled(false)} catch(err){}; }';

  with Self.JSInterface do
  begin
    JSConfig('_text', [Self.Caption]);
    JSConfig('_iconCls', [Icon]);
    JSAddListener('disable', 'function(){this.setHtml(''<i class="fas fa-sync fa-spin"></i>'')}');
    JSAddListener('enable', 'function(){this.setHtml(this.getConfig("_iconCls")); this.setHtml(this.getConfig("_text"))}');
    JSAddListener('click', 'function(){this.setDisabled(true);}');
  end;
end;

Self.lbAtualizarDashBoard.ConfigureIcon('<i class="fas fa-chart-line"></i>');

My fault, I had forgotten about this routine

[Sherzod]

1 hour ago, picyka said:

I tried something like this but it didn't work

procedure TMainForm.UniFormCreate(Sender: TObject);
begin
  with UniLabel1 do
  begin
    TextConversion := txtHTML;
    CustomAttribs.Values['originalCaption'] := Caption;
    JSInterface.JSAddListener('click', 'function(){this.setHtml("<i class=\"fas fa-sync fa-spin\"></i>"); this.setDisabled(true)}');
  end;
end;

procedure TMainForm.UniLabel1Click(Sender: TObject);
begin
  Sleep(5000);

  with (Sender as TUniLabel) do
  begin
    JSInterface.JSCall('setHtml', [CustomAttribs.Values['originalCaption']]);
    JSInterface.JSCall('setDisabled', [False]); //try finally
  end;

end;

 

[picyka]

Dois minutos atrás, Sherzod disse:

procedure TMainForm.UniFormCreate(Sender: TObject);
begin
  with UniLabel1 do
  begin
    TextConversion := txtHTML;
    CustomAttribs.Values['originalCaption'] := Caption;
    JSInterface.JSAddListener('click', 'function(){this.setHtml("<i class=\"fas fa-sync fa-spin\"></i>"); this.setDisabled(true)}');
  end;
end;

procedure TMainForm.UniLabel1Click(Sender: TObject);
begin
  Sleep(5000);

  with (Sender as TUniLabel) do
  begin
    JSInterface.JSCall('setHtml', [CustomAttribs.Values['originalCaption']]);
    JSInterface.JSCall('setDisabled', [False]); //try finally
  end;

end;

 

Cool, we already have two usage options. Thank you master.