Android Question 100% is not full screen?

[DaveW]

I have been struggling with positioning views using the percent system, it appears to me that 100%x and 100%y are not actually the full width and height of the screen.

The attached images show a simple test app that has a main layout with a Tabhost and button and a Tab layout with a couple of buttons. The Tabhost is set to full screen width and height in the script:

TabHost1.SetLeftAndRight(0,100%x)
TabHost1.SetTopAndBottom(0,100%y)​

The buttons are all positioned in the top left or bottom right corners using anchors and edge distance of 1. The Tabhost padding is set to zero in the app:

TabManager.setTabHostPadding(TabHost1,0,0,0,0)
TabManager.setTabContentViewPadding(TabHost1,0,0,0,0)​

The top left button is positioned as I would expect, right in the corner. However the bottom right buttons are not. The (grey) button on the main layout is close to the edges but not as close as the button in the top left (which is on the Tab layout). The real problem is the bottom right (green) button on the Tab layout, this is nowhere near the edge of the screen. The images below show the same app run on 2 different smartphones. They have different screen sizes (1920 x 1080 and 1280 x 720) but the same aspect ratio. One screen uses the Nexus style, on-screen controls, the other does not.
The 3 frames in each image show the result of changing the SetLeftAndRight and SetTopAndBottom values. I used 100/100%, 102/102% and 104/102% for the X & Y to try to get the button actually into the corner.
From this it would appear that the screen width is actually about 105% and height 102% or 104% depending on whether the on-screen control bar is shown or not.

Another point is that though all the buttons are 100 x 100 in the Designer, they come out at different sizes on screen. The one on the main layout (grey) is about 10% smaller than the ones on the TabHost (even when that is set to 100/100%).

 

[klaus]

Several problems in your code:
1) FirstTime
You should not put the code for the TabHost in If FirstTime

2) Button size
The button on the Main screen has a DefaultDrawable.
The lower left button in frmTab1 has ColorDrawables.
The visible sizes of these drawables are NOT the same!

3) Positions.
The TabHost has a default padding, the position of the lower right button in frmTab1 is positioned according to this padding.
Then you remove this padding in the code, which inceases the width of the Tab Panel.
But the code from the DesignerScript is not executed a second time, therefore the lower right button in frmTab1 remains at its position and doesn't move when the Tab width is changed.
If you want the buttons at exactly the same place you need to reposition them in the code.

4) Anchors
This code in the Designer Scripts can be replaced by Anchors.
TabHost1.SetLeftAndRight(0,100%x)
TabHost1.SetTopAndBottom(0,100%y)
Set the horizontal and vertical anchors to BOTH.

Attached a modified version of your project.

 

[DaveW]

Hi Klaus,

Thank you for your detailed response!

1) I know the code should not be in FirstTime, but it was just a simple demo, it only ever runs once. I could not see how that would affect the size and position of the buttons.

2) That solves the problem of the different sized buttons. I had only changed the red & green ones to make them stand out, I had never imagined that they would change size when I did that (and why on earth would they!?!?).

3) So the Tabhost has padding which can't be changed in the Visual Designer, only in code. And this padding is not symmetrical around the edges (the left and top are 0 but the right and bottom are some other unknown value)?

But even when the padding is set to zero and then the buttons are repositioned in code, they are still further from the edge than the top left button!

4) I agree, but I was just trying out various options while really working on the main problem of the Tabhost padding.

Much as I enjoy programming in B4A, the screen design side of it seems to be a a complete nightmare with traps (like this) everywhere. And this is just for 2 almost identical smartphone screens! I have just started on trying to resize the button text and that seems even worse in some respects :-(

 

[klaus]

1) 4) I gave you my comments, not only for the specific TabHost problem.

2) (and why on earth would they!?!?) It's Android.

3) Unfortunately, B4A doesn't have all the TabHost properties by default in the Designer.