Help/GUI/EZ-GUI/EZListView.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3 <head>
   4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   5 <meta http-equiv="Content-Style-Type" content="text/css">
   6 <title></title>
   7 <meta name="Generator" content="Cocoa HTML Writer">
   8 <meta name="CocoaVersion" content="949.54">
   9 <style type="text/css">
  10 p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica}
  11 p.p2 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica; min-height: 14.0px}
  12 p.p3 {margin: 0.0px 0.0px 0.0px 0.0px; font: 9.0px Monaco; min-height: 12.0px}
  13 p.p4 {margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Helvetica}
  14 p.p5 {margin: 0.0px 0.0px 0.0px 57.0px; text-indent: -57.0px; font: 9.0px Monaco; min-height: 12.0px}
  15 p.p6 {margin: 0.0px 0.0px 0.0px 57.0px; text-indent: -57.0px; font: 12.0px Helvetica}
  16 p.p7 {margin: 0.0px 0.0px 0.0px 57.0px; text-indent: -57.0px; font: 12.0px Helvetica; min-height: 14.0px}
  17 p.p8 {margin: 0.0px 0.0px 0.0px 85.0px; text-indent: -85.0px; font: 12.0px Helvetica}
  18 p.p9 {margin: 0.0px 0.0px 0.0px 85.0px; text-indent: -85.0px; font: 12.0px Helvetica; min-height: 14.0px}
  19 p.p10 {margin: 0.0px 0.0px 0.0px 57.0px; text-indent: -57.0px; font: 9.0px Monaco}
  20 p.p11 {margin: 0.0px 0.0px 0.0px 57.0px; text-indent: -57.0px; font: 9.0px Monaco; color: #bf0000}
  21 p.p12 {margin: 0.0px 0.0px 0.0px 57.0px; text-indent: -57.0px; font: 9.0px Monaco; color: #606060}
  22 p.p13 {margin: 0.0px 0.0px 0.0px 0.0px; font: 9.0px Monaco}
  23 p.p14 {margin: 0.0px 0.0px 0.0px 57.0px; text-indent: -57.0px; font: 14.0px Helvetica}
  24 span.s1 {font: 18.0px Helvetica}
  25 span.s2 {color: #0000bf}
  26 span.s3 {font: 11.0px Monaco}
  27 span.s4 {color: #000000}
  28 span.s5 {color: #007300}
  29 span.s6 {color: #606060}
  30 span.s7 {color: #bf0000}
  31 span.Apple-tab-span {white-space:pre}
  32 </style>
  33 </head>
  34 <body>
  35 <p class="p1"><span class="s1"><b>EZListView<span class="Apple-tab-span">       </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span></b></span><b>a wrapper class for a label plus a listView with per item actions</b><span class="s1"><b><span class="Apple-tab-span">     </span></b></span></p>
  36 <p class="p2"><br></p>
  37 <p class="p1"><b>Inherits from: </b><a href="../../Core/Object.html"><span class="s2"><b>Object</b></span></a><b> : </b><a href="EZGui.html"><span class="s2"><b>EZGui</b></span></a><b> : </b><a href="EZLists.html"><span class="s2"><b>EZLists</b></span></a></p>
  38 <p class="p3"><br></p>
  39 <p class="p1">EZListView is wrapper class which creates an (optional) label and a listView. It includes per item actions as well as a global action which are both evaluated upon selection of an item. Convenience methods for inserting and deleting list items are also included . If the parent is nil, then EZListView will create its own window. See <a href="EZGui.html"><span class="s2">EZGui</span></a> and <a href="EZLists.html"><span class="s2">EZLists</span></a> for all of the options.</p>
  40 <p class="p2"><br></p>
  41 <p class="p1"><b>See also:</b> <a href="../Main-GUI/ListView.html"><span class="s2">ListView</span></a></p>
  42 <p class="p2"><br></p>
  43 <p class="p4"><b>Some Important Issues Regarding EZListView</b></p>
  44 <p class="p2"><br></p>
  45 <p class="p1">The convenience methods for EZListView require that the items array is an array of associations of labels and functions, not like in <a href="../Main-GUI/ListView.html"><span class="s2">ListView</span></a>, where items is simply an array of strings. If <b>label</b> is nil, then no staticText is created.<span class="Apple-converted-space"> </span></p>
  46 <p class="p2"><br></p>
  47 <p class="p4"><b>Creation / Class Methods</b></p>
  48 <p class="p5"><br></p>
  49 <p class="p6"><b><span class="Apple-tab-span">  </span>*new (parentView, bounds, label, items, globalAction, initVal, initAction, labelWidth, labelHeight,layout,gap)</b></p>
  50 <p class="p7"><b><span class="Apple-tab-span">  </span></b></p>
  51 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>parent </b>- The parent view or window. If the parent is nil, then EZListView will create its own <a href="../Main-GUI/Window.html"><span class="s2">Window</span></a>, and place it conveniently on the screen if the bounds are a <a href="../../Geometry/Point.html"><span class="s2">Point</span></a>. If the bounds are a <a href="../../Geometry/Rect.html"><span class="s2">Rect</span></a>, then the Rect determines the window bounds.</p>
  52 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>bounds </b>- An instance of <a href="../../Geometry/Rect.html"><span class="s2">Rect</span></a> or <a href="../../Geometry/Point.html"><span class="s2">Point</span></a>. Default value is <span class="s3">160@200</span>.</p>
  53 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>label </b>- The label. Default value is nil. If nil, then no StaticText is created.<span class="Apple-converted-space"> </span></p>
  54 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>items </b>- Default value is nil. An Array of <a href="../../Collections/Association.html"><span class="s2">Association</span></a>s ['label' -&gt; {arg listObj; value}, ].Or and Array Symbols (if you are only using <b>globalAction</b>).</p>
  55 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>globalAction </b>- a Global function to be performed in addition to the item functions {arg listObj; value}.</p>
  56 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>initVal </b>- Initial <b>value</b> of the List, i.e. the index selected. Default value is 0.</p>
  57 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>initAction </b>- An instance of <a href="../../Core/Boolean.html"><span class="s2">Boolean</span></a>. Performs the action at <b>initVal</b> on creation of the list, plus the <b>globalAction</b>. Default value is false.</p>
  58 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>labelWidth </b>- Default value is 80. Not used if <b>layout</b> is \vert.</p>
  59 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>labelHeight </b>- Default value is 20. Not used if <b>layout</b> is \horz.</p>
  60 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>layout</b>- \vert or \horz. default is vert;</p>
  61 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>gap </b>- A <a href="../../Geometry/Point.html"><span class="s2">Point</span></a>. By default, the view tries to get its parent's gap, otherwise it defaults to 2@2. Setting it overrides these.</p>
  62 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>margin </b>- A <a href="../../Geometry/Point.html"><span class="s2">Point</span></a>. This will inset the bounds occupied<span class="Apple-converted-space">  </span>by the subviews of view.</p>
  63 <p class="p9"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span></p>
  64 <p class="p7"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span></p>
  65 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>(</p>
  66 <p class="p11"><span class="s4"><span class="Apple-tab-span">   </span><span class="Apple-tab-span">    </span></span>// default with vertical layout</p>
  67 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>w=<span class="s2">Window</span>.new.front;</p>
  68 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>w.view.decorator = <span class="s2">FlowLayout</span>(w.view.bounds);</p>
  69 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>g = <span class="s2">EZListView</span>.new(w,</p>
  70 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>230@230,</p>
  71 <p class="p12"><span class="s4"><span class="Apple-tab-span">   </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span></span>"An ListView:"<span class="s4">,</span></p>
  72 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>[<span class="Apple-tab-span">   </span></p>
  73 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="s5">\item0</span> -&gt;{<span class="s2">|a|</span> (<span class="s6">"this is item 0 of "</span> ++ a).postln},</p>
  74 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="s5">\item1</span> -&gt;{<span class="s2">|a|</span> (<span class="s6">"this is item 1 of "</span> ++ a).postln},</p>
  75 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="s5">\item2</span> -&gt;{<span class="s2">|a|</span> (<span class="s6">"this is item 2 of "</span> ++ a).postln},</p>
  76 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>],</p>
  77 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>globalAction: {<span class="s2">|a|</span> (<span class="s6">"this is a global action of "</span>++a.asString ).postln},</p>
  78 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>initVal: 2,</p>
  79 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>initAction: <span class="s2">true</span>,</p>
  80 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>labelWidth: 120,</p>
  81 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>labelHeight: 16,</p>
  82 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>layout: <span class="s5">\vert</span>,</p>
  83 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>gap: 2@2</p>
  84 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>);</p>
  85 <p class="p5"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span></p>
  86 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>)</p>
  87 <p class="p5"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span></p>
  88 <p class="p11"><span class="s4"><span class="Apple-tab-span">   </span><span class="Apple-tab-span">    </span></span>// or a more simple syntax (uses decorator gap settings):</p>
  89 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>(</p>
  90 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>w=<span class="s2">Window</span>.new.front;</p>
  91 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>w.view.decorator = <span class="s2">FlowLayout</span>(w.view.bounds);</p>
  92 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>g = <span class="s2">EZListView</span>.new(w,200@230, <span class="s6">" List:"</span>);</p>
  93 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>g.addItem(<span class="s5">\item0</span>, {<span class="s2">|a|</span> (<span class="s6">"this is item 0 of "</span> ++ a).postln});</p>
  94 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>g.addItem(<span class="s5">\item1</span>, {<span class="s2">|a|</span> (<span class="s6">"this is item 1 of "</span> ++ a).postln});</p>
  95 <p class="p10"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>g.addItem(<span class="s5">\item2</span>, {<span class="s2">|a|</span> (<span class="s6">"this is item 2 of "</span> ++ a).postln});</p>
  96 <p class="p13"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>g.setColors(<span class="s2">Color</span>.grey,<span class="s2">Color</span>.white);</p>
  97 <p class="p13"><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span>)</p>
  98 <p class="p3"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span></p>
  99 <p class="p14"><b>Changing Appearance</b></p>
 100 <p class="p2"><span class="Apple-tab-span">     </span></p>
 101 <p class="p6"><b><span class="Apple-tab-span">  </span>setColors(stringBackground,stringColor,listBackground,listStringColor,</b></p>
 102 <p class="p6"><b><span class="Apple-tab-span">  </span><span class="Apple-tab-span">    </span>selectedStringColor,hiliteColor,background)</b></p>
 103 <p class="p7"><b><span class="Apple-tab-span">  </span></b></p>
 104 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>stringBackground </b>- An instance of <a href="../GUI-Tools/Color.html"><span class="s2">Color</span></a>. The <b>background</b> of the label and unit views.</p>
 105 <p class="p8"><b><span class="Apple-tab-span">  </span><span class="Apple-tab-span">    </span>stringColor </b>- An instance of <a href="../GUI-Tools/Color.html"><span class="s2">Color</span></a>. The <b>stringColor</b> of the label and unit views.</p>
 106 <p class="p8"><b><span class="Apple-tab-span">  </span><span class="Apple-tab-span">    </span>listBackground </b>- An instance of <a href="../GUI-Tools/Color.html"><span class="s2">Color</span></a>. The <b>background</b> of the list view.</p>
 107 <p class="p8"><b><span class="Apple-tab-span">  </span><span class="Apple-tab-span">    </span>listStringColor </b>- An instance of <a href="../GUI-Tools/Color.html"><span class="s2">Color</span></a>. The <b>stringColor</b> of the list view.</p>
 108 <p class="p8"><b><span class="Apple-tab-span">  </span><span class="Apple-tab-span">    </span>selectedStringColor </b>- An instance of <a href="../GUI-Tools/Color.html"><span class="s2">Color</span></a>. The <b>selectedStringColor</b> of the listView.</p>
 109 <p class="p8"><b><span class="Apple-tab-span">  </span><span class="Apple-tab-span">    </span>hiliteColor </b>- An instance of <a href="../GUI-Tools/Color.html"><span class="s2">Color</span></a>. The <b>hiliteColor</b> of the list view.</p>
 110 <p class="p8"><b><span class="Apple-tab-span">  </span><span class="Apple-tab-span">    </span>background </b>- An instance of <a href="../GUI-Tools/Color.html"><span class="s2">Color</span></a>. The <b>background</b> of the list view.</p>
 111 <p class="p9"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span></p>
 112 <p class="p6"><b><span class="Apple-tab-span">  </span>font_(font)</b></p>
 113 <p class="p6"><b><span class="Apple-tab-span">  </span><span class="Apple-tab-span">    </span></b>Set the Font used by all the views.</p>
 114 <p class="p8"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><b>font </b>- An instance of <a href="../Main-GUI/Font.html"><span class="s2">Font</span></a>.<span class="Apple-converted-space"> </span></p>
 115 <p class="p5"><br></p>
 116 <p class="p3"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span></p>
 117 <p class="p4"><b>Examples</b></p>
 118 <p class="p7"><span class="Apple-tab-span">     </span></p>
 119 <p class="p11">// Creates its own window if parent is nil:</p>
 120 <p class="p10">(</p>
 121 <p class="p10">g = <span class="s2">EZListView</span>.new(label: <span class="s6">" My PopUp List: "</span>);</p>
 122 <p class="p10">g.addItem(<span class="s5">\item0</span>, {<span class="s6">"this is item 0"</span>. postln});</p>
 123 <p class="p10">g.addItem(<span class="s5">\item1</span>, {<span class="s6">"this is item 1"</span>. postln});</p>
 124 <p class="p13">g.addItem(<span class="s5">\item2</span>, {<span class="s6">"this is item 2"</span>. postln});</p>
 125 <p class="p13">g.setColors(<span class="s2">Color</span>.grey,<span class="s2">Color</span>.white);</p>
 126 <p class="p3"><br></p>
 127 <p class="p13">)</p>
 128 <p class="p3"><br></p>
 129 <p class="p11">// Layout horizontal:</p>
 130 <p class="p10">(</p>
 131 <p class="p10">g = <span class="s2">EZListView</span>.new(<span class="s2">nil</span>,205@180, <span class="s6">"Choose One: "</span>, layout:<span class="s5">\horz</span>);</p>
 132 <p class="p10">10.do{<span class="s2">|i|</span> g.addItem(<span class="s6">"item"</span>++i.asString, {(<span class="s6">"this is item"</span> ++i.asString). postln})};</p>
 133 <p class="p13">g.setColors(<span class="s2">Color</span>.grey,<span class="s2">Color</span>.white);</p>
 134 <p class="p13">)</p>
 135 <p class="p3"><br></p>
 136 <p class="p11">// No labelView created, so set the window title;</p>
 137 <p class="p10">(</p>
 138 <p class="p10">g = <span class="s2">EZListView</span>.new(bounds:200@230); <span class="s7">// no label</span></p>
 139 <p class="p10">12.do{<span class="s2">|i|</span> g.addItem(<span class="s6">"item"</span>++i.asString, {(<span class="s6">"this is item"</span> ++i.asString). postln})};</p>
 140 <p class="p13">g.view.parent.findWindow.name=<span class="s6">" choose item"</span>;</p>
 141 <p class="p13">)</p>
 142 <p class="p7"><span class="Apple-tab-span">     </span></p>
 143 <p class="p11">// insert item;</p>
 144 <p class="p10">(</p>
 145 <p class="p10">g = <span class="s2">EZListView</span>.new(<span class="s2">nil</span>,200@200, <span class="s6">"List:"</span>);</p>
 146 <p class="p13">g.addItem(<span class="s5">\item0</span>, {<span class="s6">"this is item 0"</span>. postln});</p>
 147 <p class="p13">g.addItem(<span class="s5">\item1</span>, {<span class="s6">"this is item 1"</span>. postln});</p>
 148 <p class="p13">g.addItem(<span class="s5">\item2</span>, {<span class="s6">"this is item 2"</span>. postln});</p>
 149 <p class="p13">g.addItem(<span class="s5">\item4</span>, {<span class="s6">"this is item 4"</span>. postln});</p>
 150 <p class="p13">)</p>
 151 <p class="p3"><br></p>
 152 <p class="p13">g.insertItem(3, <span class="s5">\item3</span>, {<span class="s6">"this is item 3"</span>. postln});</p>
 153 <p class="p7"><span class="Apple-tab-span">     </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span><span class="Apple-tab-span">    </span></p>
 154 <p class="p11">// remove item;</p>
 155 <p class="p10">(</p>
 156 <p class="p10">g = <span class="s2">EZListView</span>.new(<span class="s2">nil</span>,200@200, <span class="s6">"List:"</span>);</p>
 157 <p class="p13">g.addItem(<span class="s5">\item0</span>, {<span class="s6">"this is item 0"</span>. postln});</p>
 158 <p class="p13">g.addItem(<span class="s5">\item1</span>, {<span class="s6">"this is item 1"</span>. postln});</p>
 159 <p class="p13">g.addItem(<span class="s5">\item2</span>, {<span class="s6">"this is item 2"</span>. postln});</p>
 160 <p class="p13">g.addItem(<span class="s5">\item4</span>, {<span class="s6">"this is item 4"</span>. postln});</p>
 161 <p class="p13">g.insertItem(3, <span class="s5">\item3</span>, {<span class="s6">"this is item 3"</span>. postln});</p>
 162 <p class="p13">)</p>
 163 <p class="p3"><br></p>
 164 <p class="p13">g. removeItemAt(1);</p>
 165 <p class="p7"><br></p>
 166 <p class="p7"><br></p>
 167 <p class="p7"><br></p>
 168 <p class="p11">// replace item;</p>
 169 <p class="p10">(</p>
 170 <p class="p10">g = <span class="s2">EZListView</span>.new(<span class="s2">nil</span>,200@200, <span class="s6">"List:"</span>);</p>
 171 <p class="p13">g.addItem(<span class="s5">\item0</span>, {<span class="s6">"this is item 0"</span>. postln});</p>
 172 <p class="p13">g.addItem(<span class="s5">\item1</span>, {<span class="s6">"this is item 1"</span>. postln});</p>
 173 <p class="p13">g.addItem(<span class="s5">\item2</span>, {<span class="s6">"this is item 2"</span>. postln});</p>
 174 <p class="p13">g.addItem(<span class="s5">\item3</span>, {<span class="s6">"this is item 3"</span>. postln});</p>
 175 <p class="p13">)</p>
 176 <p class="p3"><br></p>
 177 <p class="p13">g.replaceItemAt(2, <span class="s5">\item2_replaced</span>, {<span class="s6">"this is item 2 replaced"</span>. postln});</p>
 178 <p class="p3"><br></p>
 179 <p class="p7"><br></p>
 180 </body>
 181 </html>