Adding a scrollbar to the panel

Engaged ,
Jul 27, 2022 Jul 27, 2022

Copy link to clipboard

Copied

Hello everybody!
I'm trying to create a dialog box to display all the items in an array, however,
I need to add a scroll bar to the "pn_rows" panel of my script when it reaches a number of 10 lines, so I can prevent the dialog box from gaining a gigantic proportion in its height.
Please any help is appreciated. thank you

var dlg = new Window ("dialog");
var pn_main = dlg.add ("panel {orientation: 'column'}");
pn_main.spacing =0; pn_main.margins =0;

svc =  pn_main.add("group"); svc.spacing=0;
svc.margins = [0,5,0,0]; dimH=[0,0,100,20];
svc.add("statictext", dimH, " SERVIÇO");
svc.add("statictext", dimH, "TAMANHO");
svc.add("statictext", dimH, "QUANT.");
svc.add("statictext", dimH, "VALOR");
svc.graphics.backgroundColor =  dlg.graphics.newBrush(  dlg.graphics.BrushType.SOLID_COLOR,[0.24172973632812,0.42996215820312,0.66275024414062], 1);
svc.graphics.foregroundColor = svc.graphics.newPen (dlg.graphics.PenType.SOLID_COLOR, [0.92941284179688,0.92941284179688,0.92941284179688], 1);
for(i = 0; i < svc.children.length; i++) svc.children[i].graphics.font = ScriptUI.newFont ("Arial", 'BOLD', 13);

pn_rows = pn_main.add("panel", undefined, undefined, {name: "pn_rows"}); pn_rows.text = ""; 
pn_rows.orientation = "column";     
pn_rows.spacing =0;  pn_rows.margins = 0; 

servico = [
    "REVELAÇÃO:40X50:2:R$ 25.00", 
    "REVELAÇÃO:70x80:5:R$ 90.00", 
    "MOLDURA:20X30:1:R$ 5.00", 
    "REVELAÇÃO:40X50:2:R$ 25.00", 
    "REVELAÇÃO:70x80:5:R$ 90.00", 
    "MOLDURA:20X30:1:R$ 5.00", 
    "REVELAÇÃO:40X50:2:R$ 25.00", 
    "REVELAÇÃO:70x80:5:R$ 90.00", 
    "MOLDURA:20X30:1:R$ 5.00", 
    "REVELAÇÃO:40X50:2:R$ 25.00", 
    "REVELAÇÃO:70x80:5:R$ 90.00", 
    "MOLDURA:20X30:1:R$ 5.00", 
];

alert(servico.length);

for (var i=0;i< servico.length;i++){
  serv = servico[i];
  try{
       serv1 = serv.split(":")[0];
       serv2 = serv.split(":")[1];
       serv3 = serv.split(":")[2];
       serv4 = serv.split(":")[3];
      }
  catch(e){}
  addServico(pn_rows, serv1, serv2, serv3, serv4); 
}

dlg.show ();

function addServico(pn_rows, row1, row2, row3, row4) {
    group  =  pn_rows.add("group"); group .spacing=0;
    group.margins = [0,0,0,0]; dimH=[0,0,100,20];
    group.add("statictext", dimH, row1);
    group.add("statictext", dimH, row2);
    group.add("statictext", dimH, row3);
    group.add("statictext", dimH, row4);

    var bg = [i]; 
    bgColor = [0.3647058823529412, 0.3647058823529412, 0.3647058823529412];
    if(bg&1){group.graphics.backgroundColor =  dlg.graphics.newBrush( dlg.graphics.BrushType.SOLID_COLOR, bgColor, 1);} 

    group.index = pn_rows.children.length - 1;
    dlg.layout.layout (true);
}
TOPICS
Actions and scripting

Views

41

Likes

Translate

Translate

Report

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

correct answers 1 Correct answer

Advocate , Jul 27, 2022 Jul 27, 2022

Likes

Translate

Translate
Advocate ,
Jul 27, 2022 Jul 27, 2022

Copy link to clipboard

Copied

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Jul 28, 2022 Jul 28, 2022

