March 23rd 2010 - Entry Posted to: ActionScript 3,class

A recent project needed a watermark added to any images that could be downloaded off the site. Originally we used a PHP solution, which worked fine. But I wanted to do it inside of Flash and use the save methods in FP10.

So, I wrote this simple little class to adding a water mark to a display object, and the returning that display object as bitmapdata for say, passing to Adobe’s jpg encoder.

Maybe someone will have some use for it?

Source Files
Here is the relevant source file; Watermark class (1144)

By downloading, you agree to the terms of use, outlined here: http://www.blog.noponies.com/terms-and-conditions

Dependencies
Zero

1

July 08th 2009 - Entry Posted to: ActionScript 3,class

Over on kirupa, one of the users was complaining about the lack of LoadMovie in AS3.

While not being something that has ever concerned me in the slightest, I thought I’d whip up a quick AS3 version of the same general idea.

Its pretty simple. A singleton class, with a simple “loadMovie” method that accepts the string URL of the asset to load, the container to load it into, and an optional Boolean flag for deciding if the containers existing children (if it has any) are removed with each new load.

I doubt this will have much use, but who knows.

Source Files
Here is the relevant source file; LoadMovie (1365)

By downloading, you agree to the terms of use, outlined here: http://www.blog.noponies.com/terms-and-conditions

Dependencies
Zero

7

January 05th 2009 - Entry Posted to: ActionScript 3,class,Donator File

The NpTextScroller Class is a ActionScript 3 Implementation of scrolling text. Similar to the NpScrollingPanel Class.

The class supports scrolling via the provided scrollBar, keyboard (UP and DOWN arrows) or via the mouse wheel. I’ve also included and added in support for the mouse wheel on Macs. That support is courtesy of the great class provided by pixelbreaker. The class is scrollRect based. I chose a scrollRect for a performance gain it offers when scrolling text. The downside in this implementation is that when you are blur scrolling the text, the top and bottom of the rect tends to look blurred as well.

The Class uses an enterframe for it’s scrolling, rather than a tween engine. The enterframe events are always removed when scrolling etc stops.

I have not tested this on a PC, so let me know if it has issues. I think Safari might have an issue with it, judging by some of the comments from pixel breakers blog posts.

Class Features

• Scroll Y
• Either CSS or TextFormat Styles for text
• Supports HTML text
• Scroll via MouseWheel, Keyboard, Slider Bar
• Selectively choose what listeners to add, or remove
• Slider Bar is fully configurable
• Slider Bar auto hides if there is not enough text to scroll
• Use custom asset for Slider Bar Drag Handle
• Append text
• Replace text at runtime
• Scroll programatically to particular points
• Control blurring amounts
• Control scroll speed and easing

View Example
Here is an example. It’s using external text, with the left hand text block controlled via a TextFormat Object and an embedded font. The right is controlled via an external CSS StyleSheet, using Arial. Clicking the “load new text” button swaps the right hand block of text to a TextFormat Object.; http://www.noponies.com/dev/as3_textscroller/

Source Files
Donator only file!

Dependencies
The .fla’s use the Memory and Framerate monitoring component from Grant Skinner, which you can get here: http://www.gskinner.com/blog/archives/2008/04/simple_componen.html, But, simply delete this out, for a production use.
Mac MouseWheel Scrolling pixelbreaker

21

January 02nd 2009 - Entry Posted to: ActionScript 3,class

The NpScrollingPanel is a ActionScript 3 Implementation of a scrolling panel. Pretty common place stuff. This is a reworking of an older version of the same file I posted a little while ago. Since then I’ve removed the scrollRect version, but may re do it at some stage, if time permits. Internally the class now uses the Adobe Tween engine to scroll all content.

The NpScrollingPanel Class is designed to create a scrolling pane of content. The Class itself does not handle any loading in of content. You must provide the class with DisplayObjects for it to scroll. I wanted it to be completely content independent.

Let me know if there are bugs etc..

Class Features

• Scroll x and y
• Fixed or stage width / height scrolling area
• Create columns / rows of scrolling content
• Scroll via mouse movement, panel edges, or via external sources
• Control colour and alpha of scroller background
• Toggle button mode for content
• Scrolls any DisplayObject
• Adjust content item padding on the fly
• Remove content items on the fly
• Use lots of cpu with a blur scroll mode
• Simple internal easing engine
• Control scroll speed and easing
• Enable / Disable scrolling
• Target individual content items
• Enable Reflections on content
• Drag N Drop content items, to change their order in the panel
• Flexible event system to track clicks etc on content

View Example
Here is an example. It’s using external XML content and the vertical scroller is pulling in two bitmaps from the library; http://www.noponies.com/dev/as3_scrollingpanel/. Performance of the blurred and reflected content is pretty bad . I’ve been playing around with this class for a job, where I’ve built a basic CMS, that needed the ability to reorder the content. So, I’ve added in the ability to drag n drop the content items, changing their order, plus a whole lot of other bug fixes. The new version is not online yet, but will be by the end of the week. The online demo allows for dragging and dropping, its pretty beta!

Updates
Jan 03 2009: Small fix for a bug pointed out by Matt.

Source Files
Here is the relevant source file; Scrolling Panel Source Files (2517) - 352.72 kB
Here are the beta files, that allow for dragging content items. Be aware, that quite abit of the api has changed.
Scrolling Panel Source Files (Beta) (983) - 351.77 kB
Let me know how these new files work out.
By downloading, you agree to the terms of use, outlined here: http://www.blog.noponies.com/terms-and-conditions

Dependencies
The class uses the http://www.adobe.com/devnet/flash/articles/reflect_class_as3.html class to enable reflections on content.

