Stealing from Picasso (and Cameron Moll) this list focuses on the difference between good developers and great developers when building, maintaining and tweaking web sites and web applications.

 

When using ViewStacks in Flex 3, the child components are not instantiated until the specific ViewStack component in which it resides is displayed. If you need to access the components prior to them being viewed, you avoid getting null values for components using a couple of methods.

 

We recently created a survey to help us better understand certain circumstances about our customers in the current economy and how we could use that information to increase sales conversions for our products. After a customer took the survey, they were redirected to a sign up page on our web site to enter a drawing to win one of several gas cards.

 

I have a stored Boolean value in a database as a varchar(5): "true" or "false". In Flex, if you wish to use that value as a Boolean object, say in an "if" statement, you will need to convert that string to a Boolean type.

Unfortunately, in Flex it will not work as expected when casting the string as Boolean. If the string is null or empty, the conversion to Boolean will provide a FALSE value. Otherwise, the conversion will return TRUE.

var t:String = "true";
var b:Boolean = new Boolean(t);
trace(b); // b is true because t has a value other than null or "".
// Now change the value
t = null;
b = new Boolean(t);
trace(b); // b is false because t is null.
// Now change it again
t = "";
b = new Boolean(t);
trace(b); // b is false because t is "".

So, unlike ColdFusion, the Boolean object in Flex does not consider the actual value of the string. Just whether it HAS a value at all.

One solutions is:

t = "true";
b = new Boolean((t == "true"));
trace(b); // b is true because t is equal to "true".

If you compare t to "true" it will return a Boolean true. Otherwise, it will return false. I like this because now with the Boolean object, it can be used within any comparison situation where a true/false value is necessary.

You can read more about Flex Type Conversions on Adobe's web site

 

As I've been working on my Flex projects, I've noticed several things that I keep remembering as I experience errors, troubleshoot logic, or look up references:

1) Realize That Flex Is Case-Sensitive

This was probably the first thing I had problems with. While I tried to follow case in naming and referencing ColdFusion variables and functions, I still found myself troubleshooting Flex errors due to case-sensitive typos. But you'll get over it quickly.

2) Purchase Flex Builder

I've developed Flex using the SDK and command line compiler and while it is free and works, using Flex Builder saves you so much time and effort. The auto compiler, along with the code insight for Flash AND Flex objects and functions, and the lovely debugger makes it so much faster and much more fun to develop. Make the $250 investment for at least Flex Builder Standard and if possible the Flex Builder Pro w/Charting for $699.

3) Understand That Flex and ActionScript Are COMPLETELY Object-Oriented

Having been a ColdFusion developer for the past 7+ years, I never really experienced the true OO nature of a lower-level programming language, aside from Java. I understood the basic concepts of classes, inheritance, encapsulation, polymorphism, etc. but never saw the need in CF because even with components, it's still very procedural and limited in some aspects. But, with that in mind, ColdFusion is also a lot less complex, and in almost every way it is much easier to work with.

4) Get Used To A Completely Event-Driven Architecture

This is one of the greatest traits of Flex (and event-driven programming): every action/event is driven by an action/event. In order to even do anything in Flex, an event must happen. In the beginning a ColdFusion developer might find this frustrating, but in a sense, the same principles apply with ColdFusion, like a user submitting a form, and you process it. It's just with Flex, handling ResultEvents or other Events takes a little getting used to.

5) Know That Flex And ColdFusion Work Very Well Together

From handling queries to structs to arrays to every other variable type, ColdFusion and Flex easily communicate.

6) When Possible, Use RemoteObjects To Communicate With ColdFusion

Speaking of ColdFusion and Flex working well together. If you use remote objects, there will be less overhead in the online communication between CF and Flex. This is because RemoteObjects communicate using the binary Action Message Format (AMF).

7) Remember That ActionScript Is A Lot Like C#.NET Which Is A Lot Like Java Which Is A Lot Like...

(Just in case you're learning C# or interested in learning it) While MXML is tag based (it is XML), you'll usually create a Flex app with a combination of both MXML and ActionScript. Since I've been getting used to ActionScript, I've also been getting used to C#.NET, which is the language used on the web site where I work. They share similar syntax and OO properties and frameworks, which has actually enhanced my learning of C#. It has also helped my Java programming, but then I'm already somewhat familiar with it having used it often with ColdFusion.

8) Bookmark blog.flexexamples.com

I'd like to personally thank Peter DeHaan for creating and managing flexexamples.com. I often reference the Flex code snippets at flexexamples.com to figure out the simplest but most effective solutions.

9) Get Tour de Flex

