'flex'에 해당되는 글 3건

  1. 2009.12.10 Using the Application.application.parameters 3
  2. 2009.12.10 Maths Functions including Random 1
  3. 2009.12.10 Set the selected item for a comboBox or dataGrid 2
2009. 12. 10. 16:17

Using the Application.application.parameters





The parameters property of the Application object points to a dynamic object that stores parameters as name-value pairs. You can access variables on the parameters object by specifying parameters.variable_name.

The following example defines the myName and myHometown parameters and binds them to the text of Label controls:

<?xml version="1.0"?>
<!-- wrapper/ApplicationParameters.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="initVars()">
  <mx:Script><![CDATA[
     // Declare bindable properties in Application scope.
     [Bindable]
     public var myName:String;
     [Bindable]
     public var myHometown:String;
     
     // Assign values to new properties.
     private function initVars():void {
        myName = Application.application.parameters.myName;
        myHometown = Application.application.parameters.myHometown;
     }
  ]]></mx:Script>
  
  <mx:VBox>
  <mx:HBox>
     <mx:Label text="Name: "/>
     <mx:Label text="{myName}" fontWeight="bold"/>
  </mx:HBox>
  <mx:HBox>
     <mx:Label text="Hometown: "/>
     <mx:Label text="{myHometown}" fontWeight="bold"/>
  </mx:HBox>
  </mx:VBox>
</mx:Application>

When a user requests this application with the myName and myHometown parameters defined as flashVars variables, Flex displays their values in the Label controls.

To view all the flashVars properties, you can iterate over the parameters object, as the following example shows:

<?xml version="1.0"?>
<!-- wrapper/IterateOverApplicationParameters.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()">
  <mx:Script><![CDATA[
     private function init():void {
        for (var i:String in Application.application.parameters) {
           ta1.text += i + ":" + Application.application.parameters[i] + "\n";
        }
     }
  ]]></mx:Script>
  
  <mx:TextArea id="ta1" width="300" height="200"/>

</mx:Application>

Flex does not recompile the application if the request variables have changed. As a result, if you dynamically set the values of the flashVars properties or query string parameters, you do not force a recompilation.

Query string parameters must be URL encoded. The format of the string is a set of name-value pairs separated by an ampersand (&). You can escape special and nonprintable characters with a percent symbol (%) followed by a two-digit hexadecimal value. You can represent a single blank space using the plus sign (+).

The encoding for flashVars properties and query string parameters is the same as the page. Internet Explorer provides UTF-16-compliant strings on the Windows platform. Netscape sends a UTF-8-encoded string to Adobe Flash Player.

Most browsers support a flashVars String or query string up to 64 KB (65535 bytes) in length. They can include any number of name-value pairs.

2009. 12. 10. 14:31

Maths Functions including Random





The random function has many uses in Flash, generating basic random numbers, creating random movement, creating random colors and many others. The example above creates a random integer between -100 and 100 everytime you click the button. This tutorial will cover creating the example, and also how to incorporate the random function to achieve different results.

The basic random function is as follows:
Math.random();

This creates a random number between the values of 0.0 and 1.0. For example: 0.0105901374530933 or 0.872525005541986. Several other functions can now be used to change the number that is created for better use in your movie. These include:

Math.round();
 Math.ceil();
 Math.floor();

These Math functions all round a number so that it becomes an integer, or whole number. The Math.round(); function will round up or down the number or expression that is inside its brackets to the nearest whole number. The Math.ceil(); function will do the same, however it will always round up to the nearest whole number. The Math.floor(); function is the opposite of the Math.ceil(); , it will always round down to the closest whole number.

To incorporate these with the random function, you can do this:

Math.round(Math.random());

This expression will now create a random number between 0.0 and 1.0, and then round it up to the closest whole number. So in this case, the number created will always equal either 0 or 1. This expression is useful for creating a 50% chance of an event occuring, ie flipping a coin. or for use with booleans (true/false statements).

To create a random number between the values of, say 0 and 10, you could do this:

Math.round(Math.random()*10);

The *10 multiplies your random number by 10, then it is rounded by the Math.round function to an integer. To create a random number between 1 and 10, you could do this:

Math.ceil(Math.random()*10);

This way the random number is always rounded up, and cannot equal 0. Another procedure is to create random numbers between two numbers other than 0 and something else. To create a random number between 5 and 20, do this:

Math.round(Math.random()*15)+5;

Or in other words, to create a random number between the values x and y:

Math.round(Math.random()*(y-x))+x;

This will hold true for all values of x and y, ie they can be negative numbers as well as positive.

To make the example above, first create a new button, and place an instance of it onto the main stage. Create a new Dynamic text box, and give it the variable name of "display". That's the creation out of the way, and we can now do the scripting.

Select your button, and then open the actions window. You can either manually insert the following code, using the dropdown menus, or just copy and paste for now. Insert the code:

on (release) {
 display = Math.round (Math.random ()*200)-100;
 }

And that's it! Now test your movie and give it a try out. You'll notice that the values in the code follow the pattern set by the general formula ie if x = -100, and y =100, then y-x=200 and +x = -100.

