HelpSource/Classes/CompositeView.schelp

   1 class:: CompositeView
   2 redirect:: implClass
   3 summary:: A view that contains other views.
   4 categories:: GUI>Views
   5 related:: Classes/FlowView, Classes/FlowLayout
   6
   7 description::
   8
   9 note::
  10 In Qt GUI, every view can be a parent to other views, so CompositeView redirects to the same class as link::Classes/View:: - you can use the latter equivalently.
  11 ::
  12
  13 CompositeView can be used as the parent of other views, while also being a child of a Window or another CompositeView itself. Aside from that it has not special methods of its own.
  14
  15 note::
  16 In Cocoa GUI, this view accepts key actions, but not mouse clicks or drags.
  17 ::
  18
  19
  20 classmethods::
  21 private:: key
  22
  23
  24 examples::
  25
  26 subsection:: Coordinate System
  27
  28 Containers use relative coordinates, i.e.  views are placed relative to the upper left corner of the container.
  29 code::
  30 (
  31 w = Window.new;
  32
  33 c = CompositeView(w, Rect(50, 0, 300, 300));
  34 a = Slider2D(c, Rect(0, 0, 100, 100)); // actually displays at (50, 0)
  35 b = Slider2D(c, Rect(100, 100, 100, 100));
  36
  37 c.background = Color.rand;
  38
  39 w.front;
  40 )
  41
  42 c.bounds_(Rect(100, 0, 300, 300)); // contents adust since coords are relative
  43 c.resize_(6); // contents adust since coords are relative
  44 ::
  45
  46 subsection:: Keydown Bubbling
  47
  48 Key actions "bubble up" to the parent view if a view does not define one itself. In the following example, a and b do not have keyDown actions themselves, so the key event is passed to c, the parent, which defines the key down action. d's parent is the link::Classes/SCTopView::, which has no key down action. See also link::Classes/View::.
  49 code::
  50 ( //Click on the different views and hit keys on the keyboard.
  51
  52 w = Window.new;
  53
  54 c = CompositeView(w, Rect(0, 0, 200, 200)).background_(Color.grey.alpha_(0.3));
  55
  56 a = Slider2D(c,Rect(0, 0, 100, 100)).background_(Color.rand);
  57 b = Slider2D(c,Rect(100, 100, 100, 100)).background_(Color.rand);
  58
  59 w.front;
  60
  61 c.keyDownAction = {
  62         "keydown bubbled up to c".postln;
  63 };
  64
  65 // d is on window w, not on composite view c
  66 d = Slider2D(w,Rect(200, 200, 100, 100));
  67 d.background = Color.black;
  68 )
  69 ::
  70
  71 subsection:: Decorators
  72
  73 A 'decorator' object can be set to handle layout management. All views added to the CompositeView will now be placed by the decorator. Currently the only one existing is link::Classes/FlowLayout::. You can use the link::Classes/ContainerView#addFlowLayout:: method as a short cut to assigning FlowLayout to decorator.
  74 code::
  75 (
  76 a = Window.new;
  77
  78 b = CompositeView(a,Rect(0, 0, 500, 500));
  79 b.decorator = FlowLayout(b.bounds);
  80 //b.addFlowLayout; // you can also write this for convenience
  81
  82 // adding views to b automatically use the decorator
  83 // no need to use parent.decorator.place
  84 c = Slider2D(b,Rect(0, 0, 100, 100)); // size matters
  85 d = Slider2D(b,Rect(0, 0, 100, 100)); // origin doesn't
  86
  87 a.front;
  88 )
  89 ::
  90
  91 You can also use an empty composite view nicely as a spacer in link::Classes/VLayoutView::, link::Classes/HLayoutView::, or views that have a link::Classes/FlowLayout:: as their decorator.
  92 code::
  93 (
  94 a = Window.new;
  95 b = CompositeView(a, Rect(0, 0, 500, 500));
  96
  97 b.decorator = FlowLayout(Rect(0, 0, 500, 500));
  98
  99 Slider2D(b,Rect(0, 0, 100, 100)).background_(Color.rand);
 100 CompositeView(b, Rect(0, 0, 70, 100)); // just used for spacing
 101 Slider2D(b,Rect(0, 0, 100, 100)).background_(Color.rand);
 102 Slider2D(b,Rect(0, 0, 100, 100)).background_(Color.rand);
 103
 104 b.decorator.nextLine;
 105
 106 Slider2D(b, Rect(0, 0, 100, 100)).background_(Color.rand);
 107 Slider2D(b, Rect(0, 0, 100, 100)).background_(Color.rand);
 108 CompositeView(b, Rect(0, 0, 70, 100)); // just used for spacing
 109 Slider2D(b,Rect(0,0,100,100)).background_(Color.rand);
 110
 111 a.front;
 112 )
 113 ::
 114
 115 subsection:: Hiding / Swapping
 116
 117 You can stack CompositeViews on top of each other and use a button show only one of them:
 118 code::
 119 (
 120 var colors = [Color.blue, Color.red, Color.green];
 121 a = Window.new;
 122 q = 3;
 123
 124 b = Button(a, Rect(0, 0, 160, 20));
 125
 126 b.states = Array.fill(q, { arg i;
 127         [i.asString, Color.white, colors.wrapAt(i)]
 128 });
 129
 130 b.action = { arg butt;
 131         p.visible = false;
 132         p = c.at(butt.value);
 133         p.visible = true;
 134 };
 135
 136 c = Array.fill(q, { arg i;
 137         b = CompositeView(a, Rect(0, 25, 300, 300));
 138         b.background = colors[i].alpha_(0.2);
 139         b.visible = false;
 140         b;
 141 });
 142
 143 5.do{ arg i; Slider(c[0], Rect(10, i * 30 + 10, 150, 25)).value_(1.0.rand) };
 144 5.do{ arg i; Slider(c[1], Rect(i * 30 + 10, 10, 25, 150)).value_(1.0.rand) };
 145 Slider2D(c[2], Rect(10, 10, 155, 150)).x_(1.0.rand).y_(1.0.rand);
 146
 147 p = c.at(0); // previous
 148 p.visible = true; // show first one
 149
 150 a.front;
 151 )
 152 ::
 153
 154 subsection:: Nested Example
 155
 156 In this example, the link::Classes/StaticText:: accepts mouse clicks, since container views can't:
 157 code::
 158 (
 159 w = Window.new.front;
 160 v = CompositeView.new(w, w.view.bounds.insetBy(10)).background_(Color.rand);
 161 v.decorator = FlowLayout(v.bounds);
 162
 163 l = "SUPERCOLLIDER".scramble;
 164 t = Array.fill(9, {arg i; var n, r, q;
 165         n = CompositeView.new(v, Rect(20, 20, 121, 121)).background_(Color.rand);
 166         q = StaticText(n, n.bounds.moveTo(0,0).insetBy(25)).string_(l[i]).align_(\center);
 167         q.enabled = true;
 168         q.font = Font("Geneva", 10);
 169         q.background_(Color.rand);
 170         q.mouseDownAction = {
 171                 n.background_(Color.rand);
 172                 q.font=q.font.size_(5 + q.font.size + 7 % 60)
 173         };
 174 });
 175 )
 176 ::