36

August 06th 2008 - Entry Posted to: ActionScript 3,class

ActionScript 3 NpFlexLayout Class

The NpFlexLayout Class is designed to simplify aligning DisplayObjects to stage dimensions and responding to changes in stage dimensions at run time by a user or between different users.

This supersedes a simpler implementation of this approach, called “ActionScript 3 Liquid Layout Manager”, which I’ll leave on the site.

As opposed to the LayoutManager class, the NpFlexLayout class is an actual layout manager, taking care of instantiating, destroying and passing on requests to instances of an internal class called NpFLexLayoutItem which wraps each displayObject passed to the NpFlexLayout Class.

Class Features

• Position objects (x,y) on the stage as a proportion of the stages dimensions
• offSet each displayObject (x,y) from where it would be by an absolute pixel value
• set objects to stretch to fit either stage width / height or a proportion of stage dimensions
• per object minX & minY settings where reflowing, resizing will cease
• use either the clips registration point, or its visual center (width/height)
• pause, resume displayObjects responding to resize events
• update individual class properties at runtime
• tween objects properties at runtime (uses internal simple tween method)
• set tween easing
• add, remove displayObjects from class

View Example
Here is an example; http://www.noponies.com/dev/as3_flexlayout/

Source Files
Here is the relevant source file; Flex Layout Files (1743) - 127.6 kB
By downloading, you agree to the terms of use, outlined here: http://www.blog.noponies.com/terms-and-conditions

Dependencies
None.

Version 2 Beta
Ok, here is a beta of version 2 of this class. Have a play and let me know of any issues.

I’ve updated the beta with an constrain resize property. Let me know how it works out in testing etc

http://www.blog.noponies.com/wp-content/uploads/NpFlexLayout-v2-Beta.zip

38

July 31st 2008 - Entry Posted to: ActionScript 3,class

ActionScript 3 Full Browser Background Content.

This is the second third iteration of this class. I decided to put the NpFSObjectResize Class to use within this demo, using that class as the superclass for here. As a result, this new version of this file is much more capable, supporting stage alignment modes along with a simple method for loading in new background images or swfs. You could use that feature to create a simple full browser slideshow, but be warned that I have not used the same bitmapData memory management techniques as I have within the Full Browser Cross Fading demo. So, your memory useage could get higher using this class as a slideshow (as you will be waiting on the garbage collector to do its thing).

This class has been completely rewritten, as of version 2. The api has changed, and many new methods and properties are present. The classes event model has been shifted into its own class, and a new class now wraps each display object, which is the foundation for more work on transitions other than a straight alpha fade. This version is not compatible with any older versions!

The demo file contains an example of using this class with an XML iterator, with various methods for creating slideshows etc. Along with this example, is a very simple implementation, commented out in the actionscript layer of the .fla.

Class Features

• Stage Alignment Modes
• Load New Bg Method
• Specify Cross Fading Time
• Specify Min Stage Scale points
• Pass Through Mode, where scaling is disabled
• Specify Max scale of content
• Specify content only scales upwards

View Example
Here is an example. In this example, the first file (swf) is set to scale to only 70% of the stages size, and stay centered, the second file (bitmap) is set to scale to full browser dimensions. View example here: http://www.noponies.com/dev/as3_fullbrowser_bg/

Updates
04 August, 2008: Added in ability to load in swfs as content.
17 Oct, 2008: Method change, shift from using timer to crossfade to internal Adobe tween class.
06 Jan, 2009: Completely rewritten, new API, new classes, new event model.
08 July, 2009: Fixed the bug with short tween in times, and a small issue with garbage collection
13 July, 2009: Fixed a slight bug with the example files related to iterating in reverse over a collection

Source Files
Here is the relevant source file; Full Browser Content Files (3229)

I’ve been playing around with javascript libraries more and more recently, I converted this file into a lightweight jQuery plugin, which can be viewed here; http://www.noponies.com/dev/as3_fullbrowser_bg/resize.html. If there are no problems, I’ll release it. In many ways, the writing is kinda on the wall for Flash, javascript can do a lot of the presentation things I would normally do in Flash.

By downloading, you agree to the terms of use, outlined here: http://www.blog.noponies.com/terms-and-conditions

Dependencies
None.

107

July 23rd 2008 - Entry Posted to: ActionScript 3,class,Donator File

ActionScript 3 Vertical & Horizontal Accordion Menu with support for columns of content.

This example extends and supersedes an earlier version of this file I wrote about a year ago. I always wanted to make a horizontal version and extend the class, making it more flexible and useful to people.

As was the previous menu, this menu is a Class based ActionScript 3 Accordion Menu, with either a rollOver/RollOff activation scheme for a onRelease activation scheme. I also added in a better extended event class which allows you to control, or respond to all menu activity via events.

Class Features

• Vertical or Horizontal Menu Orientation
• Visible or invisible Menu Bar
• Supports parsing functions passed to each menu item
• Custom Menu Bar Assets
• Option for persistent Menu Panels
• Menu Spacing
• Menu text position
• MenuBar colour / RollOver/Off colour
• Menu text format
• Menu tween speed
• Menu easing type
• MenuBar width, height, visibility
• Menu Click behaviour
• Disable / Enable Menu
• Open Particular Panels
• Menu attributes are applicable on a per menu item basis
• etc, etc.

View Example
http://noponies.com/dev/as3_accordion/

Source Files
Donator only file!
If you want a less capable version of this file, you can download this; http://www.blog.noponies.com/archives/39

Dependencies
TweenLite – http://www.tweenlite.com

29