Skip navigation
Currently Being Moderated

ScriptUI stroking a field

Mar 28, 2012 4:29 PM

Hi,

 

I need to red stroke fields. Inspite of the doc and this great thread : http://forums.adobe.com/message/4215908#4215908,

I can't get it working

 

 

field.onDraw = function()
{
          var gx = this.graphics,
           pen = this.graphics.newPen (this.graphics.PenType.SOLID_COLOR, [1, 0, 0,1], 5);
          gx.drawOSControl();
          gx.rectPath( this.location[0] , this.location[1], this.size.width, this.size.height);
          gx.strokePath(pen);
}

 

What am I doing wrong ?

 

Best,

 

Loic

 
Replies
  • Currently Being Moderated
    Mar 30, 2012 6:28 AM   in reply to Loic_aigon

    Nice one, Loic. But remember that on the Mac and on Windows, the stacked objects are drawn in a different order. So on Windows, your script shows just a red rectangle because the edit field is placed behind the rectangle.

     

    Peter

     
    |
    Mark as:
  • Currently Being Moderated
    Mar 30, 2012 10:29 AM   in reply to Loic_aigon

    Hi Loïc,

     

    About your workaround, why don't you simply create a Group having 1px margins—this depends on the stroke weight you need—and the desired background color, then add the EditText field within?

     

    @+

    Marc

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 6, 2012 7:05 PM   in reply to Loic_aigon

    Hi Loïc,

     

    Yes, it's a Mac thing. On Mac OS, the EditText widget is subject to a specific focus ring wich automatically allocates 2 or 3 additional transparent pixels all around the field! Hence, if the control is nested within a background-colored group, that color is revealed through this additional space.

     

    From that point you need to apply two fixes:

    (1) create a white subgroup between the outer group and the EditText to make sure that the revealed background fits the EditText background;

    (2) make the EditText borderless to inhibits its own stroke.

     

    Now to the code:

     

     

    // ScriptUI EditText with custom border (Win & Mac)
    // ========================== 
     
    var STROKE_COLOR = [1,0,0],    // red
        STROKE_WEIGHT = 1,        // in pixels
        FILL_COLOR = [1,1,1],    // white
        INSET_SPACE = 3;        // in pixels -- Mac OS focus ring needs it >=3
     
    var u,
        w = new Window('dialog'),
        // ---
        gBorder = w.add('panel').add('group'),
        gSpacer = gBorder.add('group'),
        e = gSpacer.add('edittext', u, u, {borderless:true}),
        // ---
        bCancel = w.add('button', u, "Cancel"),
        // ---
        gx = w.graphics,
        SOLID_BRUSH = gx.BrushType.SOLID_COLOR;
     
    // Edit field settings
    // ---
    e.characters = 12;
    gBorder.margins = STROKE_WEIGHT;
    gBorder.graphics.backgroundColor = gx.newBrush(SOLID_BRUSH, STROKE_COLOR );
    gSpacer.margins = INSET_SPACE;
    gSpacer.graphics.backgroundColor  = e.graphics.backgroundColor = gx.newBrush(SOLID_BRUSH, FILL_COLOR );
     
    w.show();
    

     

    Hope that works.

     

    @+

    Marc

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points