Philip Chatzigeorgiadis Active Member Licensed User Longtime User Dec 6, 2019 #1 The image below shows the FlexWall from ABMateril's demo here: http://prd.one-two.com:51042/demo/HelperFlexWallPage/abmaterial-flexwall.html When I copy-paste the code from the demo into my app (and also copy-paste the folder of the images used in the flexwall into my app folder), I get the result shown below: What should I change to get the FlexWall picture layout of the demo?
The image below shows the FlexWall from ABMateril's demo here: http://prd.one-two.com:51042/demo/HelperFlexWallPage/abmaterial-flexwall.html When I copy-paste the code from the demo into my app (and also copy-paste the folder of the images used in the flexwall into my app folder), I get the result shown below: What should I change to get the FlexWall picture layout of the demo?
Harris Expert Licensed User Longtime User Dec 7, 2019 #2 Looks like a tablet view - responsive... Upvote 0
Philip Chatzigeorgiadis Active Member Licensed User Longtime User Dec 8, 2019 #3 Harris said: Looks like a tablet view - responsive... Click to expand... OK, but I have no idea how to control it. Upvote 0
Harris said: Looks like a tablet view - responsive... Click to expand... OK, but I have no idea how to control it.
Cableguy Expert Licensed User Longtime User Dec 8, 2019 #4 Philip Chatzigeorgiadis said: OK, but I have no idea how to control it. Click to expand... It's your grid's visibility that controls it... Upvote 0
Philip Chatzigeorgiadis said: OK, but I have no idea how to control it. Click to expand... It's your grid's visibility that controls it...
Philip Chatzigeorgiadis Active Member Licensed User Longtime User Dec 8, 2019 #5 Cableguy said: It's your grid's visibility that controls it... Click to expand... I don't think it is a grid visibility issue. After all, the flexwall page in my app is an exact copy of abmaterial's demo page, which works OK. The setup is very simple: In Buildpage: Code: Copy page.AddRows(4,True, "").AddCells12(1,"") page.BuildGrid In ConnectPage: Code: Copy Dim flexWall As ABMFlexWall flexWall.Initialize(page, "flexwall", 350) For i = 1 To 20 flexWall.AddImage(ABMShared.BuildImage(page, "img" & i, "../images2/" & i & ".jpg",1, i & ".jpg"), 1024, 768) Next page.Cell(2,1).AddComponent(flexWall) Note that initialization happens in ConnectPage, which addresses Mashiane's suggestion here (Post 14): https://www.b4x.com/android/forum/t...rial-a-personal-experiment.73045/#post-466565 In fact, the only difference I see between my app and Mashiane's and ABMaterial's Demo app is that my SideBar Menu is always hidden - although I cannot think why hiding the menu would cause the flexwall to have this behaviour. Anyway, I will try my app's flexwall tomorrow without hiding the SideBar menu and report back. Upvote 0
Cableguy said: It's your grid's visibility that controls it... Click to expand... I don't think it is a grid visibility issue. After all, the flexwall page in my app is an exact copy of abmaterial's demo page, which works OK. The setup is very simple: In Buildpage: Code: Copy page.AddRows(4,True, "").AddCells12(1,"") page.BuildGrid In ConnectPage: Code: Copy Dim flexWall As ABMFlexWall flexWall.Initialize(page, "flexwall", 350) For i = 1 To 20 flexWall.AddImage(ABMShared.BuildImage(page, "img" & i, "../images2/" & i & ".jpg",1, i & ".jpg"), 1024, 768) Next page.Cell(2,1).AddComponent(flexWall) Note that initialization happens in ConnectPage, which addresses Mashiane's suggestion here (Post 14): https://www.b4x.com/android/forum/t...rial-a-personal-experiment.73045/#post-466565 In fact, the only difference I see between my app and Mashiane's and ABMaterial's Demo app is that my SideBar Menu is always hidden - although I cannot think why hiding the menu would cause the flexwall to have this behaviour. Anyway, I will try my app's flexwall tomorrow without hiding the SideBar menu and report back.
alwaysbusy Expert Licensed User Longtime User Dec 8, 2019 #6 Actually it is possible that the hidden sidebar causes this: the sidebar is in Materialize CSS normally only hidden on phones or tablets, not desktops. So if it is hidden, it may affect the behaviour of the rest of the page as being seen as a phone or tablet. Upvote 0
Actually it is possible that the hidden sidebar causes this: the sidebar is in Materialize CSS normally only hidden on phones or tablets, not desktops. So if it is hidden, it may affect the behaviour of the rest of the page as being seen as a phone or tablet.
Philip Chatzigeorgiadis Active Member Licensed User Longtime User Dec 9, 2019 #7 alwaysbusy said: Actually it is possible that the hidden sidebar causes this: the sidebar is in Materialize CSS normally only hidden on phones or tablets, not desktops. So if it is hidden, it may affect the behaviour of the rest of the page as being seen as a phone or tablet. Click to expand... I confirm that by setting the sidebar's visibility to ABM.SIDEBAR_AUTO or ABM.SIDEBAR_MANUAL_HIDEMEDIUMSMALL the flexwall is displayed properly. Thank you all for pointing me in the right direction. Upvote 0
alwaysbusy said: Actually it is possible that the hidden sidebar causes this: the sidebar is in Materialize CSS normally only hidden on phones or tablets, not desktops. So if it is hidden, it may affect the behaviour of the rest of the page as being seen as a phone or tablet. Click to expand... I confirm that by setting the sidebar's visibility to ABM.SIDEBAR_AUTO or ABM.SIDEBAR_MANUAL_HIDEMEDIUMSMALL the flexwall is displayed properly. Thank you all for pointing me in the right direction.
