How to customize Ext.toast

[donlego]

6 minutes ago, Sherzod said:

Excuse me, what should it look like?

the align:br = bottom right

i want the toast message position / align is right center like this

[Sherzod]

Possible values:

• br - bottom-right
• bl - bottom-left
• tr - top-right
• tl - top-left
• t - top
• l - left
• b - bottom
• r - right

[donlego]

1 minute ago, Sherzod said:

Possible values:

• br - bottom-right
• bl - bottom-left
• tr - top-right
• tl - top-left
• t - top
• l - left
• b - bottom
• r - right

yes , i try with align:r

but the toast is not show 

nothing error in console tab

i use unigui ver 1541 , extjs 7.0.0,

 

[Sherzod]

I will try to check. 

[donlego]

11 minutes ago, Sherzod said:

I will try to check. 

ok, 

i was try with css 

.x-toast{
   top:160px !important;    
   }

but if there is >= 2 toast message , it's cover previous toast message

 

[Sherzod]

29 minutes ago, donlego said:

but if there is >= 2 toast message , it's cover previous toast message

Well, what do you expect?

[donlego]

6 minutes ago, Sherzod said:

Well, what do you expect?

the same as usual, only the first time it appears, in the center right, and then as usual, it doesn't cover the previous message

[Sherzod]

4 minutes ago, donlego said:

it doesn't cover the previous message

Well, I already understood that.

But the question is, should new messages appear at the top or at the bottom the previous one?

[donlego]

12 minutes ago, Sherzod said:

Well, I already understood that.

But the question is, should new messages appear at the top or at the bottom the previous one?

on top previous

[Sherzod]

I can’t say a specific solution at the moment, need to analyze it in the Ext.window.Toast class itself.

[donlego]

19 minutes ago, Sherzod said:

I can’t say a specific solution at the moment, need to analyze it in the Ext.window.Toast class itself.

ok, thanks in advance

[Sherzod]

3 hours ago, donlego said:

thanks in advance

I'm sorry, but I won't be looking into this anytime soon.

[Marlon Nardi]

@donlego If you are interested you can take a look at this UniFSToast component, elegant, simple and flexible.

https://demos.falconsistemas.com.br/?tela=tfrmtoast

https://store.falconsistemas.com.br 

[Sherzod]

16 hours ago, Sherzod said:

I'm sorry, but I won't be looking into this anytime soon.

 

22 hours ago, donlego said:

... on top previous

Although I seem to have found a solution.

 

[Sherzod]

procedure TMainForm.UniButton1Click(Sender: TObject);
var
  acol,
  apesan,
  amsg: string;
  genMsgID: string;
begin

  amsg := 'Hello';
  acol:='#3D7A00';
  genMsgID := FormatDateTime('yyyymmddhhnnsszzz', Now());

  apesan := apesan+'<table style=margin-top:-18px ><td><i class=\"fa fa-info\" aria-hidden=\"true\">   </i>     &nbsp;&nbsp;&nbsp; </td>&nbsp;&nbsp;<td>'+amsg +'</td></table><span style=\"float:right;margin-top:-18px\"><i  onclick=\"window._msg'+ genMsgID +'.destroy(); window._msg'+genMsgID+'=null; \"   class=\"fa fa-times\" aria-hidden=\"true\"></i></span>';

  UniSession.AddJS('window._msg'+ genMsgID +' = Ext.toast ({html: "<font color=white style=font-size:15px;font-family:segoe ui;>' + apesan +
   '</font>", align: "tr" , header: false, width:400, autoCloseDelay: 150000, hideDuration: 150000, modal: false, bodyStyle:{"background-color":"'+acol+' !important;box-shadow:'+acol+' !important; border-color: 0px solid transparent;padding:0px 0px 0px 0px !important;top:180px !important"}'
   +',listeners: {show: function(){this.paddingY = Ext.getBody().getHeight()/2 - this.getHeight()/2}}'
   +'});'
   );

end;

 

[donlego]

50 minutes ago, Sherzod said:

procedure TMainForm.UniButton1Click(Sender: TObject);
var
  acol,
  apesan,
  amsg: string;
  genMsgID: string;
begin

  amsg := 'Hello';
  acol:='#3D7A00';
  genMsgID := FormatDateTime('yyyymmddhhnnsszzz', Now());

  apesan := apesan+'<table style=margin-top:-18px ><td><i class=\"fa fa-info\" aria-hidden=\"true\">   </i>     &nbsp;&nbsp;&nbsp; </td>&nbsp;&nbsp;<td>'+amsg +'</td></table><span style=\"float:right;margin-top:-18px\"><i  onclick=\"window._msg'+ genMsgID +'.destroy(); window._msg'+genMsgID+'=null; \"   class=\"fa fa-times\" aria-hidden=\"true\"></i></span>';

  UniSession.AddJS('window._msg'+ genMsgID +' = Ext.toast ({html: "<font color=white style=font-size:15px;font-family:segoe ui;>' + apesan +
   '</font>", align: "tr" , header: false, width:400, autoCloseDelay: 150000, hideDuration: 150000, modal: false, bodyStyle:{"background-color":"'+acol+' !important;box-shadow:'+acol+' !important; border-color: 0px solid transparent;padding:0px 0px 0px 0px !important;top:180px !important"}'
   +',listeners: {show: function(){this.paddingY = Ext.getBody().getHeight()/2 - this.getHeight()/2}}'
   +'});'
   );

end;

 

 it's work perfectly , thanks you very much @Sherzod