Problem with landscape screen orientation in LAMW lazarus / 43-Android ---------------------------------------------------------------------- maurobio · 2023-06-20 20:36 Dear ALL, My app is showing fine in portrait (vertical) orientation, however when I rotate the device to the horizontal (landscape), it is not adjusting to the screen is would be expected - the screen is clipped and not show entirely (see the attached screenshots). I tried using the code below: Code: Pascal  [Select][+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i procedure TAndroidModule1.AndroidModule1Rotate(Sender: TObject;  rotate: TScreenStyle);begin  UpdateLayout;end; but to no avail. What is the trick to get the screen properly adjusted in landscape orientation? Thanks in advance! With best regards, ---------------------------------------------------------------------- Mongkey · 2023-06-21 01:29 just make another procedure or similar then just call, procedure detect_rotation () begin text.Anchor:=...; text.relativewidth:= ...; text.relativeHeight:= ...; updatelayout end; ---------------------------------------------------------------------- maurobio · 2023-06-21 01:37 Hi, @Mongkey! Thanks for your reply... but (there is always a but) I am afraid I didn't understand it.  Where should this new procedure be called? In the OnRotate() method? And what should be the values of the attributes indicated by ...? Could you provide an example? Thank you! With warmest regards, ---------------------------------------------------------------------- Mongkey · 2023-06-21 07:43 Onrotate -> check is it on landscape or portrait one -> if it onlandscape -> true then calll your custom layout procedure. ---------------------------------------------------------------------- maurobio · 2023-06-21 12:28 Hi, @Mongkey! Do you mean something like that: Code: Pascal  [Select][+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i procedure Tf_main.f_mainRotate(Sender: TObject; rotate: TScreenStyle);begin  //---Rensponsiveness events  if rotate = ssPortrait then // berdiri  begin    rotation := 'berdiri';    rotasi(rotation);    jImageView1.LayoutParamWidth := lpOneSixthOfParent;    jImageView1.LayoutParamHeight := lpOneQuarterOfParent;    dashboardText.FontSize := 40;    jsRecyclerView1.MarginTop := -50;    jsRecyclerView2.MarginTop := -50;  end;  if rotate = ssLandscape then // tidur  begin    rotation := 'tidur';    rotasi(rotation);    jImageView1.LayoutParamWidth := lpOneEighthOfParent;    jImageView1.LayoutParamHeight := lptwoThirdOfParent;    dashboardText.FontSize := 20;    jsRecyclerView1.MarginTop := -20;    jsRecyclerView2.MarginTop := -20;  end;end;  (Show me your code and I will move the world!  ) But in a form with many components, this is hell....  With best regards, ---------------------------------------------------------------------- Insid3Code · 2023-06-22 00:32 It better to use "jScrollView" See demo animated gif: https://forum.lazarus.freepascal.org/index.php/topic,63732.msg483327.h tml#msg483327 ---------------------------------------------------------------------- maurobio · 2023-06-22 00:41 Hi, Inside3Code! Great! I suspected that there should be a nice way of doing it without playing (ie., messing!) with the positional parameters of the form. Again, thank you very much! With warmest regards, ---------------------------------------------------------------------- jmpessoa · 2023-06-22 16:53 QuoteBut in a form with many components, this is hell.... maybe, the demo  "AppPanelRotateDemo1"  can help you.... ---------------------------------------------------------------------- maurobio · 2023-06-22 19:00 Hi, @jmpessoa! Quotemaybe, the demo  "AppPanelRotateDemo1"  can help you.... It can't. This demo offers the same kind of "solution" I disliked in the fragment of code by Mongkey above. It involves playing - or better, messing - with the confuse parameters of position, which would make using it in a form with many fields a torment from hell! The solution suggested by Inside3Code using a JScrollVew seems to be more promising. Best regards, ---------------------------------------------------------------------- maurobio · 2023-06-22 20:43 Hi, @Inside3Code! Unfortunately, I could not reproduce your example with jScrollVew, neither use it in my app. Putting a jScrollView on the form results in a blank screen when the app is run. See attached screenshots. Any hints? With best regards, ---------------------------------------------------------------------- Insid3Code · 2023-06-23 16:34 Can you attach your project ? ---------------------------------------------------------------------- maurobio · 2023-06-24 12:22 Hi, @Insid3Code! QuoteCan you attach your project ? But of course! Here they go. Thanks a lot for your most insightful help! With warmest regards, ---------------------------------------------------------------------- Insid3Code · 2023-06-24 15:54 Ok, I managed to fix your code... It seems that you added the component "jScrollView" directly  "Copied from another form or added into "lfm" source" without using the components palette... To fix your project: - main.pas : add "ScrollView1:jScrollView;" Code: Pascal  [Select][+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i     ...      ...        B1Label: jTextView;    bLabel: jTextView;    D1Label: jTextView;    dLabel: jTextView;    hLabel: jTextView;    lLabel: jTextView;    rLabel: jTextView;    AreaLabel: jTextView;    AreaValueLabel: jTextView;    Separator5: jTextView;    Separator4: jTextView;    Separator2: jTextView;    Separator1: jTextView;    ScrollView1:jScrollView;                                          <---- HERE    procedure AboutBtnClick(Sender: TObject);    procedure CalcBtnClick(Sender: TObject);          ...        ...        ... - controls.lpi: add "jScrollView" at the end Code: Pascal  [Select][+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i                                                               <---- HERE at the END         See animated gif working demo: https://i.imgur.com/SvrriFW.gif ---------------------------------------------------------------------- maurobio · 2023-06-24 16:04 Hi, @Insid3Code, You previously sent me just a. dfm file. Eager to see how the thing worked, I indeed just copied the ScrollView to my own .dfm but in fact I neglected to update the other files! Thanks a lot! With warmest regards,