Another great tool for learning the basics of Flex components and objects. I used it more often while first learning Flex, but I sill sometimes refer to it to remember how to setup and use some objects. It does contain more complex third-party examples too.

10) First, Build A Simple App That YOU Need

I would recommend this with any other programming language, but with Flex it makes a lot of sense. If you can build a Flex app that you need, say a web-based widget or new Flash web site, you'll quickly become familiar with the more basic Flex concepts. Move beyond the irksome and obvious "Hello World" app and build something useful. Then post it online!

11) Get Familiar With The Flex UI Components

Some Flex beginners may find themselves trying to build a list or UI layout component that may already exist. I once tried to build a control almost identical to the TileList control. Why build it if it already exists?

However, sometimes you may want to tweak the control to behave or look differently. Because of #3 above, you can create your own control and extend the control you want to modify. Done that many times, and I love the custom functionality you can create.

12) Blog About The Problems You Find/Solve, No Matter How Simple

Unfortunately, I only blog about some of the problems I encounter and subsequently solve. I hope to do it more often. You'll likely find someone else has the same problem you have solved and you'll save them a lot of time and effort by posting the solution on your blog.

Any other thoughts? Feel free to add a comment!

 

Using the AnimateProperty object, you can do some great effects on various properties of an object. The following code is simply a custom Flex component with a canvas containing a label.

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"
   borderStyle="solid" borderColor="#7D88B5"
   width="200" height="50"
   verticalScrollPolicy="off"
   backgroundColor="#0F1739"
   backgroundAlpha="0"
   rollOverEffect="{anOver}"
   rollOutEffect="{anOut}">

   
   <mx:Script>
      <![CDATA[
         import mx.events.EffectEvent;
         [Bindable]
         public var title:String = "[no label]";
      ]]>
   </mx:Script>

   <mx:AnimateProperty id="anOver" property="backgroundAlpha" fromValue="0" toValue="1" duration="300" isStyle="true" />
   <mx:AnimateProperty id="anOut" property="backgroundAlpha" fromValue="1" toValue="0" duration="300" isStyle="true" />

   <mx:Label text="{title}" id="lbltitle" color="white" fontSize="24" top="6" left="15"></mx:Label>
</mx:Canvas>

To animate the backgroundAlpha, I first set it to 0 in the Canvas. Then I add the "rollOverEffect" and "rolloutEffect" attributes and set them to the AnimateProperty objects "anOver" and "anOut", respectively.

One problem I found was since the backgroundAlpha property is a style, you need to make sure and add the "isStyle='true'" attribute and value for the AnimateProperty object. That caused me a little headache.

You can modify the duration (in milliseconds) to make it fade faster or slower.

Sometime, I'll have to look into animation. From what I've seen it doesn't seem to be terribly difficult.

 

I have a few database tables in MySQL with columns defined as BOOLEAN data types. It should be noted that if you plan to work with BOOLEAN data types in ColdFusion queries, you need to specify the cfsqltype as "CF_SQL_TINYINT" in the <cfquerypram> tag as follows:

<cfquery name="qry" datasource="#application.dsn#">
SELECT * FROM tablename
WHERE is_active = <cfqueryparam value="#varname#" cfsqltype="cf_sql_tinyint" />;
</cfquery>

As quoted from the MySQL documentation:

"[Boolean] types are synonyms for TINYINT(1). A value of zero is considered false. Non-zero values are considered true:"

 

I've recently needed to add a resizable canvas in Flex to allow users to resize an image with a border for a new project. The best way (that I'm aware of) is to add event listeners to mouse down event on a draggable image in the corner of the canvas.

Basically once the user clicks on the corner image, you tell Flex to resize the canvas based on where the mouse moves:

<mx:HDividedBox id="hdivide1" height="800" width="900">
      <mx:Canvas id="leftmenu" width="270" minWidth="270" height="400" backgroundColor="black">
         <mx:Image top="0" left="0" id="topLogo" width="270"
            source="@Embed(source='images/Super Final Adornit Logo OL.png')" />

      </mx:Canvas>
      
      <mx:Canvas id="canvasCont" width="100%" height="100%">
         <mx:Canvas id="drawCanvas"
            height="500" width="500"
            maxWidth="500" maxHeight="500"
            backgroundColor="blue"
            verticalScrollPolicy="off" horizontalScrollPolicy="off">

            <mx:Image id="filterImage"
               source="@Embed(source='images/Curly Border_Black_Horiz.png')"
               height="100%" />

            <mx:Image id="resizeIcon" source="@Embed(source='images/Resize.png')"
               mouseDown="startResize()" right="0" bottom="0" />

         </mx:Canvas>
      </mx:Canvas>
   </mx:HDividedBox>

