Copy link to clipboard
Copied
hi..
How to change the listbox selection to red using JS? ( meaning the selected item's background in the list to be displayed in red to be more prominent.)
Thanks much..
cheers@
Unless
...var main = function() {
UI().show();
}
var data = [];
var i = 0, n = 200;
while ( i<n ) {
data.push({text:i+1});
i++;
}
var UI = function() {
var w = new Window('dialog' ),
list;
w.preferredSize = [200,250];
w.alignChildren = ["fill","fill"]
list = new List();
w.onShow = function() {
list.add(w, 200);
list.fill ( listItemRenderer, data );
w.layout.layout(true)
}
return w;
}
var listItemRenderer = function (parent, data ) {
var g = parent.add('group'),
red = g.add('group'),
inGp =
Copy link to clipboard
Copied
If you mean a ScriptUI listbox the answer is no, you can't change the background colour.
P.
Copy link to clipboard
Copied
noted. Thank you.
Copy link to clipboard
Copied
Unless
var main = function() {
UI().show();
}
var data = [];
var i = 0, n = 200;
while ( i<n ) {
data.push({text:i+1});
i++;
}
var UI = function() {
var w = new Window('dialog' ),
list;
w.preferredSize = [200,250];
w.alignChildren = ["fill","fill"]
list = new List();
w.onShow = function() {
list.add(w, 200);
list.fill ( listItemRenderer, data );
w.layout.layout(true)
}
return w;
}
var listItemRenderer = function (parent, data ) {
var g = parent.add('group'),
red = g.add('group'),
inGp = g.add('group'),
t = inGp.add('edittext', undefined, data.text ),
b = inGp.add('button',undefined,"?" );
g.orientation = 'stack';
red.alignment = ["fill","fill"];
inGp.alignment = ["fill","top"];
t.preferredSize.width = 100;
b.maximumSize.width = 25;
t.alignment = ["fill","top"];
red.visible = false;
var paintItem = function(o,c){
var r = (c && typeof(c.r)=='number' )? c.r : Math.round ( Math.random()*10 )/10;
var g = (c && typeof(c.g)=='number')? c.g: Math.round ( Math.random()*10 )/10;
var b = (c && typeof(c.b)=='number')? c.b : Math.round ( Math.random()*10 )/10;
o.graphics.backgroundColor = o.graphics.newBrush(
o.graphics.BrushType.SOLID_COLOR,[r,g,b], 1
);
};
paintItem ( red, {r:1,g:0,b:0} );
b.onClick = function() {
alert( t.text );
};
g.update = function( data ) {
t.text = data.text;
}
g.addEventListener ( 'mouseover', onMouseOver );
g.addEventListener ( 'mouseout', onMouseOut );
function onMouseOver(evt) {
red.visible = true;
}
function onMouseOut(evt) {
red.visible = false;
}
return g;
}
var List = function() {
var max = 12, pnl, lstGp, sb, ls = this, sbValue = 0, itemHeight, index = 0, mul = 1,
index = 0;
this.listItems = [];
this.data;
this.add = function(parent, maxSize) {
pnl = parent.add('panel');
pnl.alignment = ["fill","fill"];
pnl.orientation = 'row';
pnl.maximumSize.height = maxSize;
lstGp =pnl.add ('group');
lstGp.orientation = 'column';
sb = pnl.add ('scrollbar');
lstGp.spacing = 0;
lstGp.margins = 0;
lstGp.alignment = ["fill","fill"];
sb.alignment = ["fill","fill"];
sb.maximumSize.width = 25;
sb.onChange = function() {
itemHeight = ls.listItems[0].size.height;
var sbHeight = sb.size.height, i = 0;
sb.maxvalue=itemHeight*ls.data.length - sb.size.height ;
var n = ls.listItems.length, movedBefore = [], movedAfter = [], notMoved = [];
var delta = sbValue - sb.value;
sbValue = sb.value;
var itemsCount = index+Math.floor(sb.size.height/(itemHeight+lstGp.spacing))+1 ;
while ( i<n ) {
if (delta<0 && ls.listItems [ i ].location[1] + delta + itemHeight +2*lstGp.spacing < 0 ) {
ls.listItems [ i ].location[1] = ls.listItems [ i ].location[1] + delta+ max*itemHeight;
ls.listItems [ i ].index = ls.listItems [ i ].index || i;
ls.listItems [ i ].index+=max;
ls.listItems [ i ].update( {text:ls.listItems [ i ].index+1} );
}
else if (delta>0 && ls.listItems [ i ].location[1]+delta>ls.listItems [ i ].parent.location[1]+ls.listItems [ i ].parent.size.height ) {
ls.listItems [ i ].location[1] = ls.listItems [ i ].location[1] + delta-max*itemHeight;
ls.listItems [ i ].index && ls.listItems [ i ].index-=max;
ls.listItems [ i ].update( {text:ls.listItems [ i ].index+1} );
}
else {
ls.listItems [ i ].location[1]+=delta;
}
i++;
}
}
};
this.fill = function ( itemRenderer, data ) {
var i = 0, n =0;
this.data = data;
if ( !itemRenderer
|| !(itemRenderer instanceof Function)
|| !data
|| !(data instanceof Array)
|| !data.length ) {
List.isReady = false;
}
n = data.length;
while ( i<n ) {
i< max && ls.listItems = itemRenderer (lstGp, data );
i++;
}
List.isReady = true;
};
}
main();
Copy link to clipboard
Copied
Ah, like that
Copy link to clipboard
Copied
wow wow.. really cool..
(Thumbs up)