14 Replies Latest reply on Sep 11, 2015 4:51 PM by photogyulai

    Photoshop scripting UI image or icon

    photogyulai Level 1

      Hey There!

       

      Im trying to getting familiar with photoshop script UI but i have some issues:

       

      I guess it is pretty simple but i did not have any example so i have got no idea!

       

      My goal is to use an image or icon in a window, during script.

      So here is this code:

      var dlg = new Window('dialog', 'Alert Box Builder',[100,100,480,245]); 
      dlg.btnPnl = dlg.add('panel', [15,50,365,115], '');
      dlg.btnPnl.cancelBtn = dlg.btnPnl.add('button', [235,15,335,45], 
      'Cancel', {name:'cancel'}); 
      dlg.show();
      

      Just a window with a Cancel button.

       

      I want to add icon and/or image to this window.

       

      Any help would be appreciated!

       

      ps: I looked the http://wwwimages.adobe.com/www.adobe.com/content/dam/Adobe/en/devnet/photoshop/pdfs/JavaSc riptReferenceGuide.pdf   but i guess this part is missing the examples.

        • 1. Re: Photoshop scripting UI image or icon
          Chuck Uebele Adobe Community Professional & MVP

          Use something like:

           

          var imageFile = new File([path&filename]);
          //.... inside of dialog code
          dlg.imageYouWant = dlg.add('image',[undefined or placement],imageFile);
          

           

          I'm hearing jpgs aren't working, so use png.

          • 2. Re: Photoshop scripting UI image or icon
            Pedro Cortez Marques Level 3

            Try this manual that has the examples you want and much more. The PDF link is there.

            ScriptUI for dummies | Peter Kahrel

             

            I have to note that there are some scriptUI bugs that are not working on photoshop.

            1 person found this helpful
            • 3. Re: Photoshop scripting UI image or icon
              photogyulai Level 1

              Dear Chuck!
              Thank You!
              My main problem is the lack of examples ... programing is pretty syntax sensitive!

              I came up with this and it worked :-)
              dlg.kep = dlg.msg1.add('image', {x:100, y:50, width:70, height:70}, '~/desktop/Photoshop%20scripting/photo_60x60_icon.png');

              I hope with your description and this line above the next googler will find a solution :-)

               

               

              I still wondering if i want to send/share my extension, than how to set the filepath (as you see above is kind of absolute or pc specific.

              I tried relative path but didnt worked...

              I guess the "starting point" of the path was not the directory where i had start my .jsx/script

               

              Any thought's on that anybody?!

              • 4. Re: Photoshop scripting UI image or icon
                photogyulai Level 1

                Pedro thanks!

                 

                It looks pretty detalied, and i see some examples... so i hope the best!

                • 5. Re: Photoshop scripting UI image or icon
                  Chuck Uebele Adobe Community Professional & MVP

                  I like to think of scripting as a massive combination lock - one typo and it doesn't open. Yes, the lack of examples makes things difficult. I've been dabbling at this since PS CS, and I still have trouble with the SDK. For assets, I would create a folder in the personal folder rather than the desktop. People don't like clutter for other people there.

                  • 6. Re: Photoshop scripting UI image or icon
                    Pedro Cortez Marques Level 3
                    // from the desktop (Mac or PC)
                    File(Folder.desktop + "/Photoshop scripting/photo_60x60_icon.png");
                    // from the script file location itself (Mac or PC)
                    File(File($.fileName).path + "/Photoshop scripting/photo_60x60_icon.png");
                    
                    1 person found this helpful
                    • 7. Re: Photoshop scripting UI image or icon
                      photogyulai Level 1

                      Pedro Thanks again! I definetly Try that!

                      And the link/pdf is really great, informative, examples etc.!

                       

                      I have another clue for today :-)

                      I designed a ui window... just s simple "Ok we are ready, enjoy the result" message. At the end of the script.
                      But in my country Hungary we have some special karakters as we write >> é á ö  stuff like that.
                      And the window, with the same code somethimes looks as it should be, and sometimes this characters didnt recognized...

                      see examples:
                      2015-09-06_002746.jpg

                       

                      2015-09-06_002829.jpg

                       

                      And again... this two window is the result of the same code!!! :-)

                       

                      Any thoughts? 

                      • 8. Re: Photoshop scripting UI image or icon
                        Pedro Cortez Marques Level 3

                        I think you should have the javascript toolguide PDF manual. Many of the answers you want are there and also those you will have soon.

                        http://wwwimages.adobe.com/content/dam/Adobe/en/devnet/scripting/pdfs/javascript_tools_gui de.pdf

                         

                        On page 226, you have the solution you want.

                        Shortly, each app on Adobe has a variable $.locale

                        this is the language that directs the characters within your windows.

                        But you can force them to be presenting the laguage you choose.

                        For example

                        $.locale = "hu"; // this works for Hungary messages

                        $.locale = null; // restore to the native locale of the app

                         

                         

                        If you want to give the posibility of letting the user read your windows in its own languages, you can give that chance like this:

                        btnText = { en: "Yes", de: "Ja", fr: "Oui" };

                        b1 = w.add ("button", undefined, localize(btnText)); // In this case, if any computer has installed other language than 'en', 'de' or 'fr', the language chosen will be the native one (could be any, and you don't know)

                        1 person found this helpful
                        • 9. Re: Photoshop scripting UI image or icon
                          photogyulai Level 1

                          Pedro thank You!

                          I was worried a bit becose 99,9% Hungarian users use photoshop in English

                          But i tried and it works (of course i had put the hungarian text after the  "{ en:" stuff

                           

                          and i put an

                          $.localize = true;

                          at the beginning of the script

                           

                          thanks again! :-)

                          • 10. Re: Photoshop scripting UI image or icon
                            photogyulai Level 1

                            Okay im officialy confused! :-)

                             

                            As i wrote up here, after i refreshed the code it was working again >> the special characters was displayed correctly

                             

                            but X minutes later it was wrong again!  Okay i thought maybe becose the text part of the code is in a function {} section.

                            So i took out from the function >> it was okay again >> im testing/tested multiple files and it was okay again

                             

                            X minutes later it is wrong again!

                             

                            I swear to god it is the same code whats working and not!

                             

                            Any ideas?!?

                            • 11. Re: Photoshop scripting UI image or icon
                              Pedro Cortez Marques Level 3

                              Hi

                               

                              I think it is easier than that.

                              If you really want to give access only to one language "hu_HU", use only $.locale and you don't need $.localize = true;

                               

                              Just do this:

                              $.locale = "hu";

                              and then when you create text strings over UI, use only:

                              localize({hu:"[sometext]"})

                               

                              You even don't need to make this: localize({hu:"[sometext]",en:"[sometext]"}), because you have forced the script to be "hu" only.

                              Attention: In this case "hu" will be on only during the script execution. When it finish, photoshop will return to the native whatever language it had before. But this is OK if you just put $.locale = "hu"; in the beginning of all your scripts.

                               

                              • 12. Re: Photoshop scripting UI image or icon
                                photogyulai Level 1

                                Thanks again Pedro!

                                 

                                I tried more than several setup, but did not work.

                                 

                                I guess -as i mentioned before- my PS and the target audience PS isnt set to "hu" we use the Photoshop in english

                                If i try use correctly the code and leave the "en: "  section empty/ or didnt make one, as You suggested. The window will be empty as well

                                 

                                But still here is the code... i use it the end of two (CTRL+C/CTRL+V same code!!) simple jsx file, one of tham is working and one of tham it isnt.

                                 

                                $.locale = "hu";
                                
                                var box = new Window('dialog', 'Uzenet:',undefined);
                                box.bounds = {x:300, y:300, width:300, height:300};
                                
                                box.panel = box.add('panel', {x:10, y:10, width:280, height:280},);
                                
                                btnText = { hu: "Kiválasztottuk neked az ecset eszközt.\rKezdj el festeni vele ahol szeretnéd az élesítést viszont látni!", en: "Kiválasztottuk neked az ecset eszközt.\rKezdj el festeni vele ahol szeretnéd az élesítést viszont látni!", fr: "Oui" };
                                box.msge = box.panel.add('statictext', {x:40, y:60, width:200, height:70}, localize(btnText), {multiline: true});
                                
                                box.show();
                                

                                 

                                with this code at the end in one file:

                                2015-09-09_133450.jpg

                                and the SAME CODE :-) at the end another file:

                                 

                                2015-09-09_133510.jpg

                                 

                                i guess this is some bug... and the solution will be somewhere else :-)

                                • 13. Re: Photoshop scripting UI image or icon
                                  Pedro Cortez Marques Level 3

                                  Hi

                                  What photoshop version have you? I'm using 15.2.2 (CS2014)

                                   

                                   

                                  If you use only {hu:"igen",en:"yes",fr:"oui"} directly without localize(), then you need to set in the begining $.localize=true

                                  Where is why on Page 104:

                                  //Only works if the $.localize=true

                                  b1 = w.add ("button", undefined, btnText);

                                  //Always works, regardless of $.localize value

                                  b1 = w.add ("button", undefined, localize (btnText));

                                   

                                   

                                  Regarding the other problem you have, I haven't been able to detect it on my computers.

                                  It seams to be an encoding problem I had 2 or 3 years ago with CS6 version and it desapear when we have installed the creative cloud but keeping CS6.

                                  The only thing about that I can give advice is to build your UI layout using Automatic layout. Adobe suggest it on page 104 (Automatic layout on page 86/87).

                                  "When your script uses localization to provide language-appropriate strings for user-interface elements, it

                                  should also take advantage of the << Automatic layout >> feature. The layout manager can determine the best

                                  size for each user-interface element based on its localized text value, automatically adjusting the layout

                                  of your script-defined dialogs to allow for the varying widths of strings for different languages."

                                   

                                   

                                  I will use this to build your window with automatic layout, but if you have more questions regarding automatic layout, please create another new post, because it is another new different subject:

                                  If you test this changing $.locale to each language at a time, the width and height of the panel will automatically adapt it self. $  .locale = "en";

                                   

                                  $.locale = "en";
                                  
                                  var box = new Window('dialog', 'Uzenet:',undefined);
                                  box.margins = 0; // if not used, default = [15,15,15,15]
                                  box.spacing = 10; // space between children elements -  if not used, default = 15
                                  
                                  var G1 = box.add('group', undefined);
                                  G1.margins = [10,10,10,20]; // if not used, default = [0,0,0,0] = 0
                                  G1.spacing = 20; // group space between children elements - if not used, default = 10
                                  G1.orientation="column";
                                  
                                  btnText = { hu: "Kiválasztottuk neked az ecset eszközt.\
                                  Kezdj el festeni vele ahol szeretnéd az élesítést viszont látni!", en: "Kiválasztottuk neked az ecset eszközt.\
                                  Kezdj el festeni vele\
                                  ahol szeretnéd az \
                                  élesítést \
                                  viszont látni!", fr: "Oui" };
                                  
                                  G1.msge = G1.add('statictext', undefined, localize(btnText), {multiline: true});
                                  
                                  G1.bt = G1.add('button', undefined, localize({hu:"zár",en:"close",fr:"terminer"}));
                                  G1.bt.onClick = function() {
                                      box.close();
                                  }
                                  
                                  box.show();
                                  
                                  • 14. Re: Photoshop scripting UI image or icon
                                    photogyulai Level 1

                                    okay Pedro thanks again!

                                     

                                    I guess i give it up >> i tried this very last code of you.

                                    i worked perfectly until i put the "main script" above it.

                                     

                                    Than it goes again like >> @]ĐFed&x ... jibberish

                                     

                                    I use ps cc2014.  I dont understand, but i will test it on other computers!

                                     

                                    All my best!