Skip to main content
photogyulai
photogyulai
Inspiring
September 8, 2015
Question

How to see a preview of a UI slider in Photoshop

  • September 8, 2015
  • 2 replies
  • 1309 views

Hii !

I know it is possible to see the preview of a slider in Photshop but i didnt find any solutiion about how?!?

Im talking about scripting and ui window!

So i have made this window with an Opacity slider... and after i press OK it isallright.

And during slidemoving i see the opacity numbers changeing (at the layers palette) but not the picture!

But i wanted to see the effect imidiatelly. (during slider move or mouse button release)

Here is the code so far:

var box = new Window('dialog', 'Opacity Slider',undefined);


  box.bounds = {x:300, y:300, width:450, height:200};




  box.panel = box.add('panel', {x:10, y:10, width:430, height:180}, ''); 




  var slider = box.panel.add("slider", {x:85, y:60, width:265, height:20}, 100, 0, 100);




  slider.onChanging = function () {e.text = (Math.round(slider.value))+'%'};


slider.onChanging = function () {app.activeDocument.activeLayer.opacity = slider.value};




  box.okBtn = box.panel.add('button', {x:90, y:125, width:100, height:30}, 'Ok', {name:'ok'}); 


  box.cancelBtn = box.panel.add('button', {x:240, y:125, width:100, height:30}, 'Cancel', {name:'cancel'});




  box.cancelBtn.onClick = function() {   


    end = 0;   


    box.close();   


    } 




    box.okBtn.onClick = function() { 


  //Opacity


        app.activeDocument.activeLayer.opacity = slider.value


  box.close();


  }




box.show ()

Any help would be appreciated!

Thanks

This topic has been closed for replies.

2 replies

photogyulai
photogyulaiAuthor
Inspiring
September 11, 2015

okay i think maybe i got a solution, but no luck yet with the execution...

i guess the problem of the code is>> if i move the slider.. it start to set the opacity imidiately. (after couple of sec's or some moving of the slider the change turns very slowly...

so maybe the solution is >> only change the opacity when the mouse button is released.

I tried to fix that but im not very good in functions :-)
any ideas anybody?!?

JJMack
Community Expert
JJMackCommunity Expert
Community Expert
September 11, 2015

If the other plug-in you have is a script and does it well. If its has not be save as as JSXBIN read its code see haow it does it.

JJMack
photogyulai
photogyulaiAuthor
Inspiring
September 11, 2015

as i mentioned before: it is encrypted

JJMack
Community Expert
JJMackCommunity Expert
Community Expert
September 8, 2015

You shoulg be using the scripting forum

I do not know if you can preview it or not.  You most likely could save the current opacity first then on change of the slider change the opacity so the user could see how the change would be.  Then if the user clicks OK you would end the script. If they clicked Cancel you would restore the original opacity.

var box = new Window('dialog', 'Opacity Slider',undefined); 

  saveOpacity = app.activeDocument.activeLayer.opacity;

  box.bounds = {x:300, y:300, width:450, height:200}; 

 

  box.panel = box.add('panel', {x:10, y:10, width:430, height:180}, '');  

 

  var slider = box.panel.add("slider", {x:85, y:60, width:265, height:20}, 100, 0, 100); 

 

  slider.onChanging = function () {e.text = (Math.round(slider.value))+'%'}; 

  slider.onChanging = function () {app.activeDocument.activeLayer.opacity = slider.value; app.refresh();}; 

 

  box.okBtn = box.panel.add('button', {x:90, y:125, width:100, height:30}, 'Ok', {name:'ok'});  

  box.cancelBtn = box.panel.add('button', {x:240, y:125, width:100, height:30}, 'Cancel', {name:'cancel'}); 

 

  box.cancelBtn.onClick = function() {  

    app.activeDocument.activeLayer.opacity = saveOpacity; 

    end = 0;    

    box.close();    

    }  

 

    box.okBtn.onClick = function() {  

  //Opacity 

        //app.activeDocument.activeLayer.opacity = slider.value 

  box.close(); 

  } 

 

box.show () 

JJMack
    X
    xbytor2
    Inspiring
    September 8, 2015

      slider.onChanging = function () {e.text = (Math.round(slider.value))+'%'}; 

      slider.onChanging = function () {app.activeDocument.activeLayer.opacity = slider.value; app.refresh();}; 

    This doesn't look right. This looks righter:

      slider.onChanging = function () {

         e.text = (Math.round(slider.value))+'%'}; 

         app.activeDocument.activeLayer.opacity = slider.value; app.refresh();

      }; 

      JJMack
      Community Expert
      JJMackCommunity Expert
      Community Expert
      September 8, 2015

      Yes it does. As you know I only hack at scripting.   I though that it should be only one function but then two seemed to work.

      JJMack
      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices