• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

listbox selection color

Participant ,
Jan 22, 2017 Jan 22, 2017

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@

TOPICS
Scripting

Views

1.0K

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

People's Champ , Jan 24, 2017 Jan 24, 2017

Unless

Capture d’écran 2017-01-24 à 10.59.27.png

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 =

...

Votes

Translate

Translate
Community Expert ,
Jan 23, 2017 Jan 23, 2017

Copy link to clipboard

Copied

If you mean a ScriptUI listbox the answer is no, you can't change the background colour.

P.

Votes

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
Participant ,
Jan 23, 2017 Jan 23, 2017

Copy link to clipboard

Copied

noted. Thank you.

Votes

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
People's Champ ,
Jan 24, 2017 Jan 24, 2017

Copy link to clipboard

Copied

Unless

Capture d’écran 2017-01-24 à 10.59.27.png

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();

Votes

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
Community Expert ,
Jan 24, 2017 Jan 24, 2017

Copy link to clipboard

Copied

Ah, like that

Votes

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
Participant ,
Jan 24, 2017 Jan 24, 2017

Copy link to clipboard

Copied

LATEST

wow wow.. really cool.. 

(Thumbs up)

Votes

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