B4J Question ABMaterial: Detect orientation?

techknight

Well-Known Member
Licensed User
Longtime User
Is there a way to detect the orientation of a device? Whether its in landscape or portrait? I have 2 different landing images/splash screens but it depends on the device orientation whether its displayed properly.

Not sure how to do this.

any ideas? thanks.
 
Sort by date Sort by votes

OliverA

Expert
Licensed User
Longtime User
ABM.GetBrowserWidthHeight returns a string encoding of width height separated by a semi-colon. So if Width > Height landscape, otherwise portrait. Note, the string returned may be "" or not contain a semi-colon, at which point your just left to guess. You also have page.Isphone, page.IsTablet, and page.IsDesktop available to make some determination. And finally, page.GetPlatform (https://www.b4x.com/android/forum/threads/abmaterial-device-recognition.77387/post-490225).
 
Upvote 0

Harris

Expert
Licensed User
Longtime User
techknight said:
Is there an event where when I rotate the phone, I can call ABM.GetBrowserWidthHeight ?
Click to expand...
I think you have to do this in the BuildPage , ConnectPage, since this is (GetBrowserWidthHeight) can be called when device is rotated (page rebuilt)...
This is tricky to determine at "the right time"...
 
Upvote 0

techknight

Well-Known Member
Licensed User
Longtime User
yea, that probably wont do what I want it to. GetBrowserWidthHeight doesnt work in ABMApplication where I needed it to.

I have 2 pages. One is rendered all in portrait, one is rendered all in landscape so I need to be able to redirect to the correct page.
 
Upvote 0

OliverA

Expert
Licensed User
Longtime User
Ok. In the www\js\custom folder, create a new file named onresize.js with the following content:
B4X: 
$(window).resize(function(){
  b4j_raiseEvent('page_parseevent', {'eventname': 'page' + '_resize','eventparams': 'size', 'size': window.innerWidth + ";" + window.innerHeight});
});
In the ABM page that you want to use this, in the BuildPage() method, add
B4X: 
page.AddExtraJavaScriptFile("custom/onresize.js")
then add the following method to your page
B4X: 
Public Sub page_resize(size As String)
    Log("****************************************")
    Log(ABM.GetBrowserWidthHeight(page))
    Log(size)
    Log("****************************************")
End Sub
Currently, it's just logging the window's size (and to show I'm returning the same values as you would get with GetBrowserWidthHeight)
Now, you can initially check the page (via GetBrowserWidthHeight) to determine orientation and then use this sub to change it as needed.
Note: Name of .js file is not important as long as you change the name in the AddExtraJavaScriptFile
 
Upvote 0

OliverA

Expert
Licensed User
Longtime User
There is a Page_SizeChanged(previous As String, current As String) event, but that is only raised if the "type" of size changes (like tablet to desktop, etc).

Note: Based on ABMaterial 4.51
 
Upvote 0

alwaysbusy

Expert
Licensed User
Longtime User
OliverA said:
There is a Page_SizeChanged(previous As String, current As String) event, but that is only raised if the "type" of size changes (like tablet to desktop, etc).
Click to expand...
You are right. That was the one I was thinking of Maybe a good idea to build in for a next version then.
 
Upvote 0

techknight

Well-Known Member
Licensed User
Longtime User
Ok so this works, allowing me to bounce back and forth between pages, But it gets buggy after a couple times.

So when it flips from one page to another, black screen. if I refresh, itll come back but sometimes itll just instantly go right back to black screen.

Not sure what im doing wrong.

Vertical page I have this:
B4X: 
Public Sub page_resize(size As String)
    Log("****************************************")
    Log(ABM.GetBrowserWidthHeight(page))
    Log(size)
    Log("****************************************")
    
    Dim Arr() As String = Regex.Split(";", size)
    If Arr.Length > 0 Then 
        If Common.Val(Arr(0)) > Common.Val(Arr(1)) Then 
            ABMShared.NavigateToPage(ws, "", "../BaseballLayout/")
        End If
    End If
End Sub

Horizontal page, I have this:
B4X: 
Public Sub page_resize(size As String)
    Log("****************************************")
    Log(ABM.GetBrowserWidthHeight(page))
    Log(size)
    Log("****************************************")
    
    Dim Arr() As String = Regex.Split(";", size)
    If Arr.Length > 0 Then
        If Common.Val(Arr(0)) < Common.Val(Arr(1)) Then
            ABMShared.NavigateToPage(ws, "", "../BaseballLayoutVertical/")
        End If
    End If
End Sub

I also have the 2 custom thingies put into buildpage.

thoughts?
 
Upvote 0

OliverA

Expert
Licensed User
Longtime User
techknight said:
So when it flips from one page to another, black screen.
Click to expand...
Check you logs on the server. Notice what the page says about caching when it works and when it does not works. I had a similar issue, but got pulled to another project before being able to report a full bug report. As much as I remember, it came down to caching (on the server side, the caching ABM uses).

Edit: Grammar... Not my day today
Edit2: And spelling...
 
Upvote 0

techknight

Well-Known Member
Licensed User
Longtime User
The only difference I see is "Saving First Instance" when it works, and Comes from Cache when it doesnt.

Refreshing the page works most of the time, as it will display "Saving first instance" again.

if I knew how to disable the cache, I would try it.
 
Upvote 0

OliverA

Expert
Licensed User
Longtime User
The black screen, is it related to an image that you are showing? Maybe this issue should be a new thread. It does not have anything to do with orientation. I had a similar issue (as stated above) and may have a clue as to what is going on. If the issue is related to an image not showing up, where do you load the image? In BuildPage() or ConnectPage()?
 
Upvote 0

techknight

Well-Known Member
Licensed User
Longtime User
Well its a canvas that I build in code, all of my labels, and controls and things are built onto the canvas.

The images are added in BuildPage, But then everything is built in ConnectPage. That is where everything is initialized.

And I kept it in this thread because for me, its related to the orientation thing. Because like I said, if I dont use that, and just navigate to the page, this issue DOES NOT happen. It only happens when I use NavigateToPage with the orientation change.
 
Upvote 0
You must log in or register to reply here.

Similar Threads

  • Question
B4J Question ABMaterial: Detect a dead page?
Replies
9
Views
2K
techknight
A
  • Question
B4J Question [ABMaterial] How to detect whether ModalSheet is Open or not
Replies
8
Views
2K
Anser
A
A
  • Question
B4J Question [ABMaterial] Detect whether the browser or tab in the browser is closed or not
Replies
1
Views
2K
alwaysbusy
  • Question
B4J Question [ABMaterial]: Detect browser and inform end user?
Replies
4
Views
2K
alwaysbusy
  • Question
B4J Question [ABMaterial] Detecting Browser (device) language
Replies
13
Views
3K
Cableguy
Menu
Log in
Register
Cookies are required to use this site. You must accept them to continue using the site. Learn more…