http://idletogether.com/automatically-resize-texttextarea-based-on-content-autosize-in-flex/

there were others who solved the problem but a few people were having a few issues still..

http://cookbooks.adobe.com/post_Creating_a_dynamically_resizing_TextArea_without_s-13628.html

this is my approach, no need to use a TextArea, instead create a UIComponent and embed a TextField. Simple, and
you can still apply stylesheet, htmltext, text to the component, so it is treated like an actual TextArea. Why battle and try to go into all the things that make up your TextArea, in fact, you don’t even have to think about scrollbars anymore, because simply there are no scrollbars in UIComponent!!  You can update a few ways of declarations in this component if you need to make it work for Flex 4

In my application

<view:ResizeTextArea id=”txt” y=”52″ width=”200″  />

the scripting..

this.txt.styleSheet = StyleFactory.createStyleSheet( [ "p", "h1" ] ); /*check my blog how i get the stylesheet from StyleManager */
this.txt.htmlText =  someHTMLContent;

I started studying Java previous to Android. I learned the basics from http://download.oracle.com/javase/tutorial/java/index.html, that brought me more confidence to go into Android. I am still learning Java and need to learn a few other important classes such as the use of  threads which i already saw it is being used when creating Android Applications.

My best suggestion for others who are Flex developers or just new to Android is to skim books about Android, see what topics you need to learn from Java if you just know the basics like me. And also look at examples, don’t do them, just pay attention of the process how applications are created. The book i am using is called Hello Android. It goes straight to android applications. I don’t like these examples as i see a lot of things they talk about while developing. They have an application too long to remember even the process of things, but just trying to understand helps. My next book will be Android 2 from Wrox. I looked at it, and like their examples. They look small and go from one short topic to another. Those are the books that help me put everything together while i practice each exercise. I try to avoid knowing the logic for example of a sudoku game from the current book because i don’t really care how the game works, i am more interested to find out what i need to use to make an application work and have menu options, etc.

One of the things that is really making me so excited about Android is a topic related to loading a web browser view in an application and it can interact with it. That is really exciting to know for example if the web page can retrieve your geocode, or you grant access to data saved from the application. The topic related to saving data reminded me of SharedObjects in Flash and SQL Lite as used in Adobe AIR.

My experience has been a lot greater with Android than Iphone Apps. I started to learn it but felt not happy how the IDE of such applications is a little slow or runs a debugger at the last minute while compiling. Besides that Objective-C was not a language i found myself excited to learn. I want to do applications in a way I feel happy to do the work, and I don’t care right now if Android is less popular than the Iphone, and if it will always be like that.

I like Android because it is open source, and that gives other technologies to create applications such as the case of Flash. In the case of Apple, it backfired the ability for flash to create iphone applications due to their restrictions in their market. I find it exciting to know there are tutorials how to run flash player in the iphone. Not everyone is convinced that Flash Player is not good for the iphone. I like that attitude of those users, they want to see things for themselves rather than being told what they can and cannot do. I wondering if there are other flex developers going straight for Android.

i kept having issues with bundles not able to be found.

i close flash builder and opened it using a different workspace and finally subversion plugin was installed

