Archive for the ‘Flash’ Category

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...)

Unexpected Results – Interpolating Sine

Thursday, January 18th, 2007

interpol_sine_th.gif

Demo: Interpolating Points on a Sine Curve
Source: interpolate_sine.zip

A recent post on the gotoAndPlay.net flashlist asked about charting the sine wave in flash using the drawing API. The problem with the drawing API is that the quadratic bezier curveTo functions don't make for the smoothest curves without a little trickery.

Patrick Mineault has a great piece on his blog about piecewise cubic beziers. Using his code, we can interpolate between the points on a sine curve quite smoothly. I thought his demo was quite nice, so I download his source, hacked it a bit, and came up with this demo.

Yes, it makes a nice smooth curve, if that's what you're after, but the fun starts when you start playing with the controls. A good place to start is by setting the wavelength to 2 while increasing the overshoot. Once the wavelength gets below 4 pixels, the cubic bezier interpolation no longer has enough points to interpolate the high frequency wave accurately. Increasing the overshoot factor creates some unexpectedly fun curls. Altering the number of points plotted gives us even more variation.

Screenshot 1

Screenshot 2

Screenshot 3

Screenshot 4

Mark Anders on Flash Development

Tuesday, December 19th, 2006

Ok, I told myself I wouldn't use this forum as a place to post links, but this is good. regdeveloper.co.uk has an interview with Mark Anders of the Flex team. He talks a lot about his experiences with .NET, and it's a quite revealing read.

Regarding tool development in Eclipse vs. .NET...

I'd spent the last six years working on building a managed code platform; I thought it was goofy to build in C++. The thing I concluded about .NET was if you're trying to build code to run on a variety of platforms .NET offers you nothing - where's the cross platform window forms?

Regarding changes to ActionScript...

When we moved to ActionScript 3, we had to port all this code and there were a number of places where the programmers said ‘How did we ever ship that? That code just doesn't work’. Once you have real strong typing it ferrets out things you didn't know were there, even if you're a great developer.