5 Replies Latest reply on Jan 30, 2017 8:56 AM by Chuck Uebele

    Alignment of Buttons and text

    Grey_Rift Level 1

      Hey,

       

      I am trying to make a user interface for a little script that I am developing. Right now the thing that I am stuck with is the alignment of my text and my buttons.

      I am trying to align my text on the left side and my checkbox on the right side but at the same height. I have been looking for a solution but I have come up with nothing so far. Does anyone have any solution for this,

       

      var w = new Window ("dialog", "Asphalt Save");
      
      var buttongroup = w.add ("panel");
      
      
      
      var panel1 = buttongroup.add ("panel", undefined, "Button Group 01");
      
      var Button01 = panel1.add ("button", undefined, "Button01");
      
      var Button02 = panel1.add ("button", undefined, "Button02");
      
      
      
      var panel2 = buttongroup.add ("panel", undefined, "Button Group 02");
      
      var Button03 = panel2.add ("button", undefined, "Button03");
      
      var Button04 = panel2.add ("button", undefined, "Button04");
      
      var panel3 = panel2.add ("panel", undefined, "Options");
      
          
      
      var Text = panel3.add ('statictext', undefined, 'Checkbox 01');
      
      Text.alignment = ['left','top'];  
      
      var rbtn01= panel3.add ("checkbox", undefined,"");
      
      rbtn01.alignment=['right','top'];
      
          
      
      var Text = panel3.add ('statictext', undefined, 'Checkbox 02');
      
      Text.alignment = ['left','top']; 
      
      var rbtn02= panel3.add ("checkbox", undefined,"");
      
      rbtn02.alignment=['right','top'];
      
          
      
      var Text = panel3.add ('statictext', undefined, 'Checkbox 03');
      
      var rbtn03= panel3.add ("checkbox", undefined, "");
      
      rbtn03.alignment=['right','top'];
      
          
      
      var Text = panel3.add ('statictext', undefined, 'Checkbox 04');
      
      var rbtn04= panel3.add ("checkbox", undefined, "");
      
      rbtn04.alignment=['right','top'];
      
      
      
      
      
      w.show();
      
      
        • 1. Re: Alignment of Buttons and text
          Chuck Uebele Adobe Community Professional & MVP

          You need to put each set into their own group:

           

          var grp1Pnl3 = panel3.add('group');
          grp1Pnl3.alignment = 'row';
          grp1Pnl3.alignChildren = ['left','bottom'];
          var Text = grp1Pnl3.add ('statictext', undefined, 'Checkbox 01');  
          // Text.alignment = ['left','bottom'];    
          var rbtn01= grp1Pnl3.add ("checkbox", undefined,"");  
          //rbtn01.alignment=['right','bottom']; 
          
          1 person found this helpful
          • 2. Re: Alignment of Buttons and text
            Chuck Uebele Adobe Community Professional & MVP

            Is there any reason you don't want to use the built-in text line for the checkbox that puts the box on the right?

            • 3. Re: Alignment of Buttons and text
              SuperMerlin Level 5
              var w = new Window ("dialog", "Asphalt Save");  
              var buttongroup = w.add ("panel");  
              var panel1 = buttongroup.add ("panel", undefined, "Button Group 01");  
              var Button01 = panel1.add ("button", undefined, "Button01");    
              var Button02 = panel1.add ("button", undefined, "Button02");  
              var panel2 = buttongroup.add ("panel", undefined, "Button Group 02");  
              var Button03 = panel2.add ("button", undefined, "Button03");  
              var Button04 = panel2.add ("button", undefined, "Button04");  
              var panel3 = panel2.add ("panel", undefined, "Options");  
              var g1 = panel3.add("group");
              var Text1 = g1.add ("statictext", undefined, "Checkbox 01");    
              var rbtn01= g1.add ("checkbox", undefined,"");  
              var g2 = panel3.add("group");
              var Text2 = g2.add ("statictext", undefined, "Checkbox 02");   
              var rbtn02= g2.add ("checkbox", undefined,"");  
              var g3 = panel3.add("group");
              var Text3 = g3.add ("statictext", undefined, "Checkbox 03");  
              var rbtn03= g3.add ("checkbox", undefined, "");  
              var g4 = panel3.add("group");
              var Text4 = g4.add ("statictext", undefined, "Checkbox 04");  
              var rbtn04= g4.add ("checkbox", undefined, "");  
              w.show();  
              
              
              1 person found this helpful
              • 4. Re: Alignment of Buttons and text
                Grey_Rift Level 1

                This is the reasons why I am not using the built in text from the checker box because I'm trying to achieve this.
                What you are saying is helpful. But it does not solve my problem. But thank you for your input .

                script_02.png

                And this is the result that I'm trying to achieve.

                script.png

                 

                 

                    var w = new Window ("dialog", "Asphalt Save");

                    var buttongroup = w.add ("panel");

                 

                    var panel1 = buttongroup.add ("panel", undefined, "Button Group 01");

                 

                  

                    var Button01 = panel1.add ("button", undefined, "Button01");

                    var Button02 = panel1.add ("button", undefined, "Button02");

                 

                    var panel2 = buttongroup.add ("panel", undefined, "Button Group 02");

                    var Button03 = panel2.add ("button", undefined, "Button03");

                    var Button04 = panel2.add ("button", undefined, "Button04");

                    var panel3 = panel2.add ("panel", undefined, "Options");

                  

                    //panel4.orientation='panel'

                 

                    var grpOptions =panel3.add('group');

                 

                   grpOptions.allignChildren = ['left','bottom'];

                    var Text = grpOptions.add ('statictext', undefined, 'Checkbox 01');

                  

                    grpOptions.allignChildren = ['right','bottom'];

                    var rbtn01= grpOptions.add ("checkbox", undefined,"");

                  

                    var grpOptions2 =panel3.add('group');

                    var Text = grpOptions2.add ('statictext', undefined, 'a second Checkbox 01');

                    var rbtn01= grpOptions2.add ("checkbox", undefined,"");

                  

                  

                    panel3.allignChildren = ['left'];

                w.show();
                1 person found this helpful
                • 5. Re: Alignment of Buttons and text
                  Chuck Uebele Adobe Community Professional & MVP

                  If you want that effect, add a line to make the group fill the area, then align the checkbox to the right rather than the left.