mxml file

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml”
layout=”vertical”
addedToStage=”this.onStageReady(event);”
creationComplete=”this.onAppComplete(event);” width=”200″ height=”200″
>
<mx:Script>
<![CDATA[
import mx.managers.BrowserManager;
import mx.events.BrowserChangeEvent;
import mx.events.FlexEvent;
import mx.managers.IBrowserManager;

private var bm:IBrowserManager;
private var hashTimer:Timer;
private var hashValue:String = "";

private function onAppComplete( event:FlexEvent ):void
{
this.hashTimer = new Timer( 500 );
this.hashTimer.addEventListener( TimerEvent.TIMER, this.onHashTimer );

this.bm = BrowserManager.getInstance();
this.bm.init( "", "Site" );
this.bm.addEventListener( BrowserChangeEvent.BROWSER_URL_CHANGE, this.onBrowserChange );
this.bm.addEventListener( BrowserChangeEvent.APPLICATION_URL_CHANGE, this.onAppChange );
}

private function onStageReady( event:Event ):void
{
this.setHash( this.bm.fragment );
this.setHashTimer();
}

private function setHashTimer():void
{
//inmediately call to detect if the anchor has a value.
this.onHashTimer();

if( !this.hashTimer.running )
this.hashTimer.start();
}

private function setHash( value:String ):void
{
this.hashValue = value;
txt.text = "hash value: " + this.hashValue;
}

private function getHash():void
{
var hash:String = ExternalInterface.call( "getHash" );
ExternalInterface.call( "alert", "Javascript.getHash() returns " + hash );
}

private function onBrowserChange( event:BrowserChangeEvent=null ):void
{
/**
* i noticed that chrome on first chrome change was getting a null value
* for browsermanager's fragment. so that was a good key for me to set the
* timer and read the anchor value coming from javascript.
*
* if i am able to get the fragment, then it means the browser works fine
* and i don't need to use my timer. but if the fragment value is null then
* i can set it back to use the timer.
*/

if( this.bm.fragment )
{
if( this.hashTimer.running )
this.hashTimer.stop();

this.setHash( this.bm.fragment );
}
else
{
this.setHashTimer();
}
}

/**
* if the application can handle browse changes by the browser, i wanted to keep this
* functionality independent from the browser making the changes instead */

private function onAppChange( event:BrowserChangeEvent ):void
{
this.setHash( this.bm.fragment );
}

/**
* checkign if the hash value has changed, and making sure we have the JS function available
* to retrieve the hash value **/
private function onHashTimer( event:TimerEvent=null ):void
{
var hash:String = ExternalInterface.call( "getHash" );

if( hash != this.hashValue )
{
this.setHash( hash );
}
}

/**
* this function was done in purpose to test what would happen in chrome if we
* change the hash value from the application instead of the browser */
private function linkHash():void
{
this.bm.setFragment( "1" );
}
]]>
</mx:Script>
<mx:Text id=”txt” width=”100″ height=”40″ text=”hello” />
<mx:Button label=”getHash” click=”this.getHash();” />
<mx:Button label=”setHash(1)” click=”this.linkHash();” />
</mx:Application>

page

<head>
<link rel=”stylesheet” type=”text/css” href=”/styles/history.css” />
<title></title>

<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<script type=”text/javascript” src=”/scripts/swfobject.js”></script>
<script type=”text/javascript” src=”/scripts/history.js”></script>
</head>

<body>

<div id=”AppLayer”>
<a href=”http://www.adobe.com/go/EN_US-H-GET-FLASH”>Get Flash Player</a> to view animation.

<script type=”text/javascript”>

//function required for getting the current hash
function getHash()
{
return unescape(self.document.location.hash.substring(1));
}

var requiredMajorVersion = 9;
var requiredMinorVersion = 0;
var requiredRevision = 124;

//swfobject
var flashvars = {};

var params = {};
params.menu = “false”;
params.quality = “best”;
params.scale = “noscale”;
params.salign = “tl”;
params.bgcolor = “#FFFFFF”;
params.allowscriptaccess = “always”;

var attributes = {};

swfobject.embedSWF(“/Main.swf”,
“AppLayer”,
“200″,
“200″,
“9″,
“/common/swf/expressInstall.swf”,
flashvars, params, attributes );
</script>
</div>

<a href=”#2″><p id=”2″>hash 2</p></a>
<a href=”#3″><p id=”3″>hash 3</p></a>
<a href=”#4″><p id=”4″>hash 4</p></a>
<a href=”#5″><p id=”5″>hash 5</p></a>

</body>

I took the test today, and was so glad to pass it. What i realize is that the test was indeed based everything in what is reviewed from Adobe’s ACE exam guide. So i am not blowing questions but to tell you what i saw from the test. I saw questions about RemoteObject, questions about Event and its phases, questions about working with Files and local Database. Several questions also applied to DataService class. Other questions regarding binding data. So if you think about it, it is nothing new or different from their guidelines.

I took before a flash 8 certificate and in that exam i was surprised as i felt many questions were not very relevant to it. In the case of this exam i felt very comfortable to see questions that were more obvious to be in a test. I studied a few times like for the LCDS just learning directly what Consumer, Producer, RemoteObject, and how to use HTTPService classes. as installing other features from LCDS were a lot of work like using DataService class.

What are some of the resources i used and found very helpful.

For LCDS i relied a lot on lynda’s using dataservices http://www.lynda.com/home/DisplayCourse.aspx?lpk2=335

also another great source which i didn’t want to go too in depth as the book is from Wrox’s Flex 3 book four chapters in same material.

