Archive for the ‘Actionscript’ Category

Presentation: Introduction to PureMVC

Monday, January 14th, 2008

Just a reminder. I will be presenting a session on the PureMVC framework for ActionScript this Tuesday as part of the Goto+Play speaker series.

PureMVC is a lightweight framework for creating applications in ActionScript 3 (Flash and Flex), based upon the classic Model-View-Controller design meta-pattern. This presentation will provide an overview of PureMVC as well as a look at current best practices for day-to-day development as we walk through a sample application built with Flash CS3 and ActionScript 3.

Introduction to PureMVC
presented by David Knape, http://bumpslide.com/

Tuesday, January 15, 2008
doors open at 6, meeting at 6:30
(Old Town Pizza to follow?)

Fashionbuddha Studio
123 NW 2nd Ave, Suite 206
Portland, OR 97209
T: 503-490-4787

More info at gotoandplay.net

Update:
Demo, source, and slides now available here. Also, the Acrobat Connect recording can be found here.

GridLayout – Part 1

Wednesday, June 13th, 2007

GridLayout (com.bumpslide.util.GridLayout) is a class I originally created to simply manage the attachment and positioning of a series of MovieClips. I began using it to build all my data grids, thumbnail lists, and various types of menus. Recently, I have refactored it to support scrolling and/or paging via an index offset as well as paged data loading via the AS2 DataProvider API. The end result is an all purpose utility that can be used to build everything from simple menus to custom data grids. This post is just a quick introduction to using the code. Parts 2, 3, and 4 (to come) will go into more details about scrolling and data loading as well as alternative uses of the GridLayout class.

You can get a sneak peak at the examples here.
(more…)

Burst Labs on FWA

Monday, June 4th, 2007

Burst IconThe site JD and I made for Burst Labs made Site of the Day for May 27th, 2007 on FWA. If you haven’t seen it, you should check it out.

http://burstlabs.com/

Everything you see was built from scratch. The back-end is a custom MySQL database and admin tool I built using CakePHP. Middleware is AMFPHP, and the front-end is all Flash 8 Actionscript 2.0. When I have more time, I will try to blog a bit about some of the components I built.

Nerd Highlights:
- Custom data grid built with com.bumpslide.util.GridLayout supports mousewheel and paged data-loading
- State management with com.bumpslide.data.Model
- SWFAddress for deep-linking and Back-button support tied directly to the Model

JD has more on the subject.

Easy Bezier Interpolation

Monday, June 4th, 2007

Demo: Easy Interpolation
Source: Interpolation.as

Commenting on my Interpolating Sine post, Saravanan wrote:

is there a way to smooth this line..........please help........

Why, yes, there is. Again, Patrick has done all the dirty work, but unfortunately his interpolation code was dependent on his demo movie clip classes. Rather that bother a man who is now retired, I borrowed his code, removed the dependencies, made it MTASC friendly, and am sharing it with you now. Patrick's cubic bezier and interpolation classes have been combined into com.bumpslide.util.CubicBezier.

Here is a quick sample of using this class to draw a smooth curve through a series of random points:

Actionscript:
  1. import com.bumpslide.util.CubicBezier;
  2.  
  3. // create some random points
  4. var targetPoints:Array = new Array();
  5. for(var i=0; i<9; i++) {
  6.     targetPoints.push({x:50+50*i, y:Math.random() * 300 + 50});
  7. }
  8.  
  9. // interpolate the points
  10. var overshootFactor = 20;
  11. interpolatedPoints = CubicBezier.interpolatePiecewise( targetPoints, overshootFactor );
  12.  
  13. // draw
  14. var holder:MovieClip = createEmptyMovieClip('holder_mc', 1 );
  15. holder.lineStyle(0, 0x880000);
  16. holder.moveTo(interpolatedPoints[0].x, interpolatedPoints[0].y);
  17. CubicBezier.drawBeziers(holder, interpolatedPoints);

The full example and all related source files are all in my Bumpslide Library SVN repository.

References:
http://www.5etdemi.com/blog/archives/2006/10/interpolating-points-using-piecewise-cubic-beziers-source-code/
http://www.timotheegroleau.com/Flash/articles/cubic_bezier_in_flash.htm
http://www.moshplant.com/direct-or/bezier/

Paged Loading with XML-based Recordsets

Tuesday, February 13th, 2007

One of the nicest things about Flash Remoting in Actionscript 2 is the pageable recordset functionality. This allows you to split the results of a large data set into chunks, or pages, that can be downloaded on an as-needed basis. This is a demonstration of how to use this paging functionality with XML-based web services. Specifically, I've created a sample application that uses the Flickr REST API (XML) to do a photo search.

Demo: Flickr Tag Search
Source: FlickrDemo.zip

Enter a tag in the search box, and hit 'go'. The results are loaded in batches of 100, and they fill in as you scroll. As you can see, we know how many records are available even before they are all loaded. We are

I've used this feature on a number of projects that included Flash remoting, and it is truly amazing. When in paged loading mode, a recordset instance is like an array that doesn't have all it's slots filled in. If I am a movie clip representing a datagrid row that needs record at slot 537 and that record is not loaded yet, the recordset gives me a little message, "in progress", instead of the actual data. The mx.remoting.Recordset class and it's friends take care of managing the server requests needed to load the missing data. Then, I simply listen for model change events until I get the data I need. As the definition above states, the List-based v2 UI components all understand this data provider API and can auto-fill themselves on an as-needed basis. This makes it possible to create things like scrolling lists that have thousands of records.

There are times when I've needed this same kind of paged loading functionality, but I didn't have access to Flash remoting. Instead, I needed to use an XML-based service that returned results based on GET method parameters that would either specify or range of records to return or simply a page number and the number of items per page. So, I have built a couple of classes that fetch data using XML and then use the built-in paging functionality provided with the mx.remoting code. This system has been set up in such a way that you can simply extend my XmlRecordsetService base class, implement a few key functions, and your result will be an instance of a class that extends mx.remoting.RecordSet. This recordset can be plugged in to any of the list-based components that come with Flash including the DataGrid that I have used in my demo.

Now, on to the code...

(more...)