tag:robotlegs.tenderapp.com,2009-10-18:/discussions/robotlegs-2/3559-how-do-i-manage-mediators-for-parent-child-viewsRobotlegs: Discussion 2013-07-09T13:44:40Ztag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-26T11:12:56Z2013-06-27T13:09:58ZHow do I manage mediators for Parent-Child views?<div><p>I'm playing around with RL2 and looking at how to setup
parent-child views and have a noob question...</p>
<p>In flash IDE I have a Gameboard MC in which I've dragged a
Counter MC. In this counter I have a textfield with instance name
"myText"</p>
<p>The gameboard and counter both have mediators - I'm not sure how
I reference the TextField - for eg. do I need to listen for when
the textfield is added to the stage in the Counter Mediator or can
I access this via contextView?</p>
<p>Is there a special practice for dealing with Parent-Child
views..or does each view simply get its own mediator?</p>
<p>Thanks!</p></div>miketag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-27T07:50:43Z2013-06-27T13:09:58ZHow do I manage mediators for Parent-Child views?<div><p>Hi Mike,</p>
<p>Not sure if I understand your question correctly. Would you care
to elaborate on that?</p>
<p>If you mapped your views to mediators like so:</p>
<pre>
<code>mediatorMap.map(GameBoardView).toMediator(GameBoardMediator);
mediatorMap.map(CounterView).toMediator(CounterMediator);</code>
</pre>
<p>The GameBoardMediator and CounterMediator will be automatically
created after the views have been added to the stage.</p>
<p>If you want to access the text field within your
CounterMediator, you do:</p>
<p>view.myTextField.text =“some value“;</p>
<p>The GameBoarderMediator should not be allowed to have direct
access to subcomponents of its view (GameBoarderView), like this:
view.counterView.myTextField.</p>
<p>Instead, GameBoarderMediator should call a method (public API)
on its view:</p>
<p>view.doSomethingWithTheSubView(someProperty);</p>
<p>And in GameBoarderView:</p>
<pre>
<code>public function doSomethingWithTheSubView(someProperty:someType):void
{
counterView.doSomethingWithSomeProperty(someProperty);
}</code>
</pre>
<p>But, since both views are mediated, they should communicate with
each other through their mediators, via events. If myTextField has
changed, CounterView dispatches an event, and CounterMediator,which
is listening to that event redispatches it. GamesBoarderMediator,
or any other actor in your app that registered an event listener,
can react to it, if need be.</p>
<p>If components weren’t mediated, an easy to remember rule
is:</p>
<ul>
<li>Parents communicate with children via children’s
<strong>API</strong>.</li>
</ul>
<p>[
Parent->FirstChild.someMethod()->SecondChild.anotherMethod()
]</p>
<ul>
<li>Children communicate with parents via
<strong>events</strong>.</li>
</ul>
<p>[ Child.dispatchEvent(some event)->Parent listens->Parent
handles event ]</p>
<p>It is not clear to me what you mean by:</p>
<blockquote>
<p>I'm not sure how I reference the TextField - for eg. do I need
to listen for when the textfield is added to the stage in the
Counter Mediator or can I access this via contextView?</p>
</blockquote>
<p>Why do you need the contextView to access myTextField?<br>
If you want to access something from the contextView, you need to
do this:</p>
<p>contextView.view.someProperty<br>
or<br>
contextView.view.someMethod(),<br>
where view is the actual display object.</p>
<p>Ondina</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-27T11:56:35Z2013-06-27T13:09:57ZHow do I manage mediators for Parent-Child views?<div><p>Hi Ondina,</p>
<p>Fantastic answer :) That's cleared up a lot of things for me. If
I may impose a bit more I have this set in the Counter Mediator</p>
<pre>
<code> public function CounterMediator()
{
view.textField.text ="some value";
}</code>
</pre>
<p>I imported a swc from Flash, with automatically declare stage
instances<br>
ticked - yet the field is still empty. Can you see what I may have
missed?</p>
<p>Thanks again for your info</p>
<p>Cheers</p>
<p>Michael</p></div>miketag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-27T12:22:26Z2013-06-27T13:09:57ZHow do I manage mediators for Parent-Child views?<div><p>Hi Michael,</p>
<p>You need to wait until the Mediator has been registered before
attempting to access the injected view. You can do this by
overriding the <code>initialize()</code> method:</p>
<pre>
<code>override public function initialize():void
{
view.textField.text ="some value";
}</code>
</pre>
<p>Hope that helps!</p></div>Shaun Smithtag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-27T13:02:38Z2013-06-27T13:09:56ZHow do I manage mediators for Parent-Child views?<div><p>Hi Shaun many thanks for your reply !</p>
<p>If I add a counter separately to the contextView eg</p>
<pre>
<code> var gb:Gameboard = new Gameboard();
var counter:Counter = new Counter();
contextView.view.addChild(gb);
contextView.view.addChild(counter);</code>
</pre>
<p>The CounterMediator fires and sets the text fine. What I would
like is to preserve the design of the Gameboard in which this Movie
Clip contains a Counter symbol at a particular x, y. I have an
Counter MovieClip named "myCounter" in the fla file</p>
<p>Then I try something like this in GameboardMediator - do you
know if this is possible the way I describe?</p>
<pre>
<code> override public function initialize():void
{
view.myCounter.setText("testtset");
}</code>
</pre>
<p>Thanks again :)</p>
<p>Mike</p></div>Mike Wheelaghantag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-27T13:15:21Z2013-06-27T13:15:21ZHow do I manage mediators for Parent-Child views?<div><p>Hiya,</p>
<p>You don't need to add them to the ContextView separately in
order for them to be mediated. Robotlegs will pick up on any views
that you have mapped when they land on stage. In other words, if
Gameboard contains an instance of Counter, you can just add a
Gameboard to the stage. Usually, you only interact with the
ContextView at startup, where you add a single "main view" to the
stage, any sub views that have been mapped will be picked up and
mediated. Let me know if that clears things up a bit.</p></div>Shaun Smithtag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-27T14:07:02Z2013-06-27T14:07:02ZHow do I manage mediators for Parent-Child views?<div><p>Thanks a lot for that Shaun and Ondina - managed to get it
working with your help</p>
<p>Cheers!</p>
<p>Mike</p></div>Mike Wheelaghantag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-27T14:26:00Z2013-06-27T14:26:00ZHow do I manage mediators for Parent-Child views?<div><p>Mike, the pleasure is ours :) Good to hear you got it
working!</p>
<p>You can re-open this discussion, if you get stuck again and/or
open new discussions for new issues.</p>
<p>See you around,<br>
Ondina</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T10:08:18Z2013-06-28T10:08:18ZHow do I manage mediators for Parent-Child views?<div><p>Hi Guys, if I may just add one more question - I've noticed the
CounterMediator doesn't seem to activate when its an instance
variable inside Gameboard, but does if I add separately to the
ContextView. If I understand Shaun's notes correctly this myCounter
instance variable inside Gameboard would startup its own
CounterMediator?</p>
<p>thanks so much for all your help so far :)</p>
<p>M</p>
<pre>
<code> public function get _counter():Counter { return this["myCounter"]; }</code>
</pre></div>miketag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T12:30:57Z2013-06-28T12:30:57ZHow do I manage mediators for Parent-Child views?<div><p>Hi Mike,</p>
<p>You have to create an instance of CounterView and then add it to
GameboardView.</p>
<p>In GameboardView:<br></p>
<pre>
<code>private var counterView: CounterView;
private function gameboardOnAddedToStage():void
{
counterView = new CounterView();
addChild(counterView);
}</code>
</pre>
After counterView is added to the stage, its mediator will be
created automatically.
<p>Is your project a pure as3 one or Flex? How are you initializing
your context?</p>
<p>Could you attach a sample app? I’m willing to take a look
at it and tell you how to add your views and so on. It might be
easier to see why it is not working for you.</p>
<p>Ondina</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T14:08:58Z2013-06-28T14:08:58ZHow do I manage mediators for Parent-Child views?<div><p>Thanks again Ondina ! Here's my effort so far - Im attempting to
preserve the flash ide design, so in case I have a designer draw a
gameboard with a counter at a specific location and several other
movie clips in flash - that if I reference them by name I can
preserve their position in the scene (otherwise if I addChild() I
would need explicitly set x, y..or am I mixed up about that?)</p>
<p>cheers :)</p></div>Mike Wheelaghantag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T14:56:48Z2013-06-28T14:56:48ZHow do I manage mediators for Parent-Child views?<div><p>I've dl-ed it. I'll be back...</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T15:20:52Z2013-06-28T15:20:52ZHow do I manage mediators for Parent-Child views?<div><p>Here the changes:<br>
TextX.as:</p>
<pre>
<code>public class TestX extends Sprite
{
private var _context:IContext;
public function TestX()
{
_context = new Context()
.install(MVCSBundle, SignalCommandMapExtension, ViewProcessorMapExtension)
.configure(AppConfig)
.afterInitializing(init)
.configure(new ContextView(this));
}
private function init():void
{
var gb:Gameboard = new Gameboard();
addChild(gb);
}
}</code>
</pre>
<p>Note the line <strong>.afterInitializing(init)</strong>.</p>
<p>AppConfig:</p>
<pre>
<code>[Inject]
public var mediatorMap:IMediatorMap;
public function configure():void
{
mediatorMap.map(ICounter).toMediator(CounterMediator);
mediatorMap.map(IGameboard).toMediator(GameboardMediator);
}
}</code>
</pre>
<p>CounterMediator</p>
<pre>
<code>override public function initialize():void
{
trace("****** CounterMediator *****");
//view.textField.text ="some value";
view.setText("some value");
}</code>
</pre>
<p>Something is wrong with _myTf, but I can’t see the base
classes, so I don’t know exactly why myTf is not working.
Thus I created another TextInput in the constructor of the
Counter:</p>
<pre>
<code>private var someText:TextInput;
public function Counter()
{
someText= new TextInput();
addChild(someText);
}
public function setText(val:String):void
{
someText.text = val;
// _myTf.text = val;
}</code>
</pre>
<p>Gameboard</p>
<pre>
<code>public function Gameboard()
{
addEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
/*var c:Counter = new Counter();
addChild(c);*/
}
protected function onAddedToStage(event:Event):void
{
var c:Counter = new Counter();
addChild(c);
}</code>
</pre>
<p>It’s working fine so far:)</p>
<p>It would be good if I could see the base classes as well.<br>
I’ll attach the changed project later on.</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T15:36:40Z2013-06-28T15:36:40ZHow do I manage mediators for Parent-Child views?<div><p>I forgot to say that I used robotlegs-framework-v2.0.0 in your
project.<br>
(<a href=
"http://www.robotlegs.org/">http://www.robotlegs.org/</a>)</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T16:27:15Z2013-06-28T16:27:15ZHow do I manage mediators for Parent-Child views?<div><p>Ok, it works with the base text field as well. I didn’t
see it, because Counter was not fully on screen.</p>
<p>So, var c:Counter = new Counter(); c.x=150; addChild(c);<br>
solves the problem, haha.</p>
<p>Then you can set the text like this:</p>
<p>In Gameboard (it should implement an interface having
setText):</p>
<pre>
<code>public function setText(value:String):void
{
myCounter.textField.text = value;
}</code>
</pre>
<p>In Counter</p>
<pre>
<code>public function setText(value:String):void
{
textField.text = value;
//or
// _myTf.text = value;
}</code>
</pre>
<p>The names of the text fields are kind of confusing :)</p>
<p>I’m attaching the project with my changes.</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T16:39:00Z2013-06-28T16:39:00ZHow do I manage mediators for Parent-Child views?<div><blockquote>
<p>Im attempting to preserve the flash ide design, so in case I
have a designer draw a gameboard with a counter at a specific
location and several other movie clips in flash - that if I
reference them by name I can preserve their position in the scene
(otherwise if I addChild() I would need explicitly set x, y..or am
I mixed up about that?)</p>
</blockquote>
<p>Hmm, I don’t know how to answer that.</p>
<p>If you set Counter’s position, size etc inside
Counter’s constructor, they are preserved when you add it in
Gameboard, and of course you don’t need to set them again in
Gameboard. But, I’m afraid I don’t understand what you
mean :)</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-28T16:50:06Z2013-06-28T16:50:06ZHow do I manage mediators for Parent-Child views?<div><blockquote>
<p>I’m afraid I don’t understand what you mean</p>
</blockquote>
<p>I haven't had a chance to look at the sample yet, but this is my
understanding:</p>
<ol>
<li>Use Flash IDE to design a composite/nested view<br></li>
<li>Map mediators to the various individual view instances within
that view<br></li>
<li>Add the composite view to the stage<br></li>
<li>Mediators should be created for each mapped instance</li>
</ol>
<p>This is basically what RL was designed for. I'm not sure why it
isn't working for you, but it really should. It would suck to have
to lay everything out with code!</p>
<p>I can't look into it right now (I'm still at work), but here are
some things to double check:</p>
<ol>
<li>All classes that you map to mediators are set for export in the
Flash library panel.<br></li>
<li>The instances on stage have valid instance names (actually,
this shouldn't matter)<br></li>
<li>You map them before you add the view to the stage<br></li>
<li>You have selected "Export SWC" in the project properties.</li>
</ol>
<p>Will try to take a look later / over the weekend.</p></div>Shaun Smithtag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-29T05:39:05Z2013-06-29T05:39:05ZHow do I manage mediators for Parent-Child views?<div><p>Hi - many thanks again guys for all your patience :-)</p>
<p>Shaun is exactly right - that's what I'm trying to achieve. Have
Flash IDE to design a composite nested view and map separate
mediators to individual instances within that view.</p>
<p>Ondina thanks very much for your example I can see now that
using addChild() is a guarenteed way to activate the child mediator
(Counter) . My eventual goal is what Shaun describes ie.</p>
<p>The package.GameboardBase and package.CounterBase are the
linkage names I provided in the Export settings in Flash IDE so all
the code is in flashbuilder. I export a single swc and import into
FB</p>
<p>Where I'm trying to get to is</p>
<pre>
<code> viewProcessorMap.map(ICounter).toProcess(new MediatorCreator(CounterMediator));
viewProcessorMap.map(IGameboard).toProcess(new MediatorCreator(GameboardMediator));
var gb:Gameboard = new Gameboard();
contextView.view.addChild(gb);</code>
</pre>
<p>Since Gameboard contains a reference to Counter via</p>
<pre>
<code> public function get _myTf():Counter
{
return this["myCounter"]; //myCounter is the name of the Counter Symbol that is placed inside the Gameboard Symbol
}</code>
</pre>
<p>and we can set the text of the Counter via the
GameboardMediator, I'm hoping it's possible to have this instance
of Counter mediated. (which has specific layout and keyframe
location within the Gameboard Movie Clip )</p>
<p>The reason for all this is that it would achieve a clean
separation between designer and developer and no matter how complex
the nested/composite view gets - you can have as many sub-views as
you like , each view is mediated and logical separate from the
parent.</p>
<p>Hope to get your thoughts on this - appreciate the sample code
again</p>
<p>M</p></div>Mike Wheelaghantag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-29T09:16:36Z2013-06-29T09:16:36ZHow do I manage mediators for Parent-Child views?<div><p>Well, Shaun seems to have understood better what you need to
achieve :)</p>
<p>Yes, I could see CounterBase and GameboardBase in the referenced
libraries. CounterBase has a property textField:TextInput and
GameboardBase has myCounter:CounterBase.</p>
<p>My confusion was about your interfaces and the way you’ve
mapped them. It wasn’t clear what exactly needed
mediation.<br>
CounterBase and GameboardBase don’t implement any interfaces,
so the mapping to ICounter won’t work, unless you add the
view implementing ICounter to the stage.<br>
Of course you don’t need to add the CounterBase again, if it
was already added by Gameboard, but if you have these mappings:</p>
<pre>
<code>mediatorMap.map(ICounter).toMediator(CounterMediator);
mediatorMap.map(IGameboard).toMediator(GameboardMediator);</code>
</pre>
<p>and you add gameboard like this</p>
<pre>
<code>var gb:Gameboard = new Gameboard();
contextView.view.addChild(gb);</code>
</pre>
<p>and you don’t add Counter too, only GameboardMediator will
be created.</p>
<p>If you map them like this:</p>
<pre>
<code>mediatorMap.map(CounterBase).toMediator(CounterMediator);
mediatorMap.map(IGameboard).toMediator(GameboardMediator);</code>
</pre>
<p>and in CounterMediator you inject CounterBase, both mediators
get created, and you don’t need to add Counter manually. That
means, that the mediator for a subcomponent from your swc will be
created, if it is mapped correctly.</p>
<p>I think you need to let CounterBase implement ICounter if you
want to keep your original mappings.<br>
Maybe I’m wrong, though.</p></div>Ondina D.F.tag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-29T09:55:42Z2013-06-29T09:55:42ZHow do I manage mediators for Parent-Child views?<div><p>Thanks Ondina that really helped. If I use CounterBase that
works , I can access the textfields directly from both mediators -
In practice I will have a CounterUpdate command sending to a
CounterMediator and so forth...I definitely need to think more
about the view architecture but at least I know that it can be done
no worries, thanks heaps for helping me out !!</p>
<p>M</p></div>miketag:robotlegs.tenderapp.com,2009-10-18:Comment/274982282013-06-30T06:46:26Z2013-06-30T06:46:26ZHow do I manage mediators for Parent-Child views?<div><p>It's nothing!</p></div>Ondina D.F.