5 Replies Latest reply on Jun 2, 2017 2:37 PM by Dick Kain

    How can I align UI elements in a dialog box?

    Dick Kain

      I have been trying to align elements within a dialog box by using the locate or bounds properties, but they are not consistent, so I am looking for sage advice. For example, if I write this line

       

          myLRowPreStart = myLRow2.add("staticText", undefined, "Text",{bounds: [20, 0, 50, 16]})

       

      the text will appear indented on some lines of the interface, but not on others. Similarly, I've tried using the location property to position things, and that doesn't work consistently either. Any suggestions out there? Thanks.

        • 1. Re: How can I align UI elements in a dialog box?
          UQg Level 4

          I think it should be like this:

           

          myLRowPreStart = myLRow2.add("staticText", [20, 0, 50, 16], "Text", {});

           

          arguments to add : add(type, bounds, text, creationProperties);

          Only <type> is mandatory, the other 3 args are optionnal.

          Creation properties for static texts can be 'multiline', 'scrolling', etc; <bounds> is not a creation property, so your bounds are simply ignored (ScriptUI doesnt know what to do with that creation property).

           

          You can also use the autolayout (omit bounds, and specify 'alignment', 'size' or  'preferredSize' or 'characters', etc)

           

          Xavier

          • 3. Re: How can I align UI elements in a dialog box?
            Dick Kain Level 1

            Thanks for the tries, but neither of these suggestions does work for me. If I put the bounds in the second parameter, they're sort of ignored, in that the text starts at x = 0 and is truncated at about x = 50. If I work from the assumption that the bounds is not a static property and try to set the bounds upon "show," the alignment does not work, either. I have also tried creating groups along the line, which also sometimes works and sometimes does not - I had hoped the setting up groups would give me a place within which I could use the alignment property directly. I had been looking at Peter Kahrel's guide, which led me to think that I could use groups and position them by "location," which did work some of the time.

             

            By the way, the reason that this question arose is that I was advised that it was not wise to use character widths as a way to lay out the dialog, because the meaning of "characters" might change in different operating systems, so the alignment would get messed up.  I do have a version of my dialog that uses spacing and is OK in my Windows environment.

             

            Another issue that I had in the past (I had to code around it) was that when I moved to my laptop, some numeric entry fields disappeared! Their spaces were present, but there was no box to type into! It's all frustrating, I think you'll all agree......

            • 4. Re: How can I align UI elements in a dialog box?
              UQg Level 4

              You should have a look at the (Adobe) JavaScript Tools Guide.pdf, at : User Interface tools > Automatic Layout > The AutoLayout Manager Algorithm.

               

              Basically, if the bounds of a container are specified, then the autolayout uses those bounds, but in counter part assumes that every child element in the container is also placed (that is, children elements bounds are fully specified). If the container's bounds are not specified, then the autolayout is run and uses properties like "alignment", "orientation", "preferredSize", etc to determine the size/location of all children, but ignores the bounds property of children.

               

              Said otherwise, if you want the bounds of the static text to be taken into account, you also need to specify the bounds of its parent group/panel (unless the parent is the window itself, in which case it'll still work).

               

              There was a very similar thread recently in the After Effects Scripting forum, that might help you : Manual Layout of children of a Tabbed Panel in ScriptUI

               

              Xavier

              • 5. Re: How can I align UI elements in a dialog box?
                Dick Kain Level 1

                Thanks to Xavier for the parsing of the manual determining the (not obvious) hierarchy of bounds specification requirements.