Is Bender an AS generator? Is it a service layer for Transfer?

Bender is a new project under planning/development by Toby Tremayne. From what I can tell, Bender will consume your Transfer.xml file and generate AS3 classes, generate an AS3 proxy with a Transfer-like API for calling your remote services and also translate back and forth from CF to AS3. Seems very cool for getting information out of a ColdFusion backend and into Flex.

There is also talk of a Service layer section to Bender though I haven't seen much information on this piece. Proper architecture would demand an intermediate layer in between the ORM and the Flex remote object calls. It only takes one sneaky 13 year old kid to methodically delete all the information in your database.

Maybe Toby can share some details on how this will all work together.

2324 Views Print Print Comments (0) Flex

Flex posters have tapped out

A notice went out from Ted Patrick's blog the other day about Flex Posters. I actually have a nice set of Flex posters thanks to Shlomy Gantz and the fine New York Flex user group. Apparently folks have been emailing Ted directly for posters and a form on flex.org was set up to take and fulfill the requests.

[More]

2483 Views Print Print Comments (0) Flex

Final Keynote at 360Flex

Live blogging. As always, please ignore the typos and all mistakes are mine.

Sitting on my chair was an announcement for the Flex Cookbook. The cookbook is a growing resource for Flex questions and answers. Please have a look.

The Keynote:

Ted Patrick introduces Tom Hobbs from Adobe. Tom begins by discussing Designer / Developer workflow in the context of cycle racing. Cycle racing is not a spectator sport. The spectators wait for hours until the cyclists come by and then there is 2 seconds of action. On the projector screen Tom shows an example of the Amgen Tour and we can see a very slick application that follows the racers. The application will let the user select which racer to follow and keeps track of the race progress via maps from Yahoo. Additionally, the app references pictures from Flickr. The application is VERY nice and Tom says the Amgen Tour application was completed by 3 people in 6 weeks. 1 Designer, 1 Programmer and 1 System Architect.

Tom discusses the workflow between each of the three roles. The process is iterative, explorative and a lot of back and forth between principles. It is important to balance the interface and the infrastructure. Tom is explaining the challenges of syncing content from disparate sources and media types into a single real-time application. The application began looking quite simple on the back end and the final result is very involved.

Value = Simplicity + Quality

  • Design for the 80% of users
  • Show only tools needed for the task
  • Do more where you are
  • Let content breathe.

Content

  • Design Content not chrome
  • Express things visually
  • interact deeply with content

Animation

  • Flow orientation and Guide
  • Predictive
  • Task based vs. Tool based
  • Cinematic Transitions
  • Evokes Emotion, Focuses attention

Design as a Whole

  • One person or team should design
  • If features change significantly, the whole must be reconsidered
Personality and Community Rule
  • People and communities want to express themselves
  • Comminity creates better content
  • Users want different things, to use in different ways,
  • Identity and brand matter


Tom exhorts us to "Build to Think" and to not fear iteration in design.

Ted Patrick is now on stage and will talk about Next Flex. He gives the disclaimer that what we will now see might not make it into the final release. Ted stresses the open development process at Adobe and wants us not to get too upset if the final product changes.

One of the goals of the New Flex is to expand the reach of the RIA to include desktop, web and offline applications. Another goal is to make it easier for web and enterprise developers to learn Flex. Adobe wants to invest in the platform to serve the needs of the enterprise and that of the "Flex Ecosystem". Ted continues to stress the open development process and openness to the needs of the community.

