ExtendScript: Set image in ScriptUI dialog with custom size

Explorer ,
Feb 22, 2021

Copy link to clipboard

Copied

I have a scriptUI dialog that pops up and shows a list of file paths of images that exist in a directory. My goal is to make it so that a user can click on an item in the list which would trigger an event to set an existing ScriptUIImage object (that is already displaying an image) to show the selected image within the same dialog. In fact, I already figured this out and got it working with a single line of code, but thanks to a limitation, the size of the image cannot be set because the size property of a ScriptUIImage object is read-only for whatever reason. This means that each image displayed usually takes up the entire screen because they never get automatically resized to fit nicely inside the ScripUI dialog box. So I did some more digging and found some other methods that in theory should allow me to set the size of an image in ScriptUI, although I could be wrong.

 

I already have everything working execept where I actually set the ScriptUIImage object to an image. I'm pretty sure I'm having a syntax issue or similar based on the error I get when I run the script, but the error message is too ambiguous to figure out what the real error actually is.

 

For reference, I've been following this documentation:

https://www.adobe.com/content/dam/acom/en/devnet/scripting/estk/javascript_tools_guide.pdf

 

If you do CTRL+F search then you can follow along somewhat with the following:

I've been trying to use "ScriptUIImage object", "newImage()", and "drawImage()".

Below is what I have so far, but it leads to this error:

Error 32: Cannot execute.

No matter what arguments I provide for drawImage(...) I get that error. The documentation doesn't help with this very much.

 

I provided a condensed version of the dialog so you can just copy paste it if you need to and it should just work. All the problems I'm having are under "// GRP_PROOFPREVIEW", where the actual logic begins where I set the image file path.

 

var proofVer = new Window("dialog", undefined, undefined, {closeButton: false}); 
  proofVer.text = "Choose Proof Version"; 
  proofVer.orientation = "column"; 
  proofVer.alignChildren = ["center","center"]; 
  proofVer.spacing = 25; 
  proofVer.margins = [30,20,30,20]; 
  
  var label = proofVer.add("statictext", undefined, undefined, {name: "label"}); 
  label.text = "Choose a new PDF/JPG version to save this new proof as, or overwrite an old version..."; 
  label.alignment = ["center","center"]; 
  
  // USEROPTIONS
  // ===========
  var userOptions = proofVer.add("group", undefined, {name: "userOptions"}); 
  userOptions.orientation = "row"; 
  userOptions.alignChildren = ["center","top"]; 
  userOptions.spacing = 15; 
  userOptions.margins = 0; 

  // GRP_PROOFPREVIEW
  // ================
  var grp_proofPreview = userOptions.add("group", undefined, {name: "grp_proofPreview"}); 
  grp_proofPreview.preferredSize.width = 200; 
  grp_proofPreview.preferredSize.height = 200; 
  grp_proofPreview.orientation = "row"; 
  grp_proofPreview.alignChildren = ["left","center"]; 
  grp_proofPreview.spacing = 10; 
  grp_proofPreview.margins = 0; 
  grp_proofPreview.alignment = ["center","center"]; 

  var img = "C:/path/to/image/image.jpg"
  var scriptUIImageObject = ScriptUI.newImage(img, img, img, img)
  var proofPreview = grp_proofPreview.add("image", undefined, scriptUIImageObject, {name: "proofPreview"}); 
  proofPreview.graphics.drawImage(scriptUIImageObject, 0, 0)

proofVer.show();

 

TOPICS
How to, Scripting

Views

54

Likes

Translate

Translate

Report

Report
Reply
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

1 Correct Answer

Adobe Community Professional , Feb 22, 2021
Silly-V Adobe Community Professional , Feb 22, 2021
Have you tried using @Marc Autret 's image-resizing prototype technique?https://community.adobe.com/t5/indesign/scaling-images-with-scriptui/m-p/3341201   Image.prototype.onDraw = function() { // written by Marc Autret // "this" is the container; "this.image" is the graphic if( !this.image ) return; var WH = this.size, wh = this.image.size, k = Math.min(WH[0]/wh[0], WH[1]/wh[1]), xy; // Resize proportionally: wh = [k*wh[0],k*wh[1]]; // Center: xy = [ (WH[0]-wh[0])/2...

Likes

Translate

Translate
Jump to answer Jump to answer
Adobe Community Professional ,
Feb 22, 2021

Copy link to clipboard

Copied

Have you tried using @Marc Autret 's image-resizing prototype technique?
https://community.adobe.com/t5/indesign/scaling-images-with-scriptui/m-p/3341201

 

Image.prototype.onDraw = function()
{ // written by Marc Autret
   // "this" is the container; "this.image" is the graphic
   if( !this.image ) return;
   var WH = this.size,
   wh = this.image.size,
   k = Math.min(WH[0]/wh[0], WH[1]/wh[1]),
   xy;
   // Resize proportionally:
   wh = [k*wh[0],k*wh[1]];
   // Center:
   xy = [ (WH[0]-wh[0])/2, (WH[1]-wh[1])/2 ];
   this.graphics.drawImage(this.image,xy[0],xy[1],wh[0],wh[1]);
   WH = wh = xy = null;
}

Likes

Translate

Translate

Report

Report
Reply
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
ariffjeff AUTHOR LATEST
Explorer ,
Feb 22, 2021

Copy link to clipboard

Copied

Thanks! It seems to be working. I got my image to be the correct size and position. Although my issue now is that the container it's in is still ginormous and is pushing all other dialog elements off the screen. I tried setting it to no avail but I didn't have much time to test it. I'll have to try again tomorrow. Thanks again!

Likes

Translate

Translate

Report

Report
Reply
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more