Ouch, it hurts when i do that

As promised, here are the slides for "Ouch! It hurts when i do that." presentation first delivered at 360Flex San Jose, March 10th, 2010.

Flex 4 for Flex 3 developers

Today, I presented my Flex 4 for Flex 3 developers presentation at FlashCamp Chicago. For those that wanted the slide deck, you can find it here.

In this, I discuss a number of differences between flex 3 and flex 4, and what an existing Flex 3 developer will need to know to start being productive in Flex 4.

Flex 360 tickets selling fast

Down to the last 5 (Cheap) tickets left for 360|Flex. Register now, save $100 and get the same awesome content for a little less coin. Act fast, these last tickets won't last. When they're gone, the regular price of $599 kicks in.

Come on out and hear me give advice how not to hurt yourself with code, in my "Ouch, it hurts when i do that" talk.

Wanna know more about how not to code flex apps?

I'll be presenting my freshly revised "How Not To Code Flex Applications" twice in the next few days. Tomorrow, in the boston area at RIA-Unleashed and then next week at Flash Camp Wall Street.

c'mon by and see us at one, if not both of these great events

FlexUnit 4 feature overview

How not to code Flex Applications

I woke up this morning...

and found the public beta of flash player 10 was out. How cool is that.

I knew this would be coming before too long, but didnt realize that it would be out so quickly. This new version is filled with lots of new features aimed at allowing greater "expressiveness" in flash player content, such as 3d effects, custom filters, enhanced text rendering, and revs to the drawing API. Of course, like each version before it, FP10 also has lots of performance enhancements. What are you waiting for go get it on adobe labs

I'm particularly looking forward to working with the Advanced Text Rendering features, which promise to allow lots of layout possibilities, including bi-directional text!

more later

My Speaking Engagements for the first half of 2008

1/18 - Flex Camp Chicago

1/24 - Flex Camp Omaha

2/24-2/27 - Flex 360 Atlanta

3/12-3/13 - CFUnited Europe

5/1-5/4 - CF.Objective()

5/19-5/23 - WebManiacs

6/25-6/28 - CFUnited

Reflecting an image in Flex

Increasingly, clients have been asking for a "reflection" effect, showing a vertically flipped image of a component next to the actual component.  After reinventing the wheel on this several times, I came up with this simple reusable component:

package com.tappernimer.components{
import mx.containers.Canvas;
import mx.core.UIComponent;
import flash.display.BitmapData;
import flash.geom.Matrix;
import flash.display.IBitmapDrawable;
public class VerticalReflection extends Canvas{
private var _component:UIComponent;
public var trans:Number=.5;
public var filterArray:Array=new Array();
public var skewY:Number=0;
public var skewX:Number=0;
public function get component():UIComponent{
return _component;
}
public function set component(c:UIComponent):void{
this._component = c;
// hack to work around issue with component being 
// a dynamically loaded image its possible for the 
// image to be fully loaded, but its height or width 
// not yet set this call later, keeps retrying until 
// the values are set.
if(c.width ==0 || c.height==0){
callLater(resetComponent,[c]);
return;
}
doReflection();
}
private function resetComponent(c:UIComponent):void{
this.component = c;
}
private function doReflection():void {
// create bitmap object
var bmpData:BitmapData = new BitmapData(
	component.width,component.height);
// create matrix
var invertMatrix:Matrix = new Matrix(1,skewY,skewX);
// set matrix to invert vertically, but normal horizontally
invertMatrix.scale(1, -1);
// move matrix, so top is at bottom, and vice versa
invertMatrix.translate(0, component.height);
// draw component flipped
bmpData.draw(component as IBitmapDrawable,invertMatrix);
// create a new holder for the image
var ref:UIComponent = new UIComponent();
// match new holders size to the original
ref.setActualSize(component.width,component.height);
// fill the new component with the image
ref.graphics.beginBitmapFill(bmpData);
ref.graphics.drawRect(0, 0, 
	component.width, component.height);
ref.graphics.endFill();
// set the transparency
ref.alpha = trans;
// apply any filters
ref.filters = filterArray;
// add image to stage
addChild(ref);
} 
}
}

This component can then be passed any other component to reflect, accepting filters (filterArray), alpha value (trans), and arguments to allow you to skew the reflection.  In fact, using it can be as simple as this:

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx=http://www.adobe.com/2006/mxml 
xmlns:c="com.tappernimer.components.*" 
layout="absolute">
<mx:Image id="image" source="images/tn_logo_full.jpg"/>
<c:VerticalReflection id="ref" 
component="{image}" 
x="{image.x}" y="{image.height}" 
filterArray="{new Array(new BlurFilter())}"/>
</mx:Application>
Here is the code running:
 
 

H.264 Support in FlashPlayer

I missed it yesterday, when it was announced, but Adobe has now announced support for H.264 (also know as MPEG4) in an upcoming version of the flash player.  H.264 is the same standard which is used by BluRay and HD-DVD -- the ability to have this type of video in our web applications is absolutly huge.  Remember, not that long ago, Adobe announced plans for the Adobe Media Player (AMP), as a desktop application which was built with AIR and Flash -- now, AMP will be able to use H.264 as well as FLV for its video content.

 

 

More Entries

BlogCFC was created by Raymond Camden. This blog is running version 5.9.001.