I really recommend O’reilly Flex 3 book and O’reilly Essential ActionScript 3 book. As they are east to learn and also very helpful.

I had in the past studied Adobe Flex 3 Training from the source but found it too wordly and felt lost looking line by line to do an application.

What i really recommend as a technique to study is to group three subjects together to practice. Like yesterday i did a simple exercise in AIR, where i created an application that dragged and drop files, and automatically save them in a local database, and using a datagrid update rows, or remove them, and even use transaction commit or rollback, and for update open a new AIR window showing a form to modify the values and returned them back to the parent window. Maybe this sounds more complex, but i find doing even simple exercises helpful to cover three subjects like a sample form which even mimics uploading a file and then practice in some way how to use an event and check with the different event phases or having formatters and validators. I hope you get the point to get creative studying.

In my case it took me more than a year because i was on and off in a constant basis. I was a little panic to take it as i imagined going through the same experience with the ridiculous questions in the Flash 8 exam. I thought what if they ask me some question related to something i had never ever done or was too deep in one subject. Most of the exam is fair so don’t panic like i did. It was bread and butter.  More questions or suggestions feel free to contact me.

http://juan.dev03.newermedia.com/content/designPatterns/command/

This is an effective way to load papervison into Flex.

In application include a UIComponent instance

<box:PaperVisionBoxid=”ppv“/>

This is the UIComponent instance. Here we are getting feedback from mc to know the dimensions of its papervision content and in order to resize this UIComponent. In this way the application gets noticed of the new dimensions and pushes down or left depending of its layout.

//PaperVisionBox

<<?xml version=”1.0″ encoding=”utf-8″?>

<mx:UIComponentxmlns:mx=”http://www.adobe.com/2006/mxml” xmlns:box=”com.juandevelops.ppv.box.*“

preinitialize=”this.onFlexEvent( event );”

addedToStage=”this.onFlexEvent(event);”

resize=”this.onFlexEvent(event);”>

<mx:Script>

<![CDATA[

import com.juandevelops.flesh.stage.StageEvent;

import com.juandevelops.flesh.stage.StageListener;

import com.juandevelops.ppv.cube.MotherCube;

import mx.events.FlexEvent;

private var mc:MotherCube

private function onFlexEvent( event:Event ):void

{

if( event.type == FlexEvent.PREINITIALIZE )

{

mc =new MotherCube();

this.addChild( mc );

}

else

if( event.type == Event.ADDED_TO_STAGE || event.type == Event.RESIZE )

{

this.invalidateSize();

}

}

override protected function measure():void

{

super.measure();

if( mc )

{

this.measuredWidth = mc.width;

this.measuredHeight = mc.height;

}

}

]]>

</mx:Script>

</mx:UIComponent>

Now it’s time to see the work done in MotherCube which is an instance os Sprite and is loading papervision, and in papervision we include a cube.

We can ignore most of the code and just pay attention to getters width and height.

Also important, not to include any other content but just papervision.

//MotherCube

package icom.juandevelops.ppv.cube

