Android Question Can't explain designer behaviour

Status
Not open for further replies.
J

Jason Wood

Member
Licensed User
Hey,
So I'm struggling to understand why I can not right-align views within a panel.



I have a panel (big yellow rectangle) and inside I have several other views. The panel (pnlLevelInfo) width is set with designer script:

B4X: 
pnlLevelInfo.Left = 15dip
pnlLevelInfo.Width = 100%x - 30dip

Inside this panel I have a label (lblTimeSLowest). Its width is set to 50% of the panel width and in designer script I set it to right align to the panel:

B4X: 
lblTimeSlowest.Right =  pnlLevelInfo.Right

However, the right of the lblTimeSlowest is actually against the right side of the whole screen i.e as if in the designer I'd set horizontal align to right and distance to zero. I don't understand why. It's as if pnlLevelInfo.Right is giving the x coordinate of the far right of the screen even though its right side is 15dip in from the right.

Also, I tried to make some labels the same width as the panel by using horizontal anchor: both and setting left and right to zero for the lblInstructions illustrated above. The left side correctly aligns to the left of the panel but the right of the label does not touch the right side of the panel. It's the same with the other labels. Its as if there is hidden right padding inside the panel!

Anyway, I know I can get around this by specifying specific right positions of these views in dip rather than referencing pnlLevelInfo.Right but I am stubborn an need to understand what is going on here.

It's rather frustrating that I can't work it out!
 
Sort by date Sort by votes
J

Jason Wood

Member
Licensed User
Hey Erel,
Thanks for getting back to me.

I didn't realise that the script is run after the anchors are applied and that it has implications. I didn't see it mentioned in the beginners guide.

I have made a test layout file to try to understand what is happening.



Panel1 width is set using anchors.
Panel2 width is set in script using SetLeftAndRight

Label1 and Label3 are both set to left/right zero using anchors
Label2 and Label4 are set to right zero using anchors.

When the script is run and the width of Panel2 is changed, the right anchor point of Label3 and Label4 is not updated to reflect the new position of the Panel. I understand this now so I know how to work with that.

However, Label5 and Label6 are both set to right align with the right of the containing panel in script i.e. Label5.Right = Panel1.Right, Label6.Right = Panel2.Right. But instead of aligning with the right of their containing panels, they seem to be set to right = 0.

But, if I apply the same script to labels outside of the containing Panels, the right align works correctly i.e. LabelPnl1Right.Right = Panel1.Right correctly matches the right of the label with the right of the panel.

So it seems to me that the views that are children of the panel can't access their parent's .Right value via script, but views that are not children of the panel can access its .Right value.

Is this mean't to be the case? Or am I doing something wrong?

I've attached the test layout file.

Thanks
 

Attachments

  • test_layout.bal
    824 bytes · Views: 429
Upvote 0

klaus

Expert
Licensed User
Longtime User
Sorry, but the layout file is empty ?!

The coordinates for the Panels are in Activity coordinates.
The coordinates of child views are in the parent view coordibates!
So if you set Label5.Right = Panel1.Right, Label5.Right will be outsides Panel1?
You should use an Anchor or set Label5.Right = 100%x. In the case 100%x is the width of Panel1.

EDIT:
set Label5.Right = 100%x
this is wrong!
it should be set Label5.Right = Panel1.Width
See posts #8 and #10
 
Last edited:
Upvote 0

LordZenzo

Well-Known Member
Licensed User
Longtime User
Percentage coordinates are always referenced to the size of the variant, so 100% x for an 800dip variant with density 1 equals 800dip whether the parent is a panel and the parent and the activity itself, if the variant is Of 800dip with 1.5 density 100% equals 1200dip, so if you set a 100% label right, the right side of the label moves 800 or 1200 dives compared to the left edge of the child container

Nb translated with google, sorry
 
Last edited:
Upvote 0

LordZenzo

Well-Known Member
Licensed User
Longtime User
Would I ask if the property is called right because it moves from the left side?
In fact it would be right to type label.right = 0% x to get a right-hand shift
And instead you have to write label.right = 100% x, but this is a logical and semantic mistake
 
Last edited:
Upvote 0

klaus

Expert
Licensed User
Longtime User
... or set Label5.Right = 100%x. In the case 100%x is the width of Panel1.
Click to expand...
I am wrong!
I was confusing with this:
100%x and 100%y are referenced to the main parent.
If you are calling Activity.LoadLayout then Activity is the main parent.
If you are calling Panel1.LoadLayout => Panel1 is the main parent.
So
Label5.Right = 100%x
should be
Label5.Right = Panel1.Width
 
Upvote 0

LordZenzo

