Skip to main content
Inspiring
December 12, 2013
Answered

How to show Color Picker value (draw zone)

  • December 12, 2013
  • 2 replies
  • 1268 views

Hello to all

How to make a selection of Color Picker direct the user can see the selected color? In my example - the color selected by Color Picker should paint the square. Any variants ? Preferably with DOM.

var wColor= new Window('dialog', ' ');

    wColor.orientation = "column";

    wColor.alignment="top";

    wColor.spacing=0;

        wgr1=wColor.add('group');

        wgr1.orientation = 'row';

        wgr1.alignment='top';

            btnRGB1= wgr1.add('button',undefined,'RGB');

            btnRGB1.preferredSize = [50,20];

            p1 =  wgr1.add("panel", undefined, "", {borderStyle:"silver"});

            p1.preferredSize = [22,22];

        wgr2=wColor.add('group');

        wgr2.orientation = 'row';

        wgr2.alignment='top';

            btnRGB2= wgr2.add('button',undefined,'RGB');

            btnRGB2.preferredSize = [50,20];

            p2 =  wgr2.add("panel", undefined, "", {borderStyle:"silver"});

            p2.preferredSize = [22,22];

    btnRGB1.onClick = function(){//-------------------------------------------------------

        app.showColorPicker();

    }

    btnRGB2.onClick = function(){//-------------------------------------------------------

        app.showColorPicker();

    }

wColor.show()

This topic has been closed for replies.
Correct answer Chuck Uebele

Try this:

#target photoshop

var color1 = new SolidColor()

var color2 = new SolidColor()

var wColor= new Window('dialog', ' ');

    wColor.orientation = "column";

    wColor.alignment="top";

    wColor.spacing=0;

        wgr1=wColor.add('group');

        wgr1.orientation = 'row';

        wgr1.alignment='top';

            btnRGB1= wgr1.add('button',undefined,'RGB');

            btnRGB1.preferredSize = [50,20];

            p1 =  wgr1.add("panel", undefined, "", {borderStyle:"silver"});

            p1.preferredSize = [22,22];

        wgr2=wColor.add('group');

        wgr2.orientation = 'row';

        wgr2.alignment='top';

            btnRGB2= wgr2.add('button',undefined,'RGB');

            btnRGB2.preferredSize = [50,20];

            p2 =  wgr2.add("panel", undefined, "", {borderStyle:"silver"});

            p2.preferredSize = [22,22];

    btnRGB1.onClick = function(){//-------------------------------------------------------

        app.showColorPicker();

        color1.rgb.red = app.foregroundColor.rgb.red       

        color1.rgb.green= app.foregroundColor.rgb.green       

        color1.rgb.blue = app.foregroundColor.rgb.blue       

        g = p1.graphics;

        var myBrush = g.newBrush(g.BrushType.SOLID_COLOR, [color1.rgb.red/255,color1.rgb.green/255,color1.rgb.blue/255, 1]);

        g.backgroundColor = myBrush;

       

        try{app.foregroundColor = color1}

        catch(e){}

        try{app.backgroundColor = color2}

        catch(e){}

           

    }

    btnRGB2.onClick = function(){//-------------------------------------------------------

        app.showColorPicker();

        color2.rgb.red = app.foregroundColor.rgb.red       

        color2.rgb.green= app.foregroundColor.rgb.green       

        color2.rgb.blue = app.foregroundColor.rgb.blue          

        g = p2.graphics;

        var myBrush = g.newBrush(g.BrushType.SOLID_COLOR, [color2.rgb.red/255,color2.rgb.green/255,color2.rgb.blue/255, 1]);

        g.backgroundColor = myBrush;

       

        try{app.foregroundColor = color1}

        catch(e){}

        try{app.backgroundColor = color2}

        catch(e){}

    }

wColor.show()

2 replies

DBarranca
Legend
December 13, 2013

Hi,

can I ask you where does the BorderStyle: 'silver' come from?

Davide

www.davidebarranca.com

Inspiring
December 13, 2013

can I ask you where does the BorderStyle: 'silver' come from?

I don't where is comes from it has the same effect as the default borderStyle:"etched". The panel has the same appearence if you omit the borderStyle property. At least in Photoshop.

DBarranca
Legend
December 13, 2013

Snap! Silver sounded promising

Looks like the default etched to me too on Mac - I hoped to have missed an interesting property.

Davide

Chuck Uebele
Community Expert
Chuck UebeleCommunity ExpertCorrect answer
Community Expert
December 12, 2013

Try this:

#target photoshop

var color1 = new SolidColor()

var color2 = new SolidColor()

var wColor= new Window('dialog', ' ');

    wColor.orientation = "column";

    wColor.alignment="top";

    wColor.spacing=0;

        wgr1=wColor.add('group');

        wgr1.orientation = 'row';

        wgr1.alignment='top';

            btnRGB1= wgr1.add('button',undefined,'RGB');

            btnRGB1.preferredSize = [50,20];

            p1 =  wgr1.add("panel", undefined, "", {borderStyle:"silver"});

            p1.preferredSize = [22,22];

        wgr2=wColor.add('group');

        wgr2.orientation = 'row';

        wgr2.alignment='top';

            btnRGB2= wgr2.add('button',undefined,'RGB');

            btnRGB2.preferredSize = [50,20];

            p2 =  wgr2.add("panel", undefined, "", {borderStyle:"silver"});

            p2.preferredSize = [22,22];

    btnRGB1.onClick = function(){//-------------------------------------------------------

        app.showColorPicker();

        color1.rgb.red = app.foregroundColor.rgb.red       

        color1.rgb.green= app.foregroundColor.rgb.green       

        color1.rgb.blue = app.foregroundColor.rgb.blue       

        g = p1.graphics;

        var myBrush = g.newBrush(g.BrushType.SOLID_COLOR, [color1.rgb.red/255,color1.rgb.green/255,color1.rgb.blue/255, 1]);

        g.backgroundColor = myBrush;

       

        try{app.foregroundColor = color1}

        catch(e){}

        try{app.backgroundColor = color2}

        catch(e){}

           

    }

    btnRGB2.onClick = function(){//-------------------------------------------------------

        app.showColorPicker();

        color2.rgb.red = app.foregroundColor.rgb.red       

        color2.rgb.green= app.foregroundColor.rgb.green       

        color2.rgb.blue = app.foregroundColor.rgb.blue          

        g = p2.graphics;

        var myBrush = g.newBrush(g.BrushType.SOLID_COLOR, [color2.rgb.red/255,color2.rgb.green/255,color2.rgb.blue/255, 1]);

        g.backgroundColor = myBrush;

       

        try{app.foregroundColor = color1}

        catch(e){}

        try{app.backgroundColor = color2}

        catch(e){}

    }

wColor.show()