3 Replies Latest reply on Oct 25, 2011 7:11 PM by drkstr_1

    MXML Components and ActionScript Classes

    numba1john

      Hello,

       

      I am fairly new to Flex and OOP and am confused on how some parts of OOP work.

       

      I have a Spark TextInput Component with an id which equals "test".

      I also have a function that takes "test.text", appends a string to and and puts the resulting value into another TestInput called test2.

       

      How can I move the "appendPhrase()" function into a class so that it would still accept values from "test" and change the "text2" values?

      I tried creating a function that would assign the value of the varaible in the class using classname.variable name, made it bindable, and assigned

      the text value of the textinput that value, but I was wondering if there was any other way I could do that?

       

      ~~~~~~~~~~~~~~~~Version1~~~~~~~~~~~~~~~~~~~~~

       

      <fx:Script>

          private function appendPhrase():void

          {

              test2.text = test.text + " was added";

          }

      </fx:Script>

       

      <s:TextInput x="0" y="0" id="test" />

      <s:TextInput x="0" y="10" id="test2" />

       

      <s:Button click="appendPhrase();" />

       

      ~~~~~~~~~~~~~~~~~~Version 2:~~~~~~~~~~~~~~~~~

      function in class:

       

      public class ChangeString

      {

       

          [Bindable]

          public var text:String;

       

          private function appendPhrase(firstString:Object):void

          {

             text = firstString.text + " was added";

          }

      }

       

      main.mxml:

       

      [Bindable]

      public var changed:Object = new ChangeString();

       

      <s:TextInput x="0" y="0" id="test" click="changeValue(test.text)" />

      <s:TextInput x="0" y="10" id="test2" text="{changed.text}"/>

        • 1. Re: MXML Components and ActionScript Classes
          drkstr_1 Level 4
          package models
          {
                    [Bindable]
                    public class MyViewModel
                    {
                              public var text:String "Hello ";
          
                              public function appendText(t:String):String
                              {
                                        this.text = this.text + t;
                                        return this.text;
                              }
                    }
          }
          

           

           


          <fx:Script>

          <![CDATA[



          import models.MyViewModel;

           



          [Bindable]


          public var model:MyViewModel = new MyViewModel();

          ]]>

          </fx:Script>

           


          <s:TextInput id="test" x="0" y="0" click="this.model.appendText(this.test.text)" text="World" />

          <s:TextInput id="test2" x="0" y="10" text="{this.model.text}" />

           

           

          I would go about it a little differently maybe. I would use the model class as a data holder, and use a private local method, utility class, or controller class to modify values on the model (data holder class).

          • 2. Re: MXML Components and ActionScript Classes
            numba1john Level 1

            Why did you use the "this" (don't know how to call it)... variable?

             

            I removed all the "this" variables and it still worked fine.

            • 3. Re: MXML Components and ActionScript Classes
              drkstr_1 Level 4

              'this' points to whatever the current class scope is.

               

              It is somewhat of a standard coding convetion to use 'this' on public properties and methods inside your class, but mostly it's just personal preferance. It also triggers the auto completion...

              1 person found this helpful