Android Question Weird layout with anchor

Discussion in 'Android Questions' started by Lucas Siqueira, Aug 14, 2019.

  1. Lucas Siqueira

    Lucas Siqueira Member Licensed User

    Why using anchoring does my layout look weird?
    In the preview screen I have three buttons that are anchored on the left and right, if you notice they have a horizontal space between them, but on the real device the screen looks weird, has no spacing. What am I doing wrong?

    When I use the percentage script, it works perfect!

    My phone is a Xiaomi Redmi 5 Plus.
     

    Attached Files:

  2. Peter Simpson

    Peter Simpson Expert Licensed User

    Lucas Siqueira and Erel like this.
  3. emexes

    emexes Well-Known Member Licensed User

    I've found it useful to do layouts in B4J, where you can resize the WYSIWYG window to get immediate feedback on what will (likely) happen on device screens with different aspect ratios and sizes (to a lesser degree, if using AutoScale).

    The new copy controls between different platforms feature will probably make this process easier. Having said that, what I actually do is run a B4J program that generates Designer Script from a variety of aesthetic master variants, that I then paste into the script area of the corresponding B4A/B4I layout, which works a treat but is obviously a bit tedious.

    upload_2019-8-15_17-2-25.png

    upload_2019-8-15_17-11-9.png

    upload_2019-8-15_17-11-21.png

    upload_2019-8-15_17-11-32.png
     
    Last edited: Aug 15, 2019
  4. Lucas Siqueira

    Lucas Siqueira Member Licensed User




    Emeses, to put 5 buttons on the same line using the anchor would be messy?
     
  5. klaus

    klaus Expert Licensed User

    You need to do it in the Designer Script.
    Then, it depends on what you want:
    - adjust spaces for given widths?
    - adjust widths for given spaces?
    - adjust both proportionally?

    Attached a small B4J project showing the differences.

    upload_2019-8-15_15-37-31.png
     

    Attached Files:

    AnandGupta, inakigarm and emexes like this.
  6. emexes

    emexes Well-Known Member Licensed User

    Depends what you want to happen with them when the layout is scaled to fit the phone screen.

    If you space them out evenly, all anchored to the left, and if for example the phone screen is 1.3 times larger than your layout, then all the positions and sizes are multiplied by 1.3, and your buttons will still be evenly spaced across the screen. Ditto with vertical alignments.

    But if the aspect ratios of the phone and the layout are not the same, then things would begin not lining up on the right edge or bottom edge. I read a lot about how anchors are the answer, but my experience has been that they are only the answer if you have one or two things across the width or height of the layout, and there was a mention in the video above at 8:04 that alluded to the same limit.

    The solution to that is Designer Scripting, per the above video from 9:42. That example is vertical rather than horizontal, but the same concepts apply.
     
    Last edited: Aug 15, 2019
    Shelby likes this.
  7. emexes

    emexes Well-Known Member Licensed User

    I was going to suggest asking Klaus aka Master of Bending Layouts To His Will, but I thought best leave him in peace until the going gets tough... happily he has weighed in anyway :)
     
  8. Lucas Siqueira

    Lucas Siqueira Member Licensed User

    Thank you all!
    I'm using anchor for simple layouts, but I use the script for more detailed layouts! Thank you all!
     
    emexes likes this.
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