Automatic font size adjuster

1 year ago | in Actionscript 3, Flash, Interaction design | 12 Comments »

First I have to say sorry to all the not ‘actionscript-geeks’, but I have another script I want to share. I made a TextField behaviour that might come in handy for other people too.. I made a short video to show how it works.

It is called AutomaticFontSizeBehaviour AutomaticFonSizeBehavior :)

package  
{
	import flash.events.Event;
	import flash.events.KeyboardEvent;
	import flash.text.TextField;
	import flash.text.TextFormat;
 
	/**
	 *  @author Jankees.van.Woezik
	 */
	public class AutomaticFonSizeBehavior 
	{
 
		private var _textField:TextField;
		private var _startSize:Number;
		private var _currentSize:Number;
		private var _prevText:String;
		private var _maxHeight:Number;
		private var _minimalFontSize:uint;
 
		/**
		 * Usage:
		 * 
		 * _updater = new AutomaticFonSizeBehavior(textField);
		 * 
		 * // this is enough for input fields, if you set text using code you should call the update function after you have set the text like this:
		 * 
		 * _updater.update();
		 * 
		 */
		public function AutomaticFonSizeBehavior(inTextField:TextField,inStartSize:Number = 40,inMinimalFontSize:uint = 9, willUpdateOnInput = true) 
		{
			_minimalFontSize = inMinimalFontSize;
			_startSize = inStartSize;
			_currentSize = inStartSize;
			_textField = inTextField;
			_prevText = "";
 
			_maxHeight = _textField.height;
 
			_textField.addEventListener(Event.REMOVED_FROM_STAGE,dispose);
 
			if(willUpdateOnInput) addEventListeners();
 
			setFontSize(_startSize);
 
			update();
		}
 
		public function update(event:Event = null):void 
		{
			_textField.scrollV = 0;
 
			if(_prevText.length > _textField.length)
                setFontSize(_startSize);
 
			while (_maxHeight < _textField.textHeight + (4 * _textField.numLines)) 
			{ 
				if(_currentSize <= _minimalFontSize) break;
				setFontSize(_currentSize - 0.5);
			}
 
			if(_currentSize <= _minimalFontSize) 
			{
				_textField.text = _prevText;
			} 
			else 
			{
				_prevText = _textField.text;
			}
		}
 
		private function addEventListeners():void 
		{
			_textField.addEventListener(Event.CHANGE,update);
			_textField.addEventListener(KeyboardEvent.KEY_UP,update);
		}
 
		private function setFontSize(inSize:Number):void 
		{
			_currentSize = inSize;
 
			var currentTextFormat:TextFormat = _textField.getTextFormat();
			currentTextFormat.size = _currentSize;
 
			_textField.setTextFormat(currentTextFormat);
			_textField.defaultTextFormat = currentTextFormat;
		}
 
		/**
		 * Dispose everything
		 */
		private function dispose(event:Event):void 
		{
			_textField.removeEventListener(KeyboardEvent.KEY_UP,update);
			_textField.removeEventListener(Event.CHANGE,update);
			_textField.removeEventListener(Event.REMOVED_FROM_STAGE,dispose);
 
			_textField = null;
		}
	}
}

update: Thanks to Thijs for the update! Copy & paste is now supported!
update: Thanks to Sandro Padin for the improvements!!

Lukx video

1 year, 1 month ago | Tags: , in Actionscript 3, Flash, Interaction design | 1 Comment »

Last week I created the following video of the Lukx website;

Some of the features:

  • Full Flash webshop
  • Rabobank IDeal connection
  • Full SWFAddress navigation
  • CMS with posibility to customize every page with slideshows
  • Mailinglist with MailChimp

(The video is in HD, so click for fullscreen)

Website Lukx live

1 year, 2 months ago | in Actionscript 3, Flash, Interaction design, My work | 1 Comment »

Yesterday we lauched the new website of Lukx.nl it is a full flash website with webshop.

The fun thing was that it was quite a agile project. Zwarte Koffie made the designs and About Coding helped me with the backend. The website has a webshop (with iDeal) that will be launched later this year.

Some screenshots:

1043181245696022

1043181245696042

1043181245696111

1043181245696137

1043181245696164

1043181245696207

1043181245696207

Blond Amsterdam website online

1 year, 5 months ago | in Design, Flash, Interaction design, My work | 4 Comments »

After a few weeks of testing and beta versions, the Blond-Amsterdam website is online in it’s complete version.

I build this website with Timo Kuilder of Zwarte Koffie. It was very nice to work in a two member team, it is nice to be so agile, the project grew from a ‘small website about the brand’ to a big webshop with all their products (over 200)  all their stores (over 300) send a friend and a contact form.

Features:

  • Flash Webshop with Payment module (IDeal and CreditCards)
  • Multilingual (English/Dutch)
  • Products can be out of stock / not available online
  • Nice way to search for stores (hand drawn map)

Visitors statistics:

It’s nice to see how much the end users like the website, on the official user group (blondamsterdam2008.hyves.nl) were a lot of people that loved the website. And you can see that in the statistics of the website.

  • 33% of the users comes back after a visit.
  • A average user is almost 7 minutes, which is pretty long, in that time they see 62 pages.
  • In one month we got 31,530 visitors and 1,960,953 pageviews.

A thing I didn’t expect was the amount of send a friends, 1,271 in one month.

Check it out:
www.blond-amsterdam.nl

Screenshots:

picture-53

picture-33

Read the rest of this entry »

New project ‘Telenor Affärskommunikation’

1 year, 6 months ago | in AIR, Actionscript 3, Flash, Flex, Gadgets, Interaction design, My work, Web | No Comments »

My latest project has just been launched last week, I am very excited about it. I made it for the Swedish Agency Birth.

I did the flash part of the ‘Telenor Älskar Affärskommunikation’ campaign.

telenor1

« Older Entries