{

import flash.display.Sprite;

import flash.events.Event;

import flash.events.MouseEvent;

import flash.geom.Rectangle;

import org.papervision3d.cameras.CameraType;

import org.papervision3d.materials.ColorMaterial;

import org.papervision3d.materials.MovieMaterial;

import org.papervision3d.materials.utils.MaterialsList;

import org.papervision3d.objects.primitives.Cube;

import org.papervision3d.render.BasicRenderEngine;

import org.papervision3d.view.BasicView;

publicclass MotherCube extends Sprite

{

privatevar view:BasicView;

privatevar _cube:Cube;

privatevar list:MaterialsList;

privatevar cm:ClipMaterial;

privatevar mm:MovieMaterial;

publicfunction MotherCube()

{

view = new BasicView(600, 600, false, false, CameraType.FREE);

view.renderer = new BasicRenderEngine(); addChild(view);

view.viewport.interactive = true;

view.camera.z = -540;

list = new MaterialsList();

list.addMaterial( new ColorMaterial( 0xFFFFFF, “back” );

list.addMaterial( new ColorMaterial( 0x0099FF, 1, false ), “front” );

list.addMaterial( new ColorMaterial( 0xFF0000, 1, false ), “left” );

list.addMaterial( new ColorMaterial( 0xFFCC00, 1, false ), “right” );

list.addMaterial( new ColorMaterial( 0x93A070, 1, false ), “top” );

list.addMaterial( new ColorMaterial( 0×999999, 1, false ), “bottom” );

_cube = new Cube( list, 400, 400, 400 );

view.scene.addChild( _cube );

this.addEventListener( Event.ENTER_FRAME, onRenderViewport);

}

privatefunction onRenderViewport(e:Event): void

{

view.singleRender();

}

overridepublicfunctiongetwidth():Number

{

if( view )

return view.viewport.viewportWidth;

return 0;

}

overridepublicfunctionget height():Number

{

if( view )

return view.viewport.viewportWidth;

return 0;

}

publicfunctionget cube():Cube

{

returnthis._cube;

}

}

}

In my appliation I included the box below having the scrollers, and they are pushed down as the content in PaperVisionBox found out the dimensions of MotherCube

I Hope this helps, please let me know.. I am try to share my work knowledge and I never get any comments.

I like the idea of writing code that will save me from thinking more than i want.. in this case appending a NativeMenu required to set a condition when adding one to a windows or mac computer. So i wrote a class and also noticed there was an issue with Mac not able to display the NativeMenu; fortunately, ThanksMister found a solution.. and what i did here is follow his suggestion..

Here is how simple i write my code and include the NativeMenu using my class NativeMenuUtil, which requires first for you to set stage to it, and then it takes care of the rest..

NativeMenuUtil.stage = this.stage;

var nativeMenu:NativeMenu = new NativeMenu();

var item:NativeMenuItem;

item = new NativeMenuItem( “Menu 1″ );

nativeMenu.addItem( item );

item = new NativeMenuItem( “Menu 2″ );

nativeMenu.addItem( item );

NativeMenuUtil.applicationMenu = nativeMenu;

//here is the code…

package com.juandevelops.air.menu

{

import flash.desktop.NativeApplication;

import flash.display.NativeMenu;

import flash.display.NativeMenuItem;

import flash.display.NativeWindow;

import flash.display.Stage;

public class NativeMenuUtil

{

private static var _stage:Stage;

public static function set stage( stage:Stage ): void

{

_stage = stage;

}

public static function get applicationMenu():NativeMenu

{

return getNativeMenu();

}

public static function set applicationMenu( nativeMenu:NativeMenu ): void

{

var myNativeMenu:NativeMenu = getNativeMenu();

if ( NativeWindow.supportsMenu )

{

myNativeMenu = nativeMenu;

}

else

{

//sample helped me so much, i was going nuts why i couldn’t display menu on a mac.

//http://thanksmister.com/index.php/archive/air-nativemenu-issue-on-mac/comment-page-1/#comment-16493

var menuItem:NativeMenuItem = new NativeMenuItem( “Application Menu” );

menuItem.submenu = nativeMenu;

myNativeMenu.addItem(menuItem);

}

}

private static function getNativeMenu():NativeMenu

{

if ( NativeWindow.supportsMenu )

return _stage.nativeWindow.menu as NativeMenu;

return NativeApplication.nativeApplication.menu as NativeMenu;

}

}

}

Here is what it looks like when I run the application

]]> http://juandevelops.wordpress.com/2009/10/12/shortcut-to-include-nativemenu-in-desktop-2/feed/ 0 juandevelops http://juandevelops.wordpress.com/2009/10/02/getting-the-screen-dimensions-for-air-windows/ http://juandevelops.wordpress.com/2009/10/02/getting-the-screen-dimensions-for-air-windows/#comments Fri, 02 Oct 2009 01:38:58 +0000 juandevelops http://juandevelops.wordpress.com/?p=132 ]]> I want just to make it easier to get the screen dimensions found under the screen. I used the code found here: http://cookbooks.adobe.com/index.cfm?event=showdetails&postId=10823

So i just created a class that is static, and gives me the rectangle dimensions just when i need it and saving me writing the code..

package com.juandevelops.air.utils
{
import flash.display.NativeWindow;
import flash.display.NativeWindowInitOptions;
import flash.display.NativeWindowSystemChrome;
import flash.display.StageDisplayState;
import flash.events.EventDispatcher;
import flash.geom.Rectangle;

public class ScreenUtils
{
public static function getScreenRectangle():Rectangle
{
//set the window options before creating the window…
var options:NativeWindowInitOptions = new NativeWindowInitOptions()
options.systemChrome=NativeWindowSystemChrome.NONE;
options.transparent=true;

var tmpWindow:NativeWindow = new NativeWindow( options );

//blow up the window to take up the full size of the monitor…
tmpWindow.stage.displayState = StageDisplayState.FULL_SCREEN;

var rect:Rectangle = tmpWindow.bounds.clone();

//get rid of invisible window
tmpWindow.close();

return rect;
}
}
}