Well-Known Member
Licensed User
Longtime User
ora lo spiego io
Now I explain it
ora lo spiego io, e lo faccio perche uso sempre e solamente le percentuali
quindi lo spiego, non perche ho studiato il manuale, ne perche lo creato io, ma solo per l'esperienza fatta
quando uso i valori in percentuale , questi si riferiscono solo e sempre alle dimensioni reali dello schermo di smartphon o tablet
quindi quando scrivo 10%x di un telefono con schermo di 768dip avro una misura di 76,8dip
se imposto label.left=10%x la label si sposta di 76,8dip dal lato sinistro del parent, sia esso un panel o la activity.
se imposto label.right=100%x il lato destro della label si sposta di 768dip dal lato sinistro del parent, sia esso un panel o la activity.
e qui e` il bug o errore di sintassi o come lo volete chiamare, perche la parola right riporta alla mente il lato destro e viene da pensare che sia la distanza dal lato destro del parent ma cosi non e`
Now I explain it, and I do it because I always use and only percentages
So I explain it, not because I have studied the manual, because I created it, but only for the experience it made
When I use percentage values, these only refer to the actual size of the smartphone or tablet screen
So when I write 10% x of a 768dip screen phone I will have a 76.8dip measure
If label.left = 10% x the label moves 76.8dip from the left side of the parent, whether it is a panel or activity.
If label.right = 100% x the right side of the label moves 768dip from the left side of the parent, whether it is a panel or activity.
And here is the bug or syntax error or how do you want to call it, because the word right brings the right side to the mind and is thought to be the distance to the right side of the parent but it is not

If the manual says otherwise, the manual is wrong
 
Last edited:
Upvote 0

klaus

Expert
Licensed User
Longtime User
Attached a small project showing the difference when a layout is loaded onto an Activity or onto a Panel.



The project has two layout files.
Main.bal with only the blue Panel1.
test_layout.bal with the four Labels.

In the Designer:
Label1 and Label4 have horizontal anchor LEFT
Label2 and Label3 have horizontal anchor RIGHT

In the DesignerScripts:
B4X: 
Label1.Width = 20%x
Label2.Width = 20%x
Label3.Width = 20%x
Label3.Right = 100%x
Label4.Right = 100%x

The test_layout.bal layout is loaded once onto the Acivity and also onto Panel1.
B4X: 
Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("Main")
    Activity.LoadLayout("test_layout")
    Panel1.LoadLayout("test_layout")
    Panel1.Color = Colors.Blue
End Sub

We see that:
The widths of Label1, Label2 and Label3 are adjusted to 20%x of the main parent width, on top according to Activity.Width and below according to Panel1.Width.
Label2 and Label3 have both the horizontal anchor set to RIGHT.
Why is the Left position of Label2 different from Label3.
Label2 has the original Left position, with the anchor, but then we adjust the Width of it in DesignerScripts.
The Left position remains the same but the width is changed, the RIGHT horizontal anchor is overwritten.
Label3 has the right position alignded at 100%x because we set it in the DesignerScripts.
 

Attachments

  • LayoutTest.zip
    8.4 KB · Views: 379
Upvote 0

LordZenzo

Well-Known Member
Licensed User
Longtime User
In this test, load the layay in a panel, but in the previous examples we talked about the same layoad loaded in the activity
It is natural that in this case the layoff is resized according to the new dimensions

In fact you see 2 label1, 2 label2, 2 label3
But if you look at the first place, it's clear that this is not the case
 
Upvote 0

klaus

Expert
Licensed User
Longtime User
In this test, load the layay in a panel, but in the previous examples we talked about the same layoad loaded in the activity
Click to expand...
I know this.
Post #10 is intented to explain, whith a concrete example, what I wrote in post #4 and #8.
 
Upvote 0

LordZenzo

Well-Known Member
Licensed User
Longtime User
I do not fight for anyone except perhaps for Jason who receives unanswerable answers to his problem, he talks about designers you answer with load layout, and you say my answers are not relevant? Maybe before answering, read the questions
 
Upvote 0
J

Jason Wood

Member
Licensed User
Thanks for all your answers.

I am from a php/html/css background, so I'm used to creating responsive webpage layouts that change based on window size. That is what I want to do with Android app layouts hence I'm experimenting with layout anchors and script and am trying to learn the quirks of working with the designer.

I didn't intend to cause any arguments!
 
Upvote 0

LordZenzo

Well-Known Member
Licensed User
Longtime User
Jason did not blame you, I pointed out to them that the answers given were not in line with the question made, but they do not accept being corrected by anyone apparently, I would in their place thank you because a lapse may happen and people Humble people accept criticisms and corrections for responsible and continuous growth
 
Upvote 0

Erel

B4X founder
Staff member
Licensed User
Longtime User
I'll you the truth. I really don't know what you are talking about.

I didn't give any answer in this thread. I only recommended the OP to use anchors instead of the designer script (when possible).
For some mysterious reason you started attacking me or Klaus (?). Both of us just tried to help Jason. Go over the above posts and you will see.

As I'm not interested in arguing with you, this thread is closed. @Jason Wood as I previously wrote you are more than welcome to start a new thread with any question you have.

LordZenzo said:
Maybe before answering, read the questions
Click to expand...
Such statements are not accepted here. I tried to help the OP. It is none of your business whether I read the question or not. You can say that my answer was wrong (which is not possible here as I didn't give any answer).
 
Upvote 0
Status
Not open for further replies.

Similar Threads

P
  • Question
Android Question Strange behaviour
Replies
10
Views
2K
Pelky
P
  • Article
Android Tutorial [B4X] [Visual Designer] Spreading Controls
Replies
1
Views
8K
hatzisn
  • Sticky
  • Article
Android Tutorial [B4X] Documentation Booklets
7 8 9
Replies
164
Views
125K
aeric
  • Locked
  • Article
B4J Tutorial [B4X] Custom Views with Enhanced Designer Support
2 3
Replies
48
Views
60K
rwblinn
  • Question
Android Question AutoScale Code Module
2 3 4
Replies
70
Views
43K
watesoft
Menu
Log in
Register
Cookies are required to use this site. You must accept them to continue using the site. Learn more…