This can have many different applications within flash. For example, to have a movieclip appear in random positions on the screen between the values of 0 and 200 you could have the following. Note: movieclip instance is called "bob".

bob._x = Math.round(Math.random()*200);
 bob._y = Math.round(Math.random()*200);

Or to set the size of a movieclip randomly (between 0 and 100):

bob._width = Math.round(Math.random()*100);
 bob._height = Math.round(Math.random()*100);

Or to choose a random movieclip to load, say if our movieclips have a linkage name of "bob1", "bob2" and we have 5 of them:

i = Math.ceil(Math.random()*5);
 attachmovie("bob"+i, "fred"+i, 1);

So that would attach a random movie, say "bob3", into level 1 and then give it an instance name of "fred3".

Well, that's the basics of using the random function in Flash 5. Hopefully now you will be able to incorporate this into your movies to produce some even more amazing flash work. =)

2009. 12. 10. 12:31

Set the selected item for a comboBox or dataGrid




 

BSince the Flex 1.5 list-based controls do not support a "selectedItem" method, if you want to programatically set the control to a given value, you must loop over the items in the dataGrid, find a match, then set the selectedIndex.

The sample below does that for a comboBox and a dataGrid, plus shows setting vPosition to scroll the selection into view on the dataGrid.  It also has a simple labelFunction to build a label for the combo box.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" horizontalAlign="left"
  initialize="initApp()">
<mx:Script><![CDATA[
 private var gaDP1:Array;
 
 private function initApp():Void
 {
  gaDP1 = [ {label:"A", data:0},
     {label:"B", data:1},
     {label:"C", data:2},
     {label:"D", data:3},
     {label:"E", data:4},
     {label:"F", data:5},
     {label:"G", data:6},
     {label:"H", data:7},
     {label:"I", data:8},
     {label:"J", data:9}];  //build the dataProvider
 }
 
 //runs on click of button
 private function setInitialItem():Boolean
 {
  var aDP:Array = mx.utils.ArrayUtil.toArray(cbo1.dataProvider);
  var sDataValueInit:String = tiInitialData.text;
  var sDataValueCur:String;
  for ( var i:Number=0; i<aDP.length; i++ )  {  //loop over the items in the dataProvider
   sDataValueCur = aDP[i].data;  //get the current item.data value
   if ( sDataValueCur == sDataValueInit )  {  //compare desired value to current item.data value
    cbo1.selectedIndex = i;  //set the seletedIndex of the combo box
    dg1.selectedIndex = i;  //set the seletedIndex of the dataGrid
    dg1.vPosition = dg1.selectedIndex;  //scroll the dtagrid so the selected item is visible
    return true;
   }
  }//for ( var i:Number=0;....
  return false;
 }
 
 //example of labelFunction.  Creates a label out of both properties
 private function lfCB1(oItem:Object):String
 {
  return oItem.label + "  ( data:" + oItem.data + ")";
 }
]]></mx:Script>
   <mx:HBox>
  <mx:Label text="Initial Data Value (0-9)" />
  <mx:TextInput id="tiInitialData" />
  <mx:Button label="Set Item" click="setInitialItem()"/>
 

    <mx:ComboBox id="cbo1" dataProvider="{gaDP1}" width="150" labelFunction="lfCB1" />
  <mx:DataGrid id="dg1"  dataProvider="{gaDP1}" rowCount="4">
     <mx:columns>
        <mx:Array>
           <mx:DataGridColumn headerText="Label" columnName="label" />
           <mx:DataGridColumn headerText="Data" columnName="data" />
           </mx:Array>
        </mx:columns>
     </mx:DataGrid>
  </mx:HBox>
</mx:Application>



<?xml version="1.0"?>
<!-- dpcontrols/ComboBoxEvent.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" >
   <mx:Script>
      <![CDATA[
         import flash.events.Event;
         import mx.events.DropdownEvent;

         // Display the type of event for open and close events.
         private function dropEvt(event:DropdownEvent):void {
            forChange.text+=event.type + "\n";
         }

         // Display a selected item's label field and index for change events.
         private function changeEvt(event:Event):void {
            forChange.text+=event.currentTarget.selectedItem.label + " " + 
               event.currentTarget.selectedIndex + "\n";
         }
      ]]>
   </mx:Script>

   <mx:ComboBox open="dropEvt(event)" close="dropEvt(event)"
         change="changeEvt(event)" > 
      <mx:ArrayCollection>
         <mx:Object label="AL" data="Montgomery"/>
         <mx:Object label="AK" data="Juneau"/>
         <mx:Object label="AR" data="Little Rock"/>
      </mx:ArrayCollection>
   </mx:ComboBox>
   <mx:TextArea id="forChange" width="150" height="100%"/>
</mx:Application>

The executing SWF file for the previous example is shown below:

If you populate the ComboBox control with an Array of Strings, the currentTarget.selectedItem field contains a String. If you populate it with an Array of Objects, the currentTarget.selectedItem