This code shows the Flex containers that I allow to be resized. Now the script is thus:

<mx:Script>
      <![CDATA[
         
         private function startResize():void {
            stage.addEventListener(MouseEvent.MOUSE_MOVE,resize);
            stage.addEventListener(MouseEvent.MOUSE_UP,stopResize);
            resizeIcon.addEventListener(MouseEvent.MOUSE_UP,stopResize);
            resizeIcon.startDrag();
         }
         
         private function stopResize(mouseEvent:MouseEvent):void {
            resizeIcon.removeEventListener(MouseEvent.MOUSE_UP,stopResize);
            stage.removeEventListener(MouseEvent.MOUSE_MOVE,resize);
            stage.removeEventListener(MouseEvent.MOUSE_UP,stopResize);
            resizeIcon.stopDrag();
         }
         
         private function resize(mouseEvent:MouseEvent):void {
            drawCanvas.height = canvasCont.mouseY;
            drawCanvas.width = canvasCont.mouseX;
         }
      ]]>
   </mx:Script>

When the resize icon gets mouse_down-ed it triggers the startResize() method. All that method does is tell the stage and the canvas to listen for when the mouse is released. In the meantime as the mouse moves the resize() method is called and it sets the size of the canvas based on where the mouse coordinates are.

I'll post a working version here in a few days when I have it working so that you can "crop" and image and place a border around it. As I may have mentioned on Twitter, this is for a scrapbooking project.

 

Local information sources suggest that the In-N-Out Burger restaurant chain is expanding in Utah with restaurants in Draper and, more recently, American Fork. Several colleagues, friends, news stations, and government agencies have stated that this is a good thing and for some odd reason, I've shared in their excited delirium... even though I've never eaten at your joint.

Sources also tell me that your restaurants only serve fresh ingredients and the rumor is you look to local sources for your food inventories. This is very refreshing since we found out recently that McDonald's actually freezes their burger patties and trucks them from who knows where. Shocking. I hope they don't take "being green" to the extreme and "recycle" those patties back into their inventory.

Speaking of the environment, I believe you will be able to assist us here in Cache Valley, Utah with a very serious environmental problem: cow pee. Far be it for me to use the words "cow pee" on the same web page as the sacred words "In-N-Out Burger," but please hear me out.

The main issue is that we have a lot of cows and the problem is that our cows produce a lot of pee which causes some ammonia reaction in the air that makes it turn bad and then we subsequently breath this crap (pee) which is unhealthy. Now, I'm a bovine-lover as much as the next prime rib eater, but when my source for steak is the main cause of the sour air that my family breathes, I have to draw a semi-transparent-grey line and put my foot down softly. And with the EPA involved in helping us solve this problem, we'll never get it fixed!

Hence, my proposal to you is please build an In-N-Out Burger in Cache Valley. We obviously have enough fresh, semi-clean, beef for at least 4 or 5 restaurants. You'll have fast, local access to as many cows as you need, we'll breath a little easier, and we local carnivores will live a little longer by eating more fresh beef and less frozen beef. Thus, we'll have more time to eat your fresh-beef burgers. Now if that's not an environmental win-win then I don't what is.

Oh, I almost forgot. We've got plenty of local cheese and our close neighbors to the north have just informed us that they have plenty of potatoes for your french fries. Now if we could just get Mexico, Chile and Brazil to move up here, we'd have plenty of local lettuce and tomatoes!

Thank you for your consideration in this most important matter of environmentally friendly, quality food.

 

I use Apache as the web server on my Windows XP development laptop. This is because I need multiple web sites with their own web root and I can't do that in IIS on XP (it only allows one web site). I haven't been able to find a workaround and besides, Apache is just plain awesome.

I was having a problem today with not being able to access my web root. After some looking I realized that after I created a virtual host (http://test.local:8080) to one directory, I could no longer access just plain localhost (http://localhost:8080). This worked just fine on another machine I had. So, after looking at its configuration, I realized that I needed to add a virtual directory

    for localhost
if you're going to use virtual directories in the first place. So, it was a simple fix in my virtual-hosts.conf file (which I include in my httpd.conf file):

NameVirtualHost *:8080

<Virtualhost *:8080>
ServerName localhost
DocumentRoot "c:/web"
CustomLog logs/localhost.access.log combined
ErrorLog logs/localhost.error.log
</VirtualHost>

<Virtualhost *:8080>
ServerName test.local
DocumentRoot "c:/web/test"
CustomLog logs/test.local.access.log combined
ErrorLog logs/test.local.error.log
</VirtualHost>

Just a simple fix to a seemingly simple problem.

 

more entries

BlogCFC was created by Raymond Camden.