Copy link to clipboard

Copied

LATEST

@mikeb41294032  thanks for the link, there I found the solution! I will share the result here.

var dlg = new Window("dialog" , "Scroll test");
var servico = [
    "REVELAÇÃO:40X50:2:R$ 25.00", 
    "REVELAÇÃO:70x80:5:R$ 90.00", 
    "MOLDURA:20X30:1:R$ 5.00", 
    "REVELAÇÃO:40X50:2:R$ 25.00", 
    "REVELAÇÃO:70x80:5:R$ 90.00", 
    "MOLDURA:20X30:1:R$ 5.00", 
    "REVELAÇÃO:40X50:2:R$ 25.00", 
    "REVELAÇÃO:70x80:5:R$ 90.00", 
    "MOLDURA:20X30:1:R$ 5.00", 
    "REVELAÇÃO:40X50:2:R$ 25.00", 
    "REVELAÇÃO:70x80:5:R$ 90.00", 
    "MOLDURA:20X30:1:R$ 5.00", 
];

gmain = dlg.add("group", undefined, {name: "gmain"}); 
gmain.orientation = "column"; gmain.alignChildren = ["left","top"]; 
gmain.spacing = 0;  gmain.margins = 0; 

svc =  gmain.add("group"); svc.spacing=0;
svc.margins = [0,5,0,0]; dimH=[0,0,100,20];
svc.add("statictext", dimH, "   SERVIÇO");
svc.add("statictext", dimH, "TAMANHO");
svc.add("statictext", dimH, "QUANT.");
svc.add("statictext", dimH, "VALOR");
svc.graphics.backgroundColor =  dlg.graphics.newBrush(  dlg.graphics.BrushType.SOLID_COLOR,[0.24172973632812,0.42996215820312,0.66275024414062], 1);
svc.graphics.foregroundColor = svc.graphics.newPen (dlg.graphics.PenType.SOLID_COLOR, [0.92941284179688,0.92941284179688,0.92941284179688], 1);
for(i = 0; i < svc.children.length; i++) svc.children[i].graphics.font = ScriptUI.newFont ("Arial", 'BOLD', 13);

var pn_main = gmain.add("panel" , undefined , "");
pn_main.size = [420,203];

var pn_rows = pn_main.add("group");
pn_rows.orientation = "column"; pn_rows.alignment = "left";
pn_rows.spacing =0;  pn_rows.margins = 0; 
pn_rows.maximumSize.height = servico.length*100


var scrollBar = pn_main.add("scrollbar");
scrollBar.stepdelta = 10;
scrollBar.maximumSize.height = pn_main.maximumSize.height;

scrollBar.onChanging = function () {
    pn_rows.location.y = -1 * this.value;
}


for (var i=0;i< servico.length;i++){
  serv = servico[i];
  try{
       serv1 = serv.split(":")[0];
       serv2 = serv.split(":")[1];
       serv3 = serv.split(":")[2];
       serv4 = serv.split(":")[3];
      }
  catch(e){}
  addServico(pn_rows, serv1, serv2, serv3, serv4); 
}

dlg.onShow = function() {
    scrollBar.size = [13,pn_main.size.height];
    scrollBar.location = [pn_main.size.width-20, 0];
    scrollBar.maxvalue = pn_rows.size.height-pn_main.size.height+20;
    };

dlg.show();

function addServico(pn_rows, row1, row2, row3, row4) {
    group  =  pn_rows.add("group"); group .spacing=0;
    group.margins = [0,0,0,0]; dimH=[0,0,95,20];
    group.add("statictext", dimH, row1);
    group.add("statictext", dimH, row2);
    group.add("statictext", dimH, row3);
    group.add("statictext", dimH, row4);

    var bg = [i]; 
    bgColor = [0.3647058823529412, 0.3647058823529412, 0.3647058823529412];
    if(bg&1){group.graphics.backgroundColor =  dlg.graphics.newBrush( dlg.graphics.BrushType.SOLID_COLOR, bgColor, 1);} 
}

Likes

Translate

Translate

Report

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