so it will be easier to use ScreenUtils.getScreenRectangle() anywhere else.

As i  looked into lynda.com air tutorials: http://www.lynda.com/home/DisplayCourse.aspx?lpk2=596
I learned that from an air application i can copy data items in the following formats text, bitmap, html text. Those formats work well if i paste the clipboard data to a non-air application such as copying bitmap data to fireworks.

Their tutorial explained the possibility to also disguise an instance of a custom class as a regular object, and use that datatype to paste it into another air application.

There are instances of classes in AIR which can be transparently copy and paste from one app to another such as the case of ArrayCollection.
The secret behind is their classes implement IExternalizable.

Here is my first atttempt making use of accessing the copied data in clipboard as a simple object

//- my class

package model
{
public class Lifter
{
public static const FORMAT:String = “model.Lifter”;
public var name:String;
public var age:uint;
public var weight:uint;

public function Lifter()
{
}

public function toString():String
{
return “Lifter[ " + this.name +", " + this.age + ", "+ this.weight + " ]“;
}
}
}

//app A

var l:Lifter = new Lifter(  );
l.name = “Juan”;
l.age = 34;
l.weight = 10;

var c:Clipboard = Clipboard.generalClipboard;
c.clear();
c.setData( Lifter.FORMAT, l  );

//app B

var c:Clipboard = Clipboard.generalClipboard;

if( c.hasFormat( Lifter.FORMAT ) )
{
var l:Object
l = c.getData( Lifter.FORMAT ) as Object;
trace( l.name  );
}
else
{
trace( “we are sorry format is not included.. ” );
}

The first attempted worked, but the data is no longer of type Lifter instead just a simple object.

Second attempt make the data in clipboard be copied an instance of type Lifter and be able to get the data back as of type Lifter.

I follow David Tucker’s advice of using registerClassAlias in both sides of the coin for the object to appear transparent as being of its class type. It is great to read his blog, and helped me to have this example

Well, i had to make the changes to my Lifter class, implementing IExternalizable, in the adobe livedocs, they describe members of the class not being public but in my example i have my members public, in the same way as in David’s example.

package model
{
import flash.utils.IDataInput;
import flash.utils.IDataOutput;
import flash.utils.IExternalizable;

public class Lifter implements IExternalizable
{
public static const FORMAT:String = “model.Lifter”;
public var name:String;
public var age:uint;
public var weight:uint;

//in my first attempt i set the members above as private, and set parameters in the constructor to assign them to the class
//when i tried to get this instance from the clipboard, i had argument errors as i was missing those arguments.
//best advice, make your constructor have no parameters, and you can set your members as private, and use setters and getters
//to read and write to them.

public function Lifter(  )
{
}

public function toString():String
{
return “Lifter[ " + this.name +", " + this.age + ", "+ this.weight + " ]“;
}

public function writeExternal(output:IDataOutput):void
{

output.writeUTF( this.name );
output.writeUnsignedInt( this.age );
output.writeUnsignedInt( this.weight );
}

public function readExternal(input:IDataInput):void
{

this.name = input.readUTF();
this.age = input.readUnsignedInt();
this.weight = input.readUnsignedInt();
}
}
}

//now here is my app A

var l:Lifter = new Lifter(  );
l.name = “Juan”;
l.age = 34;
l.weight = 204;

registerClassAlias( “Lifter”, Lifter );

var c:Clipboard = Clipboard.generalClipboard;
c.clear();
c.setData( Lifter.FORMAT,  l );

//now here is my app B

var c:Clipboard = Clipboard.generalClipboard;
registerClassAlias( “Lifter”, Lifter );

if( c.hasFormat( Lifter.FORMAT ) )
{

var l:Lifter;
l = c.getData( Lifter.FORMAT, ClipboardTransferMode.CLONE_PREFERRED ) as Lifter;
trace( l ); //output: Lifter[ Juan, 34, 10 ]
}
else
{
trace( “we are sorry format is not included.. ” );
}