The Next Flex will be built on Flash Player 9. ( In a meet the Flex Team session last night, I asked if the level of change from Flex 2 to Flex 3 would mirror the level of change from Flex 1.5 to Flex 2. Thankfully, they said it wouldn't be so dramatic from the coding perspective.)

Ted is now talking about the integration of the CS3 suite. Each of the applications will produce an output suitable for Flex / Apollo applications.

Demo of Fireworks Ted starts of with a Blank Fireworks project. There is a Common Library inside the Fireworks application that contains Flex Components. Ted chooses a panel and resizes it showing how the design scales in accordance with Scale9. Now Ted adds buttons and checkboxes to the panel and exports the whole panel as "MXML and images". The output is images and a working MXML representation of the Panel Ted laid out in Fireworks.

Borneo, the new Flex Data Services. The upcoming release of FDS (soon to be named Live Cycle Data Services) includes Scalability and performance enhancements. Integration with LiveCycle and a vastly improved <mx:Webservice> functionality.

Moxie the new Flex SDK and Builder

  1. Improving the language intelligence in the IDE
  2. Integrated Profiler
  3. Design View Enhancements
  4. Data Integration
  5. Enhanced DataGrid and Lists

As an example, Ted shows an example of an MXML application in the new Moxie IDE. He points out he doesn't like how the developer named the methods. He selects the method and clicks Refactor from the context menu and chooses 'Rename'. The Flex Builder application changed all the instances of the methods in ALL files, not just the one he was currently in. This will work with methods and properties, not sure what else. What a cool feature! Now he shows a Control + G search that will show where an element is used in an application. This search is context aware and if you search for a property, it will only find properties, not similarly named methods.

The talk shifts to the Flex ecosystem. Ted talks about how many companies and entities are involved outside of Adobe.

ESRI created vector based mapping component service. Rather than the normal Mercador projection style maps, the format that shows Greenland as the size of the United States, the ESRI format shown doesn't have the same distortion bias.

Farata Systems created a business intelligence application. The application features a drag and drop custom reporting module with custom filters.

Ted now talks about FlexLib. FlexLib is a GoogleCode based repository for Open Source Flex Components. This project is very new. Expect to see lots more components in the coming weeks. If you have components, you can submit them for inclusion in the FlexLib project.

Now Ted highlights Yahoo. Yahoo has a lot of APIs that can be used inside Flex applications. Ted shows Term extractor. This is an application that will take a term entered by a user and will map relevant other terms. Each term shown will link to other terms and if a term is clicked, another tree will generate. Very interesting application.

4066 Views Print Print Comments (0) Flex

Flex 101 Components and Containers with John Wilker

I am sitting in the Flex 101 Components and Containers course. I say course because unlike the other 3 tracks the room set aside for the Flex 101 track is set up with tables, power supplies and ready for some hard core coding.

This session is taught by John Wilker. John is very good at explaining simply the inner workings of Flex. He is building an RSS reader application right now and explaining the MXML tags used.

Canvas
Used to set position of the application.
HBox / VBox
Lays out children containers in a horizontal / vertical fashion.
Form
Contains FormItem tags. FormItem tags have labels and contain specific types of data collection fields. The Default behaviour of the Form tag is to place the labels on the left, text-aligned right and the data collection objects on the right. This can of course, be changed to suit your needs. The form tag has NO behaviour. It is purely a layout container.
Grid
Lays out tabular data.
HDividedBox/ VDividedBox
Lays out and divides the children horizontally / vertically. Allows the user to resize the divisions.
Panel
Makes a bordered section of content and has useful properties such as Title. Very nice rounded corners!
Tile
Very similar to the grid, I am not sure what the differences are at the moment. I need to read up on this.
ApplicationControlBar
Sticks a container at the top of the mxml application. Useful to place controls to use with the application. Has a dock=true/false property that if true, will peg the controlbar to the top and exempt it from scrolling. I might have to play around with this.
ViewStack
A non-visual control used to group a series of containers. Only one container is visible at any time and you can programmatically control the bisible component using the selectedIndex property of the ViewStack. Out of the box, the change in visible items is immediate though it is possible to customize and extend the ViewStack to do this.

4065 Views Print Print Comments (0) Flex

Component Based Development in the Flex framework

This was one of the MUST SEE presentations on my list. Building reusable components is a great way to provide customized Flex functionality and I was very excited to actually get a seat in this packed session. There were at least 40 people sitting on the floor!. I took a lot of notes and will make some available below. The slides are a great reference and they are available at: Chafic Kazoun's blog located at http://www.rewindlife.com

Notes below:

Flex Components are reusable components that are self contained. Using component are a proper way to write maintainable applications in Flex. Using components can be a lifesaver for team environments because it helps insulate the impacts of change in component development.

A cheat sheet for starting a new custom component:

  1. Decide on what the component should do
  2. Don't overthink the API just yet
  3. Provide protected data access and limit what can be passed into the component
  4. Finally, decide on the public API

Setting up the component:

  1. The root MXML tag is the base class. This is often a container you use to contain the component.
  2. Next, specific a package through a directory structure.
  3. You MUST reference the Flex mxml namespace.
  4. Using the component in a Flex application means you must import the component and assign it to a namespace.
  5. Treat the component like a black box.

Fun Facts:

  • When you import a component into a Flex application, Flex Builder will find the namespace and give code hints based on the properties of the component.
  • If you make a public bindable, the get and the set are both made binable regardless if the [bindable] directive is on the get or the set declaration.
  • Using past tense events is not good practice. For example, FormChangedEvent is not a good representation, use FormChangeEvent instead.
  • Override the public function clone inside your Event class. The clone should return a new event and provide the setup code for initializing the event.

5228 Views Print Print Comments (0) Flex

ByteArray101 with Ben Stucki

This presentation by Ben Stucki, a software engineer with Atellis, is on ByteArray 101. This is directly after lunch so I am struggling not to slip back to the hotel and have a nap. However, as has been said before, "Sleep: a poor substitute for caffeine. ~Author Unknown" and the fine organizers of 360Flex have ensured a continual supply of caffeine.

Flex gives you the power to work with one byte at a time. This means content and formats that aren't fully supported can be read with a ByteArray. All data is represented as binary. Also, sockets use binary data so using the ByteArray is perfect for extending the fles framework in new and exciting ways. A byte is 8 bits and a bit represents an on / off state.

Ben is now going over bit arithmetic. 00000001 = 1, 00000010 = 2 etc. Bytes have a maximum value of 255. 4 Bytes can compose a uint(unsigned integer) or an int. 8 Bytes compose a number data type and a string is a variable number of Bytes.

A Byte array is an array of Bytes and typically the array is read from beginning to end. There are several convenience methods to read Bytes and each reads a different number of Bytes before evaluation. Common methods are readUnsignedInt(), readDouble(), depending on how many Bytes you wish to read at a time.

ID3 tags are used in MP3 files to track meta data in an mp3 file. Represented as a ByteArray, each type area represents certain information. To validate an ID3 tag, read and evaluate the first three Bytes. If proper, the result will be 'id3'. The following 2 Bytes represent major and minor version respectively. Thus, by reading the Bytes, you can determine a lot of information about a stream of Bytes.

Ben is now using Apollo and Apollo code samples for this presentation. Even though this is primarily a Flex conference and Apollo won't be released until the end of the year, I am very excited to see more Apollo!

Ben's example application will pull in Album covers and read the ID3 tag information from a file. Now he is showing how to open a file from the file system. The UI control is similar to the HTML file browse but there is come custom code needed to read the list of files in. He filters the results of a file.browse() command to include only .mp3 files. Then he fills an array with the results.

Soliloquy: Now that I have seen Apollo source code, I believe it is the same code in Flex, just with a different API. How very nice that I won't have to learn yet another language. Now back to the application demonstration.

Once a file is selected, he reads the file from the filesystem using a FileStream. Then he walks from byte 0 and reads the specific sections of the byte stream. He traces out the results from the reads and we can see on the screen the id3 header. Cool stuff. You won't be doing that with javascript so take that AJAX fanboys!

Ben stresses all file formats have an established header with an ID section and other header meta data. If you know the file format, you can read any file byte by byte. Understanding it, however, is your problem (Ben's joke not mine ;))

Back to reading Bytes, Ben is tracing out all of the ID3 tags in the mp3 file read from the file system. There are a lot more tags than I thought in an MP3 file. for example, if the beginning of the ID section of a tag is 'T', the rest of the tag should be processed as text. If the ID section of a tag is 'APIC', then the tag contains information about an image thumnail somewhere in the file. You can get the start and end position of the image by reading the additional information in the tag. After the image is copied into another ByteArray, Ben creates a new Loader() loads the Bytes from the image ByteArray and then image that was once embedded in the MP3, is now displayed to the user. Look! Album Cover Art!

From this session, I feel much more confident about applying and extending Flex and Apollo. Since both frameworks offer the ability to process binary data one byte at a time, I as a developer will be able to create compelling solutions for my clients without being dependent on supported formats. To date, this was the most low-level demonstration of the power of Flex and Apollo. This isn't your Mommas HTML.

Ben shifts to Sockets and Streams now. He says the methods used to work with Sockets and Streams are the same as he used when reading a file. The key difference is a streams and sockets do not have an 'end' like a file does. Also, sockets are bi-directional.

Ben points a digital video camera at the audience. A picture of us shows on the presentation screen. This particular produces a stream of images in an MJPG stream or a stream of JPG images. There is no formalized specification for MJPG so this illustrates how to use a looser format or specification. Ben has an image effect used on this stream of JPG images. At the bottom of the images is a reflection sort of effect which looks like the pictures are reflecting off water. Very Cool Stuff.

The funniest part of this session is during the Q&A section, an audience member asked Ben if he would trust his life to an application written with Flex. Confidently, Ben answers with the affirmative. The audience member asks if Ben would trust his life to an application written in Apollo, Ben says 'Yeah', and after a pause, 'Well, not right now, Apollo is in Beta.' Gotta love that.

7939 Views Print Print Comments (0) Flex

360 Flex keynote

This is oN-tHe-FlY reporting from the front row of 360Flex. (ignore the numerous typos)

Introducing Mark Anders, Sr. Principal Scientist at Adobe.

Mark just took a poll of all the attendees and asked whom was the flash developers. Not suprisingly there was less than 15% flash developers. Now he is talking about the Flash IDE and talking about how confusing the Flash Timeline is and asks the question "How do I build an application with a Paintbucket tool?" Having tried flash development around the Flash 5 time, I can completely agree.

Mark is giving us the background behind the Flex framework. Flex is a programmatic framework for building Flash based applications.

What makes Flex Magical?

  1. MXML - an XML based language to specify creating object trees and also provide a Domain Specific Language for actionscript objects and classes.
  2. Data Binding - Allows updating of the User Interface when the underlying data changes. This is a foreign concept for folks used to HTML development. In HTML development there really is no state, simply a post-response model. In Flex, bound data, when changed, will change all over the Flex application wherever the bound data is used.
  3. Composition -
    1. New components can be built by assembling existing sets of components.
    2. Templates are placeholders within a component to be parameterized on use. Mark points out code fragments can be passed in to customize the llok and feel.
  4. States - States represent configurations of an application. You can add, remove and change components for a particular view state.
  5. Based on Flash. Flash is a very powerful render

Mark Anders Mac locked up during the presentation. Someone in the audience made a joke that due to Mark's Tenure at Microsoft, the Blue Screen has been implanted in his mac. Now he says, it is probably Microsoft software because he is using MS Powerpoint. ;).

Mark has shown several examples and applications that were very compelling. It is pretty amazing what can be done with Flex. One example of an MXNA reader used a fisheye component to switch between MXNA channels. When a specific channel was clicked, the channel icon bounced up and down and when the channel was loaded, the channel icon had smoke pouring from the top of it. It was VERY cool and the visual model made perfect sense even for an uneducated user. For me, this is the BIG power of Flex because no only can you design and create these types of applications but you can guarantee cross platform consistancy.

Mark mentions the Virtual Machine for ECMA script was donated to Mozilla. Engineers from Adobe and Mozilla will be working on the Flash Player 10 engine. This is very nice as it will help adoption of the standard.

Now Mike Downey is on. Mike is the Senior Product Engineer for the Apollo platform. Apollo Features:

  1. Local File access
  2. Online / Offline detection and events
  3. Full Drag and Drop capabilities
  4. Clipboard access
  5. Background Processing
  6. Multiple Windows support
  7. Customized chrome. ( This is cool because spectra didn't allow this.)

Mike says making a Flex application an Apollo application should be pretty easy. This is good news and when apollo comes out we can build on what wwe have rather than a top-down rewrite. Mike is now showing a demonstration of an Apollo application called Buzzword. Buzzword is a Word Processor application built with Apollo. The performance with entering text is quite fast. None of the latency I would have expected. Since Apollo can write to the file system, it is a better choice for Word Processing than a web based word processor application.

Mike is now showing a Google Maps integration. This shows Flex + AJAX. The vCards from Mike's address book are shown on the left. He drags a vCard over to the gMaps interface and the address is zoomed to in gMaps. Very cool. Now he is showing a Firebug like implementation done in Apollo. I don't think it will overtake the Firebug utility, but it is cool to see the hooks into the browser runtimes.\

Mark has taken the stage once again. He is talking about the upcoming Flex 3 release. The main ideas for Flex 3 are:

  1. Enhancing the Designer / Developer workflow
  2. Better integration with the Adobe Creative suite.
  3. Adding and enhancing data components
  4. Integrating Apollo into Flex Builder
  5. Enhancing the framework to take advantage of new Apollo concepts and services

The release schedule is as follows:
The first half of 2007 will see the Apollo public labs release, the Flex 3 'Moxie' release and Creative suite 3.
The second half of the year will see the 1.0 release of Apollo, Flex 3, Philo 1.0 and Flash Media Server.

6895 Views Print Print Comments (1) Flex

Walking to the 360Flex conference.

I am walking over to the EBay Complex for the beginning of the 360Flex conference. I am not sure if WiFi is available during the conference. EBay is a fully functioning company after all, and as nice as they are, I would fully understand if they didn't want 400+ strangers on their network. We shall see.

There is a pretty active Twitter set here. I decided to reserve judgment on Twitter until I used it for a few days, but thanks to Twitter, I found out about the Pre-registration and the Pre-conference party. Very useful tool

I met some of the Conference attendees last night at a pre-conference bar session. A very nice group of folks. I got there late and I heard the group was up to 30 people at one point. I blame my tardiness on The Melting Pot. Amazing how long it takes to cook your own food ;).

1897 Views Print Print Comments (0) Flex

From San Francisco to San Jose

After a fun filled weekend in San Francisco, a nice afternoon snack in Half Moon Bay, I am fully checked into my hotel in San Jose for the 360Flex conference.

San Francisco ranks as one of the top cities I could live in. After leaving New Jersey after interminable months of cold weather, I must confess to being more at home in ~70 degree temps. I am from Florida after all.

Biorhythmically on East Coast time, I popped out of bed at a very early 6AM and went on a long foot tour of San Francisco. After 12 miles on foot, I feel like a truck gently ran me over. I am resting now and hoping the pain in my legs and calves goes away.

I realized about 7 minutes after I got here, I should have brought warm weather clothes. I definitely didn't need my winter jacket nor my gloves. Coulda packed a swimsuit also.

The conference starts in the morning and I am very happy to be here in San Jose. If you are at the conference, stop by and say Hi. I am currently in the Extended Stay hotel in room 228.

2951 Views Print Print Comments (0) Flex

Cairngorm with Michal Glowacki at NYFlex!

I am a big fan of frameworks in general. Using an established framework helps structure an application. Structured applications are much easier to understand and maintain. Additionally, using a framework can make programming an application easier, quicker or a combination of the two.

In the Flex world there are two main frameworks ARP and Cairngorm. I am very much interested in gaining proficiency in both frameworks and I admit to not having put much time aside for experimentation and learning.

[More]

3959 Views Print Print Comments (0) Flex