flex-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Alex Harui <aha...@adobe.com>
Subject Re: ASJS question - MXML vs. AS
Date Tue, 29 Jan 2013 01:21:54 GMT
OK, here it is:

FlexJSTest.as:
package
{
    import controllers.MyController;
    
    import flash.display.Sprite;
    import flash.text.TextField;
    
    import models.MyModel;
    
    import org.apache.flex.core.Application;
    
    public class FlexJSTest extends Application
    {
        public function FlexJSTest()
        {
            valuesImpl = new MySimpleValuesImpl();
            model = new MyModel();
            model.labelText = "Hello World!";
            initialView = new MyInitialView();
            controller = new MyController(this);
        }
        
        private var controller:MyController;
    }
}

MyInitialView.as:
package
{
    import flash.events.Event;
    
    import org.apache.flex.binding.SimpleBinding;
    import org.apache.flex.core.ViewBase;
    import org.apache.flex.html.staticControls.Button;
    import org.apache.flex.html.staticControls.Label;
    import org.apache.flex.html.staticControls.TextButton;
    
    public class MyInitialView extends ViewBase
    {
        public function MyInitialView()
        {
            super();
        }
        
        override public function initUI(model:Object):void
        {
            super.initUI(model);
            lbl = new Label();
            lbl.addToParent(this);
            lbl.initModel();
            lbl.x = 100;
            lbl.y = 25;
            var sb:SimpleBinding = new SimpleBinding();
            sb.setDocument(this);
            sb.destinationPropertyName = "text";
            sb.sourceID = "applicationModel";
            sb.eventName = "labelTextChanged";
            sb.sourcePropertyName = "labelText";
            lbl.addBead(sb);
            lbl.initSkin();
            
            var btn:TextButton = new TextButton();
            addChild(btn);
            btn.initModel();
            btn.text = "OK";
            btn.x = 100;
            btn.y = 75;
            btn.addEventListener("click", clickHandler);
            btn.initSkin();
        }

        public var lbl:Label;

        private function clickHandler(event:Event):void
        {
            dispatchEvent(new Event("buttonClicked"));
        }
    }
}


On 1/28/13 3:41 PM, "Alex Harui" <aharui@adobe.com> wrote:

> OK, I'll put together the AS version of the app.
> 
> 
> On 1/28/13 3:35 PM, "Om" <bigosmallm@gmail.com> wrote:
> 
>> On Sun, Jan 27, 2013 at 11:20 PM, Alex Harui <aharui@adobe.com> wrote:
>> 
>>> 
>>> 
>>> 
>>> On 1/27/13 10:50 PM, "Om" <bigosmallm@gmail.com> wrote:
>>> 
>>>>>> But they dont seem to match up.  Can you please respond with how
the
>>> mxml
>>>>>> would look when redone as a pure actionscript file?
>>>>>> 
>>>>> There are two possible answers to this question.  One is for the
>>> question:
>>>>> what would the generated AS for the MXML file look like?   It would look
>>>>> somewhat like the FlexJSTest.as that you found, but it is a bit
>>> different
>>>>> because when I finally got the compiler working it was easier to change
>>>>> some
>>>>> of the 'generated' code a bit.  If you are really interested, I will
>>> try to
>>>>> hand-code it.
>>>>> 
>>>>> 
>>>> This would be good.  I played my hand around hand-coding based on this
>>> wiki
>>>> note [1]
>>>> But I would rather see your version.
>>> I'm not sure why you want to be hand-coding AS versions of MXML files.
>>> 
>>>> 
>>>> 
>>>>> The other answer is for the question: How would you write this app in
>>>>> ActionScript?  If I were to do it, it would not use the data array at
>>> all,
>>>>> it would call new Button and new Label and set properties and add event
>>>>> handlers.
>>>>> 
>>>>> --
>>>> 
>>>> 
>>>> I am curious how this would work behind the scenes.  But I am not in a
>>>> hurry to look at the implementation details.
>>>> 
>>>> A couple other questions while I have your attention:
>>>> 
>>>> Will the FlexJSTest_again app compile with the current mxmlc?  I saw your
>>>> note in the wiki that says that it wont.  Is there any way to make it
>>> work?
>>> The status page supercedes the original wiki page.
>>> FalconJS converts FlexJSTest.mxml to FlexJSTest.js.  Falcon (assuming you
>>> set the mxml.children-as-data flag) will convert FlexJSTest.mxml to a
>>> running SWF.
>>>> 
>>>> I have hooked up the falcon compiler to my flash builder (4.6) as an
>>>> external run tool.  The app compiles fine, but the IDE keeps showing
>>>> errors.  Any way I can jerry rig Flash Builder to use the Falcon mxmlc?
>>> I haven't tried.  I assume you can swap out the original MXMLC compiler for
>>> the Falcon JARs.
>>> 
>>>> 
>>>> I do have Flash Builder 4.7 installed.  I am willing to switch if that
>>>> would make this process any simpler.
>>>> 
>>>> Sorry for so many questions.  I am trying to wrap my head around all
>>> this.
>>>>  My end goal here is to churn out Stage3D based Button and Label classes.
>>>>  I need to first set up everything so that I can work without having to
>>>> jump through hoops to compile every code change I make.
>>> If that's your goal, I would skip the MXML part for now and build out a
>>> simple test app in ActionScript.  Then you can do it all in either version
>>> of FlashBuilder with the Apache Flex SDK and its MXMLC.
>>> 
>>> I think FlexJSTest.as would look something like this:
>>> 
>>>     public class FlexJSTest extends Application
>>>     {
>>>         public function FlexJSTest()
>>>         {
>>>             model = new MyModel();
>>>             model.labelText = "Hello World!";
>>>             valuesImpl = new MySimpleValuesImpl();
>>>             initialView = new MyInitialView();
>>>             controller = new MyController();
>>>         }
>>> 
>>>         private var controller:MyController;
>>>         public var model:MyModel;
>>>     }
>>> 
>>> And MyInitialView.as would look something like this:
>>> 
>>>     public class MyInitialView extends ViewBase
>>>     {
>>>         public function MyInitialView()
>>>         {
>>>             super();
>>>         }
>>> 
>>>         override public function initUI(model:Object):void
>>>         {
>>>             super.initUI(model);
>>>             lbl = new Label();
>>>             lbl.addToParent(this);
>>>             ...
>>>         }
>>> 
>>>         public var lbl:Label;
>>> 
>>>         private function clickHandler(event:Event):void
>>>         {
>>>             dispatchEvent(new Event("buttonClicked"));
>>>         }
>>> 
>>> But I haven't tried it.  If you get stuck trying to figure it out, I will
>>> take a look on Monday.  You might need to wait for the initialize event
>>> before setting up the four instances in the Application's constructor.
>>> 
>>> 
>> Tried it.  After fixing a few errors (ex. namespace mismatch because
>> controller, model etc. are already defined in Application.as, etc.) Am
>> stuck pretty bad.  I see some inconsistencies in how the type of model
>> (Object vs. IBeadModel)  The app compiles  fine but I dont see a label on
>> the screen.
>> 
>> I see a comment in Label.as that the view needs to be swapped out, not sure
>> what to make of it.
>> 
>> It would be nice to have your original AS version so that I have a good
>> starting point in understanding this framework.
>> 
>> Thanks,
>> Om

-- 
Alex Harui
Flex SDK Team
Adobe Systems, Inc.
http://blogs.adobe.com/aharui


Mime
View raw message