iOS Question B4Xdrawer and SafeAreaInsets

[marcick]

I have a PnlRoot that contains the main layout and the resize event works fine with IphoneX

Private Sub PageMain_Resize(Width As Int, Height As Int)
    Dim r As Rect = PageMain.SafeAreaInsets
    PnlRoot.SetLayoutAnimated(0, 1, r.Left, r.Top, Width - r.Right - r.Left, Height - r.Bottom - r.Top)   
End Sub

But when I add the code to implement the B4XDrawer (based on this tutorial), I have a wrong graphics behaviour.
It seems the Drawer.Centerpanel that contains the main layout doesn't shift correctly so I see two layout one over the other and with different offsets
Where I'm wrong ?

I tried this

Private Sub PageMain_Resize(Width As Int, Height As Int)
    Dim r As Rect = PageMain.SafeAreaInsets
    Drawer.Resize(Width - r.Right - r.Left, Height - r.Bottom - r.Top)
    PnlRoot.SetLayoutAnimated(0, 1, r.Left, r.Top, Width - r.Right - r.Left, Height - r.Bottom - r.Top)   
End Sub

 

[Erel]

Please create a small project with this code and upload it.

 

[marcick]

Here it is, thanks

 

[Erel]

You are loading the layouts multiple times. Only layout the layouts to CenterPanel:

Drawer.CenterPanel.LoadLayout("root")
Drawer.CenterPanel.LoadLayout("1")
Drawer.LeftPanel.LoadLayout("left")

 

[marcick]

It doesn't work. Sorry but your explaination is not complete for my skilllevel....
Starting from the above attached sample, could you please correct the error and post the complete Application_Start and Page_Resize code ?

 

[Erel]

Private Sub Application_Start (Nav As NavigationController)
    NavControl = Nav
    SetNavColors(0xFFB0F1FF)
    Page1.Initialize("Page1")
    Page1.Title = "Page 1"
    Page1.RootPanel.SetBorder(0, 0, 0)
    Page1.RootPanel.Color = Colors.White
    
    
    NavControl.ShowPage(Page1)
    Drawer.Initialize(Me, "drawer", Page1.RootPanel, 400dip)
    Drawer.CenterPanel.LoadLayout("root")
    Panel1.LoadLayout("1")
    Drawer.LeftPanel.LoadLayout("left")
    Dim bb As BarButton
    bb.InitializeBitmap(LoadBitmapResize(File.DirAssets, "hamburger.png", 32dip, 32dip, True), "hamburger")
    Page1.TopLeftButtons = Array(bb)
    CustomListView1.DefaultTextBackgroundColor = 0xFF77CAFF
    For i = 1 To 30
        CustomListView1.AddTextItem($"Item #${i}"$, "")
    Next
End Sub

Private Sub Page1_Resize(Width As Int, Height As Int)
    Drawer.Resize(Width, Height)
End Sub

 

[marcick]

That code does not consider the IphoneX safe area .... this is my problem.
Also adding the usual code below does not work properly

Private Sub Page1_Resize(Width As Int, Height As Int)
    Dim r As Rect = Page1.SafeAreaInsets
    Page1.RootPanel.SetLayoutAnimated(0, 1, r.Left, r.Top, Width - r.Right - r.Left, Height - r.Bottom - r.Top)
    Drawer.Resize(Width, Height)
End Sub

 

[Erel]

Upload an updated example based on my code where there is actually a view that is outside of the safe area.

 

[marcick]

Thank you. Here it is.

 

[Erel]

I cannot guess what is wrong...

The items in the drawer's list?

 

[marcick]

Do you see the same problem I say ? It is your sample from the tutorial. I just added the layout root that contains the panel, required to use the SafeAreaInsets

 

[Alexander Stolte]

Do you see the same problem I say ?

No, he means he doesn't know what the problem is because he doesn't see any wrongdoing.

 

[marcick]

Put the device in landscape and see

 

[Erel]

Private Sub Page1_Resize(Width As Int, Height As Int)
    Dim r As Rect = Page1.SafeAreaInsets
    Drawer.Resize(Width, Height)
    Sleep(100)
    CustomListView1.AsView.SetLayoutAnimated(0, r.Left, CustomListView1.AsView.Top, Drawer.LeftPanel.Width - r.Left, Height - r.Bottom - CustomListView1.AsView.Top)
End Sub

 

[marcick]

It doesn't work. I've abandoned the drawer. Thank you.

 

[Erel]

That's not very nice. It took me quite a while to get to this solution. Will not happen again.

 

[marcick]

Sorry Erel, don't misunderstand me or feel offended. Without your support it would be impossible to do nothing for me.
But it's a week I try to make the drawer working correctly and I decided (3 days ago really) to use instead a classic showpage.
But If I can cooperate for the test I'm here. The code posted above make no difference, the screen I get is

I attach again the corrected zip

 

[Erel]

This is exactly how it should look. The list items are moved slightly to the right and are not hidden by anything.

 

[marcick]

So with the same method "CustomListView1.AsView.SetLayoutAnimated(0, r.Left, CustomL ....." I have to shift right all the view I have in the left panel ? Could be managed.
But also the center panel has the some problem. It shouldn't occupy the rounded corner on the right and the notch on the left.

 

[Alexander Stolte]

It shouldn't occupy the rounded corner on the right and the notch on the left.

why not? All apps that are in landscape mode display something there. Then you have to cache the height of the safearea in portrait mode and then when you rotate the device, include it in the width.