Show form after all elements are aligned

[cyracks]

Hello,

what is the proper way to show form after all elements on the form are aligned. I do not want for user to see how elements of the form jump up/down left right when form is first shown. Ideally would be that mask is shown until all elements are aligned and only then user can interact with a form.

Regards

[cyracks]

One way to do it is:
1) make most bottom component/s invisible (for example PanelMain), so that required(all) components are hidden, when form is shown
2) Add timer and set interval to something small, for example 50
3) On event FormShow activate timer
4) OnTimer set bottom (PanelMain) component visible - components are aligned when form is shown even if they are invisible.

[mikromundo]

@cyracks

Is that what you're talking about?

 

[Abaksoft]

On 8/13/2021 at 12:26 AM, cyracks said:

Hello,

what is the proper way to show form after all elements on the form are aligned. I do not want for user to see how elements of the form jump up/down left right when form is first shown. Ideally would be that mask is shown until all elements are aligned and only then user can interact with a form.

Regards

 

Did you try : SuspendLayouts

http://forums.unigui.com/index.php?/topic/5715-performance-when-creating-controls-dynamically/&do=findComment&comment=81823

 

See doc :

http://www.unigui.com/doc/online_help/creating--destroying-many-cont.htm

[Sherzod]

On 8/14/2021 at 12:45 AM, cyracks said:

One way to do it is:
1) make most bottom component/s invisible (for example PanelMain), so that required(all) components are hidden, when form is shown
2) Add timer and set interval to something small, for example 50
3) On event FormShow activate timer
4) OnTimer set bottom (PanelMain) component visible - components are aligned when form is shown even if they are invisible.

Another trick:

1. MainForm -> ClientEvents -> UniEvents -> Ext.container.Viewport[viewport] ->

function viewport.beforeInit(sender, config)
{
    config.style='opacity: 0';
}

2. MainForm -> OnReady event ->

procedure TMainForm.UniFormReady(Sender: TObject);
begin
  UniSession.AddJS('Ext.defer(function(){'+ Self.Name +'.viewport.animate({to: {opacity: 1}, duration:1000})}, 1000)');
end;

 

[cyracks]

3 hours ago, Sherzod said:

Another trick:

1. MainForm -> ClientEvents -> UniEvents -> Ext.container.Viewport[viewport] ->

function viewport.beforeInit(sender, config)
{
    config.style='opacity: 0';
}

2. MainForm -> OnReady event ->

procedure TMainForm.UniFormReady(Sender: TObject);
begin
  UniSession.AddJS('Ext.defer(function(){'+ Self.Name +'.viewport.animate({to: {opacity: 1}, duration:1000})}, 1000)');
end;

 

Good option, do you maybe know how to add this globally so it applies to all forms ?