7 Replies Latest reply on Mar 18, 2013 3:18 PM by Marc Autret

    ScriptUI auto-hide layout and styling

    DBarranca Level 4

      Hello,

      I'm having troubles with a script (actually I'm running it in Photoshop, but I'm posting here because this place is densely packaged of ScriptUI experts ).

       

      // Test script
      var winRes = "dialog { \
                title: 'Styling test', \
                orientation: 'row', \
                alignChildren: ['fill', 'top'], \
                firstPanel: Panel {text: 'First', \
                          alignChildren: ['center', 'center'] \
                          size: [250, 200] \
                          openButton: IconButton { title: 'Open new panel', size: [150, 30], properties: {toggle: true} }, \
                          cancelButton: Button { text: 'Cancel', properties:{ name:'cancel'} }, \
                          okButton: Button { text: 'OK', properties:{name:'ok'} }, \
                } \
      }"
       var win = new Window(winRes)
      
      win.firstPanel.openButton.onClick = function() {
                if (this.value) {
                          var secondPanel = win.add('panel', undefined, 'Second');
                          secondPanel.size = [150, 200];
                          secondPanel.margins = 15;
                          var stTitle = secondPanel.add('statictext', undefined, 'Title');
                          var stText = secondPanel.add('statictext', undefined, undefined, {multiline: true, scrolling: true});
                          var message = "list of things;\nlist of things;\nlist of things;\nlist of things";
                          stText.size = [100,100];
                          stText.text = message;
                          // How to style the statictext?
                              // given that:
                          // alert(win.secondPanel.stText.text) // undefined
                          // alert(win.children[1].children[1].text) // "list of things..."
                          //win.children[1].children[1].graphics.backgroundColor = win.children[1].children[1].graphics.newBrush(win.children[1].children[1].graphics.BrushType.SOLID_COLOR, [0.5, 0.0, 0.0]);
                          win.layout.layout(true)
                } else {
                          win.remove(1)
                          win.layout.layout(true)
                }
      }
      
      win.show();
      

       

      Basically, it opens a Dialog with a panel and some placeholder buttons.

      When you click on one of them, a second panel should be created on the right of the first one and the Dialog resized accordingly.

       

      I've two problems:

      1. The first panel gets resized, and it shouldn't.

      2. I'd like to style the second panel statictext background, but apparently I can't (as you see in the code's comments, I've to reference it as win.children[1].children[1])

       

      For the first problem, I'm out of answers; for the second one, I thought it could be because I can't style a text that is not yet rendered, but any code that I put after the win.layout.layout(true) is never reached.

       

      Any suggestion is greatly appreciated!

      TIA

       

      Davide

        • 1. Re: ScriptUI auto-hide layout and styling
          TᴀW Adobe Community Professional & MVP

          In your 8th line, use:

           

          minimumSize:

           

          that will stop it resizing.

           

          But I don't like the way you rebuild the entire panel each time the

          button is clicked. You should use the visible property of a panel to

          hide it and make it reappear. Build it only once, at the beginning, with

          the rest of the window.

           

          That should answer the first question.

           

          Ariel

          • 2. Re: ScriptUI auto-hide layout and styling
            Marijan Tompa [tomaxxi] Level 4

            You can't change background color of static text control.

            What you can do is to use edittext instead.

             

            Replace this:

             

            var stText = secondPanel.add('statictext', undefined, undefined, {multiline: true, scrolling: true});
            

             

            with this:

             

            var stText = secondPanel.add('edittext', undefined, undefined, {multiline: true, readonly: true});
            

             

            And to change background color, change this:

             

            win.children[1].children[1].graphics.backgroundColor = win.children[1].children[1].graphics.newBrush(win.children[1].children[1].graphics.BrushType.SOLID_COLOR, [0.5, 0.0, 0.0]);
            

             

            with this:

             

            stText.graphics.backgroundColor = stText.graphics.newBrush(stText.graphics.BrushType.SOLID_COLOR, [0.5, 0.0, 0.0]);
            

             

            Hope that helps.

             

            --

            Marijan (tomaxxi)

            http://tomaxxi.com

            • 3. Re: ScriptUI auto-hide layout and styling
              DBarranca Level 4

              Hi Arïel,

              minimumSize did the trick, thank you!

               

              As for the visible property, this would hide the panel (which is what I want) but not resize the whole panel (which is what I need too), i.e the Dialog would show an empty space - at least this is what happened when I first tried that before posting here.

               

               

              Regards,

               

              Davide

              • 4. Re: ScriptUI auto-hide layout and styling
                DBarranca Level 4

                Ah, readonly! I missed that, thanks Marijan!

                 

                Do you happen to know why (within the onClick handler)

                 

                alert(win.secondPanel.stText) // undefined <--
                alert(win.firstPanel) // [object Panel]
                

                 

                while:

                 

                alert(stText) // [object EditText]
                

                 

                That is: why I can't reference the stText as win.secondPanel.stText but I can as stText tout-court?

                 

                Thanks again!

                Davide

                • 5. Re: ScriptUI auto-hide layout and styling
                  Marijan Tompa [tomaxxi] Level 4

                  You are welcome Davide!

                   

                  I never used it that way. I always access objects directly through their variable.

                  It's much more easier, and code is much cleaner.

                  • 6. Re: ScriptUI auto-hide layout and styling
                    DBarranca Level 4

                    It's much more easier, and code is much cleaner.

                     

                    I can't agree more!

                    Actually I was a bit perplexed, since it seems the secondPanel is always "undefined" - at least as long it's not drawn (but then I can not style it anymore, since all the code - as I wrote - after the win.layout.layout(true) call is never reached).

                     

                    So it's bizarre that a child element (here stText) can be used, while the parent (win.secondPanel) not - unless you put together that long ugly chain of win.children[].children[]

                    Anyway, nice to know that the easier solution works!

                     

                    Davide

                    • 7. Re: ScriptUI auto-hide layout and styling
                      Marc Autret Level 4

                      Hi Davide,

                       

                      Considering your original code, win.secondPanel indeed is undefined for a very simple reason: you never set such property.

                      You only declare and set a secondPanel local variable inside the body of the onClick event handler.

                       

                      (By constrast, win.firstPanel is implicitly set as a property of the Window instance thanks to the resource string special syntax.)

                       

                      @+

                      Marc