Dao Posted June 11, 2021 Share Posted June 11, 2021 Hello! Is there any way to change the layout of a panel when the screen becomes smaller? I have a panel in my form whose layout is hbox. When my window size is 800px, I'd like the layout to set to vbox. I've tried something like: procedure TMainForm.UniFormScreenResize(Sender: TObject; AWidth, AHeight: Integer); begin if Awidth < 800 begin mypanel.layout := 'vbox'; //other layout adjustements end; end; But to no success. Do I have to do this with JS? If yes, how? I have also tried something like mypanel.jsInterface.jsAssign('layout', ['vbox']); //(also tried 'type' instead of 'layout') mypanel.jsInterface.jsCall('updateLayout, []); //also tried doLayout instead of updateLayout But it gives an error. Visually, I'm trying to achieve a layout like this: Thanks! Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 11, 2021 Share Posted June 11, 2021 Hello, Can you please specify, which edition and build of UniGUI are you using!? Quote Link to comment Share on other sites More sharing options...
Dao Posted June 11, 2021 Author Share Posted June 11, 2021 6 minutes ago, Sherzod said: Hello, Can you please specify, which edition and build of UniGUI are you using!? Sure: Professional edition, uni-1.90.0.1549 Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 11, 2021 Share Posted June 11, 2021 Please adjust your forum email address. Quote Link to comment Share on other sites More sharing options...
Dao Posted June 11, 2021 Author Share Posted June 11, 2021 44 minutes ago, Sherzod said: Please adjust your forum email address. It's done. Any ideas for my layout resizing issue? Thanks Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 11, 2021 Share Posted June 11, 2021 6 hours ago, Dao said: I have a panel in my form whose layout is hbox. When my window size is 800px, I'd like the layout to set to vbox. Hello, In your case, try this approach: procedure TMainForm.UniFormScreenResize(Sender: TObject; AWidth, AHeight: Integer); begin if AWidth < 800 then begin YourContainerPanel.JSInterface.JSCall('getLayout().setVertical', [True]); //vbox YourContainerPanel.JSInterface.JSCallDefer('updateLayout', [], 20); end else begin YourContainerPanel.JSInterface.JSCall('getLayout().setVertical', [False]); //hbox YourContainerPanel.JSInterface.JSCallDefer('updateLayout', [], 20); end; end; Quote Link to comment Share on other sites More sharing options...
Dao Posted June 11, 2021 Author Share Posted June 11, 2021 Thank you @Sherzod. Tried it, but I get an Ajax error when trying to implement your code: Also if I may ask: how do you know what JS action to call? I've been trying with JSAssign/JSCall, and I see that you've gone to another approach with JSCall/JSCallDefer. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 11, 2021 Share Posted June 11, 2021 12 minutes ago, Dao said: Tried it, but I get an Ajax error when trying to implement your code: Can you please make a simple testcase and attach here? Quote Link to comment Share on other sites More sharing options...
Dao Posted June 14, 2021 Author Share Posted June 14, 2021 Hi Sherzod. Don't what happened but the error doesn't pop up anymore. Thanks for your help! Is there any "official" doc regarding these kind of functions, like how do you build them? I see some examples here and there on the forums but I find myself unable to customize them because I can't find it documented anywhere... Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 14, 2021 Share Posted June 14, 2021 Hello, 34 minutes ago, Dao said: Don't what happened but the error doesn't pop up anymore. Okay. 34 minutes ago, Dao said: Is there any "official" doc regarding these kind of functions, like how do you build them? I see some examples here and there on the forums but I find myself unable to customize them because I can't find it documented anywhere... On our website, the documentation section. And also https://docs.sencha.com/extjs/7.0.0/ Thanks. Quote Link to comment Share on other sites More sharing options...
plawan001 Posted January 5, 2022 Share Posted January 5, 2022 Can it be done at present? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted January 5, 2022 Share Posted January 5, 2022 1 hour ago, plawan001 said: Can it be done at present? ? Quote Link to comment Share on other sites More sharing options...
plawan001 Posted January 12, 2022 Share Posted January 12, 2022 Hbox to Vbox when screen resize Quote Link to comment Share on other sites More sharing options...
Sherzod Posted January 12, 2022 Share Posted January 12, 2022 1 hour ago, plawan001 said: Hbox to Vbox when screen resize Have you tried the solution above? Quote Link to comment Share on other sites More sharing options...
plawan001 Posted January 14, 2022 Share Posted January 14, 2022 Tried it doesn't work Quote Link to comment Share on other sites More sharing options...
Sherzod Posted January 14, 2022 Share Posted January 14, 2022 7 minutes ago, plawan001 said: Tried it doesn't work Hello, Do you have a simple testcase to check? Quote Link to comment Share on other sites More sharing options...
plawan001 Posted January 14, 2022 Share Posted January 14, 2022 How to Press the button to change Layout hbox to vbox Test_Layout.zip Quote Link to comment Share on other sites More sharing options...
Sherzod Posted February 17, 2022 Share Posted February 17, 2022 On 1/14/2022 at 11:09 AM, plawan001 said: How to Press the button to change Layout hbox to vbox Test_Layout.zip 9.89 MB · 5 downloads On 1/12/2022 at 3:10 PM, Sherzod said: On 1/12/2022 at 1:56 PM, plawan001 said: Hbox to Vbox when screen resize Have you tried the solution above? You didn't use the code above. Try: procedure TMainForm.UniButton1Click(Sender: TObject); begin //UniContainerPanel1.Layout := 'vbox'; UniContainerPanel1.JSInterface.JSCall('getLayout().setVertical', [True]); //vbox UniContainerPanel1.JSInterface.JSCallDefer('updateLayout', [], 20); end; Quote Link to comment Share on other sites More sharing options...
plawan001 Posted February 25, 2022 Share Posted February 25, 2022 It works. Thank you very much. But when the screen size gets bigger again How to tune into Hbox? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted February 25, 2022 Share Posted February 25, 2022 1 minute ago, plawan001 said: But when the screen size gets bigger again How to tune into Hbox? On 6/11/2021 at 8:11 PM, Sherzod said: procedure TMainForm.UniFormScreenResize(Sender: TObject; AWidth, AHeight: Integer); begin if AWidth < 800 then begin YourContainerPanel.JSInterface.JSCall('getLayout().setVertical', [True]); //vbox YourContainerPanel.JSInterface.JSCallDefer('updateLayout', [], 20); end else begin YourContainerPanel.JSInterface.JSCall('getLayout().setVertical', [False]); //hbox YourContainerPanel.JSInterface.JSCallDefer('updateLayout', [], 20); end; end; 1 Quote Link to comment Share on other sites More sharing options...
plawan001 Posted February 25, 2022 Share Posted February 25, 2022 thank you very much. 1 Quote Link to comment Share on other sites More sharing options...
plawan001 Posted May 7, 2022 Share Posted May 7, 2022 I put Margin but it doesn't help, is there a way? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted May 7, 2022 Share Posted May 7, 2022 12 minutes ago, plawan001 said: I put Margin but it doesn't help, is there a way? Hello, Please explain in more detail. What's the issue? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.