iOS Question Safe Area in iPhoneX

Discussion in 'iOS Questions' started by michw, Jul 8, 2019.

  1. michw

    michw Member Licensed User

    Hello
    I have a question.
    In my app i have a multiple pages. The main page is load by:

    Code:
    Private Sub Application_Start (Nav As NavigationController)
        NavControl=Nav
        pg.Initialize(
    "pg")
        pg.RootPanel.LoadLayout(
    "SafeAreaPanel")
        Panel_root.LoadLayout(
    "main")
        NavControl.NavigationBarVisible = 
    False
        NavControl.ShowPage(pg)
    end sub

    Private Sub pg_resize(Width As Int, Height As Int)
       
        
    Dim r As Rect = pg.SafeAreaInsets
        
    If r.Bottom>0 Or r.Left>0 Then
            IphoneX=
    True
        
    Else
            IphoneX=
    False
        
    End If
        Panel_root.SetLayoutAnimated(
    01, r.Left, r.Top, Width - r.Right - r.Left, Height - r.Bottom - r.Top)
        ScreenX=Width - r.Right - r.Left
        ScreenY=Height - r.Bottom - r.Top
    End Sub
    in layout "SafeAreaPanel" i have a "Panel_root" and i load to this panel other layout ("main")
    It's ok in iPhone X. Other pages i call by:

    Code:
    Sub MenuAccount_Click
        Account.Show
    End Sub
    Account is other code module. In this module in "Show" sub i have:

    Code:
    If pg.IsInitialized = False Then
            pg.Initialize(
    "pg")
            pg.RootPanel.LoadLayout(
    "SafeAreaPanel")
            panel_root.LoadLayout(
    "Account")
            panel_root.Width=Main.ScreenX
            panel_root.Height=Main.ScreenY
        
    End If
    Here is a problem with bottom safe area. The layout is on the system home button.
    How can I set the layout height in a different page without main.

    Thanks!
     
  2. Erel

    Erel Administrator Staff Member Licensed User

    1. You don't need to check whether it is an iPhone X or not.
    2. Just add this to each of the pages:
    Code:
    Private Sub pg_resize(Width As Int, Height As Int)
        
    Dim r As Rect = pg.SafeAreaInsets
        Panel_root.SetLayoutAnimated(
    01, r.Left, r.Top, Width - r.Right - r.Left, Height - r.Bottom - r.Top)
    End Sub
     
  3. michw

    michw Member Licensed User

    Ok, I'll test it.
    I want to detect if the application is on the iPhoneX because I have a problem with positioning the objects at the bottom.
    On the iPhone 6S are exactly as I set them in Designer.
    But in iPhoneX they are lower though they have been loaded into SafeArea.

    Is it better to use positioning in the code with 100%x and 100%y, or to create an object?
    Code:
    Private LV As LayoutValues
    LV=
    GetDeviceLayoutValues
     
  4. Erel

    Erel Administrator Staff Member Licensed User

  5. michw

    michw Member Licensed User

    Yes, I saw this movie, I do not have this problem in the Android app.
    Below a screenshot of what I mean:

    iPhone 6S
    Iphone 6S.jpg


    iPhone X
    IPhone X.jpg

    It's about the red circle that hides on the iPhone X. The setting of this element is only in Designer

    Designer.png

    What am I doing wrong?
     
  6. Erel

    Erel Administrator Staff Member Licensed User

    It is difficult to understand the layout from the screenshot. You should use xCustomListView for such list. The button should be above it.
     
  7. michw

    michw Member Licensed User

    The button is a panel. He's on top and his parent is Main. The button is stationary and the list behind it is generated as panels in the scrollview object.
    The iPhone 5C / 6S is fine .... The application for android is also ok

    Only on the iPhone X all the elements at the bottom are too low.
     
  8. Erel

    Erel Administrator Staff Member Licensed User

    1. It would have been much simpler to design this layout with xCLV.
    2. The button shouldn't be added to the ScrollView. It should be above it.

    If you upload the project (File - Export as zip) then we can say more...
     
  9. michw

    michw Member Licensed User

    1. The first application was in B4A and it works, so it has been copied to B4i. - it works too

    2. ScrollView is filled dynamically from the code, but a round button is added in Designer and is not in ScrollView just above it.
     
  10. Erel

    Erel Administrator Staff Member Licensed User

     
    omo likes this.
  11. michw

    michw Member Licensed User

    Everything is clear ... I had the Handle Resize Event disabled in the designer :)

    Thx Erel for help!
     
Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice