Demo: ListSelectedItemBoldExample

Files: ListSelectedItemBoldExample.mxml ListSelectedItemRenderer.mxml

PlugrMan: The Universal API Toolkit – By Almer/Blank

Developing an Enterprise Flex Application Strategy – by Chris Giametta

News – by Csomák Gábor

LockLizard FlashGuard – by Ali Nekou Pour

Anicca Digital Solutions – by Ali Raza

NetroMedia – by Josephine Liang

GPU-3D in Flash – by Eslam Ahmed

Creating a Distributed Video Hosting Platform – by Andrey Chernih

File handling with AS 3.0 – by Sachin Patil

CREATING CUSTOM VISUAL CLASSES – by Louis DiCarro

Adventures In ActionScript – Serializing Objects – by Huw Collingbourne

Test Driven Development Or How Not To Be Trapped In A Nightmare. Part 3 – by Marc Pires

Preparing Your Application To Use Push Notifications – by Brandon Trebitowski, Christopher Allen, and Shannon Appelcline

Interview With Lance Snider, Envato – by Ali, Nekou Pour

An Interview With Demetrio Fortman, CEO of MotoCMS.com – by FFD Team

Top 3 Book Recommendations – by Ali Raza

Flash&Flex Developer’s Magazine

FxConnect Framework

The FxConnect programming model is made up of:
• Application Framework: The Application Framework is the main wrapping component for the Application that contains application context and is responsible for the setup/initialization of the application.
• View Components/Modules: Modules are used to chunk the application into smaller SWFs that are loaded through the Module Manager. These modules are the features and components of the application where you start to code the different views and flows.
• Application State: The Application State is responsible for holding important application attributes in a memory cache that is accessible from any part of the application that gets an instance of this model.
• Data Model/Sub-models: The model provides a layer to access and change application data through creating proxies.
• Proxy: Proxies represent a layer of abstraction that exposes business functions to the application. They are a means to engage with remote services such as Spring beans to retrieve data. They contain the data result and fault handlers that are implemented through the IResponder class.
• Module Manager: The module manager allows you to logically partition the application into manageable view modules. Effectively breaking download of the application into small chunks that allow the views to be displayed on demand.
• Navigation: This is a business object that manages view state for components and modules. In this class, you set up constants that are maintained here.
• Style Manager: The Style Manager allows you to dynamically load styles into the application and is initialized at run-time.
• State Engine: This utility allows the definition of application states and the valid transition to which other states are available.
• Resource Manager: This utility is used to handle internationalization (i18n) and localization (l10n) details. You specify a default resource bundle by component or by application that allows you to define string names for button labels, text areas, etc.
• Error Manager: Error management allows you to capture and store errors from anywhere in the application as well as use its internal pop-ups to display error messages.

For more information please visit AppFoundation and contact us now.

http://www.appfoundation.com

http://adobe.flex.appfoundation.com

AppFoundation built this application using our Enterprise Flex Development Framework FxConnect. FxConnect cuts down on as much as 35% of development required to deliver Flex and AIR applications. The goal of FxConnect is to simplify development of large scale rich Internet applications (RIAs). The result is a framework that allows your company to start developing features out-of-the-box instead of worrying about core architecture issues that FxConnect addresses.

• Application Context
• Module Management
• Application Navigation
• Style Management
• Resource Management
• Data Transport
• Error Management
• State Management

We were able to turn this application around quickly by having the core architecture already in template form using FxConnect. This allowed us to focus directly on the features of this forecasting application.

For this project we started with the wireframe and design comps and then moved directly into development from here. This application is built on Adobe Flex, FxConnect, JSPs, and SQL Server as the database.

This application was broken down into three major functional areas; Workload, Client, and Timekeeper.

Workload allows the user to select a period in time to view total budgeted fees by month as you can see in the screenshot below.

Workload View

Client View

Timekeeper View

http://adobe.flex.appfoundation.com

October 14th, 2009 – 10:00 a.m. to 12:00 p.m.
Christopher A. Parr Library, Program Conference Room
6200 Windhaven Parkway, Plano, TX 75093

Data Visualization with Adobe Flex

ABSTRACT:

In this discussion, Chris Giametta will present an overview discussing the challenges of large data sets, complex data arrangements, and effective UI implementations using Adobe Flex.

This presentation is about building rich Internet applications that combine the interactive user experiences of Adobe Flex with the delivery of complex data from large data warehouses and databases. The goal for this discussion is to give you a better understanding of how RIAs can solve client needs in the business intelligence space.

BIO:

Chris Giametta is founder and President of AppFoundation Technology Group, a leading RIA company in Dallas/Fort Worth focused on data visualization and web based application development. AppFoundation employs advanced methodologies and tools to help decision makers build the situational awareness of their competitive terrain.

Chris is an Adobe Certified Expert in Adobe Flex. He was been working with Flex since 2004. Before learning Flex and Spring (Java based framework), he cut his teeth with EDS developing customer relationship management (CRM) systems built with Java on the front end, and a C++ implementation on the server side. He has extensive experience in delivering Business Intelligence systems, e-commerce, and ERP applications in a rich format.

As the author of Pro Flex on Spring, Chris focused on how to develop large scale applications using patterned based development to implement RIA technology.

You can contact Chris by visiting:

www.appfoundation.com

Each Sprint is 2-3 weeks in length. We plan out stories that compose what functionality will be delivered in the demo at the end of the Sprint.

Learn more about how AppFoundation uses Agile Software Development here:

AppFoundation goes Agile

AppFoundation Company Blog: GIS

The application was built on top of Modest Maps. Modest Maps displays tile-based maps from sources like Microsoft, Yahoo!, OpenStreetMap and others. Here is an image of the app.

Launch the application

If you want to learn more about how AppFoundation provides solutions based on Rich Internet Applications, please drop me a line at www.appfoudation.com.

The site uses Flex to communicate with PHP through HTTPServices to access dynamic content that drives ‘pages’ being created in the rich internet application. The graphics were mostly done using Photoshop and put into CSS using 9-slice scaling.

You can see the site here: www.appfoundation.com

Please drop by to see how Af can help you deliver your Enterprise RIA projects and much more.

Please check out www.javamug.org for more information regarding the event. I hope to see you there if you are in the Dallas/Fort Worth area.

I also plan to give a first peek of Af-Connect. Af-Connect is a collaborative application environment that uses a controlled social networking model to share client and project information. You can create private sites to share files, projects, and contacts with partners, co-workers, and clients. The application is built in Adobe AIR on top of a Spring implementation.

Update:
I enjoyed the opportunity to present at JavaMug in Dallas Texas. Thanks to Erik Weibust for being a great host and taking care of the details for me. Here are the presentation slides and Flex, Spring, and FlexLib projects I showed in the meeting.

JavaMug_Presentation

Flex Library Project

Spring Project

Flex Project

I have seen many examples of doing this, just without the ability to scale the PDF larger and smaller when a resize of the AIR application occurs. So I worked that issue out and wanted to share it with the Flex community.

To load a PDF into an AIR application, use the HTMLLoader class to load the PDF into your AIR window. Since you cannot add the HTMLLoader as a child, you will need to create a UIComponent() to add the PDF to a container.

If you look at the addFile() function, you will see that I first checked the PDF capability had a STATUS_OK before proceeding to the PDF loading steps with the following line of code:

if(HTMLLoader.pdfCapability == HTMLPDFCapability.STATUS_OK) {}

Once successful, I created an URLRequest to locate the PDF on my Tomcat server. You could easily add a parameter to set the PDF based on your content management as needed.

I then set the PDF’s initial height and width to that of the with the id of container. After that is done, I loaded the PDF to the HTMLLoader from the URLRequest.

Now that you have a handle on the PDF and it is loaded to the AIR application, you can use the UIComponent.addChild function to add the PDF to the UIComponent. After that, you need to add the child to the which is done by calling the addChild() function on container.

If you look at the example from the Adobe Livedocs you will notice they give the PDF’s height and width static numbers. What we want to do is allow the PDF to scale on window resize. To accomplish this, create a new function that is executed everytime the application is resized. In this example, I created the scalePDF() function that is called by the resize function on the as follows:

Since the width and height are set to 100% on the and I set the PDF’s height and width to the height and width, the PDF will resize to fit the width and height of the every time it is resized. This will always give you the maximum reading space available for the PDF.

Here is the full source for this example. You can take this code and create a component that can be reused throughout your AIR applications. Enjoy.

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication
   xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">

   <mx:Script>
      <![CDATA[
      import mx.core.UIComponent;

      private var pdf:HTMLLoader = new HTMLLoader();

      private function addFile():void
      {
         if(HTMLLoader.pdfCapability == HTMLPDFCapability.STATUS_OK)
         {
            var request:URLRequest =
               new URLRequest("http://localhost:8080/af_Central/a.pdf");

            pdf.height = container.width;
            pdf.width = container.width;

            pdf.load(request);

            var ui:UIComponent = new UIComponent();
            ui.addChild(pdf)

            container.addChild(ui);
         }
         else
         {
            trace("PDF cannot be displayed. Error code:",
               HTMLLoader.pdfCapability);
         }
      }
      private function scalePDF():void
      {
         pdf.height = container.width;
         pdf.width = container.width;
      }
      ]]>
   </mx:Script>

   <mx:Button label="Do It" click="addFile()" />
   <mx:VBox id="container" width="100%" height="100%"
      resize="scalePDF()"/>

</mx:WindowedApplication>