Rozengain - New Media Development Blog

Syndicate content
Updated: 1 hour 39 min ago

3DMLW Blender export script

Tue, 10/28/2008 - 08:01

I just found this one in the 3DMLW forums (although it’s been there since 22 August :)). Very useful.
3DMLW Blender export script

Trying out 3DMLW … it’s damn easy

Thu, 10/23/2008 - 21:29

I recently stumbled upon this new 3D Markup Language for the Web. The getting started examples looked quite simple so I figured it was worth giving it a try.

3DMLW can load Blender (.blend) files so I first fired up Blender to create a simple model. Then I wrote the markup code (I used “Quantum Hog“, their editor) to add the object to the scene and make it rotate.

I ended up with only 21 lines of code to get this working! Check it out:

<?xml version='1.0'?> <document stylesheet='{#default}' color='#5555ee'> <stylesheet id='default'> <default> <lights> <light x='150' y='150' /> </lights> </default> </stylesheet> <content3d camera='{#camera1}'> <camera id='camera1' x='0' y='5' z='-10' /> <object id='arrayObj' x='0' y='0' z='0' source='array_applied.blend' class='thing'> <mesh name='Cube' /> </object> </content3d> <animation id='rotation'> <key duration='90' yaw='0' /> <key yaw='360' /> </animation> <animate id='animating_lid' loop="true" speed='7' animation='{#rotation}' target='{#arrayObj}' interpolation='linear' /> </document>

Headless-server setting in flex-config.xml fixes error on automated build

Thu, 10/23/2008 - 12:18

I came across this error during an automated build on the server:

Error: An error occurred because there is no graphics environment available. Please set the headless-server setting in the Flex configuration file to true.

This happens when the server isn’t hooked up to a monitor, mouse, keyboard, etc. The flex-config.xml file needs to be updated with this tag to solve this issue:

<headless-server>true</headless-server>

Read more here:
http://livedocs.adobe.com/flex/201/html/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Book_Parts&file=performance_118_41.html

Getting rid of a button’s border/linkbutton’s background roll over state in Flex

Tue, 10/21/2008 - 07:31

Some Flex components have visual elements that cannot be controlled with CSS. Have you ever tried removing the border of a Button or the roll over background color of a LinkButton? I had this problem a few times before and the solution to this is very simple. Just reset the skin

.myButtonStyle { skin: ClassReference("mx.skins.ProgrammaticSkin"); }

Blender 2.48 Released, lots of Game Engine goodness

Thu, 10/16/2008 - 07:36

A new version of Blender has just been released. This update contains a lot of useful additions and improvements to the game engine. The Python Editor is now more than just an integrated version of Notepad :-), the Bullet physics engine has been updated to the latest version, there is support for realtime GLSL materials, the game logic and game level editing has been improved … and there’s lots more.

Download the latest version here.

Also be sure to check out the Yo Frankie!  open game that was developed with all these new features.

3DMLW - Open Source 3D Markup Language for Web

Wed, 10/15/2008 - 07:33

There’s an interesting article about 3DMLW in the latest issue of BlenderArt magazine. 3DMLW is an Open Source platform for creating 3D and 2D interactive web content. In their own words:

“3DMLW is a Open Source technology for creating and displaying 3D and 2D content on the web through common web-browsers. This technology includes four parts:

  • 3DMLW markup language is a specification for creating 3DMLW-documents. 3DMLW is similar to XHTML and easy to understand.
  • Scripting support for dynamic and interactive content.
  • Style sheets for easy and comfortable designing.
  • 3DMLW plug-in for web browsers – This is a browser based plug-in for showing 3DMLW-documents in web-browsers.”

It supports many browsers: Microsoft® Internet Explorer® 6 and later, Mozilla® Firefox®, Flock®, K-Meleon®, Opera, Apple’s® Safari® and Google™ Chrome for Windows but not many operating systems: Microsoft WIndows Vista, Microsoft Windows XP, Microsoft Windows 2000.

One of their future goals is to support other operating systems such as Linux, BSD and Mac.

http://www.3dmlw.com/

Another reason to use Blender: SIO2, Free Open Source 3D Engine for iPhone and iPod Touch uses Blender

Fri, 10/10/2008 - 07:32

I just picked this up from Blendernation. SIO2 is an open source 3D engine for the iPhone and the iPod Touch. The Bullet physics engine is also included. I haven’t had time to look at it yet, but it looks very promising.

Check it out: http://www.sio2interactive.com/

Blender: http://www.blender.org/

Flash Player 10 & Flex Builder: Class flash.geom::PerspectiveProjection could not be found.

Mon, 09/08/2008 - 10:13

I got this runtime error when trying out the new 3D features in the latest Flex SDK:

VerifyError: Error #1014: Class flash.geom::PerspectiveProjection could not be found.

This can be fixed this by setting the Flash Player version to 10.0.0 (or whatever fp10 version you’re using) in Properties > ActionScript Compiler > HTML Wrapper > Require Flash Player Version. This version number not only for the HTML wrapper, but also for the flash player SWC include file.

If you have problems compiling the project and/or your code completion doesn’t work, you need to make sure you have the flash player 10 swc file in your build path. It can be found in the SDK under frameworks/libs/player/10.

Newline characters not recognized when parsing external XML file

Wed, 08/13/2008 - 09:13

I encountered this problem when implementing a workaround for the multiline unicode text wrapping bug. I use newline characters (”\n”) to break up the text manually. When I load the XML file and parse it in my Flex app, newline characters are displayed in the text field. Tracing out the string displays “\n” and not an escaped version like “\\n”. Oddly enough this simple replace fixes the problem:

var myText : String = String( root.somenode.anothernode ); myText = myText.replace(/\\n/g, "\n");

Flashplayer bug: Incorrect wrapping on multiline Unicode text

Wed, 08/13/2008 - 08:34

I came across this bug while working on a localised Flex application for one of our clients. In the Thai version of the site the text was wrapping incorrectly. It didn’t cut off sentences where there were whitespaces. Instead it cut off in the middle of words. Take a look at this example:

You can see the second word is cut off in the middle. It turns out that this is a bug in the Flash Player:

http://bugs.adobe.com/jira/browse/SDK-13720
http://bugs.adobe.com/jira/browse/FP-87

So it affects Unicode languages like Arabic, Thai, Georgian, Chinese, Korean, Javanese, Tamil, Hindi, Gujarati, Malayalam, Kannada, Marathi, Telegu, Japanese, etc.

It looks like this bug needs votes before it gets fixed by Adobe. So if this bug affects you as well, please sign up to the Adobe bug management system and vote for this bug to get fixed.

[UPDATE 17-oct-2008] This bug has been fixed by Adobe. This is the comment they added in Jira: “fixed with Flash Player 10.r12″.

Blender exporter for Sandy, Papervision3D and Away3D updated

Tue, 08/12/2008 - 10:00

The export script for Blender has been updated. It is now compatible with the latest versions of Papervision3D (2.0) and Away3D (2.1.0).

It also contains a bugfix that solves an annoying problem with the “choose engine” dropdown menu.

Download the script here.

Custom character sets in the Flash CS3 Character Embedding panel

Wed, 08/06/2008 - 15:01

This is extremely useful when you work with localised applications. It often happens that the character set you have to work with is not in the list or contains more characters than you need to use. The Character Embedding Panel uses an xml file called UnicodeTable.xml. You can find it here: C:\Documents and Settings\<username>\local settings\application data\adobe\flash cs3\en\configuration\fontembedding\If you want to add a new character range you need to add a new node with a “name” and “id” attribute:

<glyphRange name="My new character range" id="100"> </glyphRange>

Then you can add the Unicode character ranges. A slimmed down version of Korean for instance:

<glyphRange name="My new character range" id="100"> <range min="0x0020" max="0x007E" /> <range min="0x1100" max="0x11F9" /> <range min="0x3000" max="0x303F" /> <range min="0x3131" max="0x318E" /> <range min="0x327F" max="0x327F" /> <range min="0xAC00" max="0xD7A3" /> <range min="0xFF01" max="0xFF60" /> </glyphRange>

Save it, restart Flash and it’ll appear in the Character Embedding Panel.
You can find the full documentation here:

Custom character sets in the Flash CS3 Character Embedding panel

Wed, 08/06/2008 - 15:01

This is extremely useful when you work with localised applications. It often happens that the character set you have to work with is not in the list or contains more characters than you need to use. The Character Embedding Panel uses an xml file called UnicodeTable.xml. You can find it here: C:\Documents and Settings\ocal settings\application data\adobe\flash cs3\\configuration\fontembedding\If you want to add a new character range you need to add a new node with a “name” and “id” attribute:

<glyphRange name="My new character range" id="100"> </glyphRange>

Then you can add the Unicode character ranges. A slimmed down version of Korean for instance:

<glyphRange name="My new character range" id="100"> <range min="0x0020" max="0x007E" /> <range min="0x1100" max="0x11F9" /> <range min="0x3000" max="0x303F" /> <range min="0x3131" max="0x318E" /> <range min="0x327F" max="0x327F" /> <range min="0xAC00" max="0xD7A3" /> <range min="0xFF01" max="0xFF60" /> </glyphRange>

Save it, restart Flash and it’ll appear in the Character Embedding Panel.
You can find the full documentation here:

Custom character sets in the Flash CS3 Character Embedding panel

Wed, 08/06/2008 - 13:01

This is extremely useful when you work with localised applications. It often happens that the character set you have to work with is not in the list or contains more characters than you need to use. The Character Embedding Panel uses an xml file called UnicodeTable.xml. You can find it here: C:\Documents and Settings\ocal settings\application data\adobe\flash cs3\\configuration\fontembedding\

If you want to add a new character range you need to add a new node with a "name" and "id" attribute:

<glyphRange name="My new character range" id="100"> </glyphRange>

Then you can add the Unicode character ranges. A slimmed down version of Korean for instance:

<glyphRange name="My new character range" id="100"> <range min="0x0020" max="0x007E" /> <range min="0x1100" max="0x11F9" /> <range min="0x3000" max="0x303F" /> <range min="0x3131" max="0x318E" /> <range min="0x327F" max="0x327F" /> <range min="0xAC00" max="0xD7A3" /> <range min="0xFF01" max="0xFF60" /> </glyphRange>

Save it, restart Flash and it'll appear in the Character Embedding Panel. You can find the full documentation here:

How to add the Subversion revision number to an ActionScript class using Ant

Mon, 08/04/2008 - 10:30

This comes in quite handy when you want to keep track of which version of your swf file resides on the server. You can trace it out and use Flashtracer or other tools like Flash Inspector. In short, this is what you have to do:

  • Make sure you have the latest Subversion
  • Create a template ActionScript class with a placeholder for the revision number
  • Call the svnversion command from your build script and assign the value to a variable
  • Copy the template class to a location in your source folder and replace the placeholder with the revision number
  • trace() the value in your application
The ActionScript class template file package { public class AppVersion { public static const SVN_VERSION : String = "%SVNVERSION%"; public static const BUILD_TIME : String = "%BUILDTIME%"; public static function log() : void { trace( "----------------------------------------------------" ); trace( "- SVN VERSION: [" + SVN_VERSION + "]" ); trace( "- BUILD TIME: [" + BUILD_TIME + "]" ); trace( "----------------------------------------------------" ); } } } The Ant build script <target name="setBuildVersion"> <!-- Get the SVN build version range --> <exec executable="svnversion" outputproperty="version.number" failifexecutionfails="false"> <arg line="." /> </exec> <!-- Get the current date & time --> <tstamp> <format property="build.time" pattern="dd/MM/yyyy hh:mm aa" locale="en,UK"/> </tstamp> <!-- Copy the template file and replace %SVNVERSION% and %BUILDTIME% --> <copy file="MySourceClassFile.as" tofile="MyDestClassFile.as" overwrite="true" /> <replace file="MyDestClassFile.as" token="%SVNVERSION%" value="${version.number}" /> <replace file="MyDestClassFile.as" token="%BUILDTIME%" value="${build.time}" /> </target> The output ---------------------------------------------------- - SVN VERSION: [70467:72783M] - BUILD TIME: [04/08/2008 09:02 AM] ----------------------------------------------------

How to add the Subversion revision number to an ActionScript class using Ant

Mon, 08/04/2008 - 10:30

This comes in quite handy when you want to keep track of which version of your swf file resides on the server. You can trace it out and use Flashtracer or other tools like Flash Inspector. In short, this is what you have to do:

  • Make sure you have the latest Subversion
  • Create a template ActionScript class with a placeholder for the revision number
  • Call the svnversion command from your build script and assign the value to a variable
  • Copy the template class to a location in your source folder and replace the placeholder with the revision number
  • trace() the value in your application
The ActionScript class template file package { public class AppVersion { public static const SVN_VERSION : String = "%SVNVERSION%"; public static const BUILD_TIME : String = "%BUILDTIME%"; public static function log() : void { trace( "----------------------------------------------------" ); trace( "- SVN VERSION: [" + SVN_VERSION + "]" ); trace( "- BUILD TIME: [" + BUILD_TIME + "]" ); trace( "----------------------------------------------------" ); } } } The Ant build script <target name="setBuildVersion"> <!-- Get the SVN build version range --> <exec executable="svnversion" outputproperty="version.number" failifexecutionfails="false"> <arg line="." /> </exec> <!-- Get the current date & time --> <tstamp> <format property="build.time" pattern="dd/MM/yyyy hh:mm aa" locale="en,UK"/> </tstamp> <!-- Copy the template file and replace %SVNVERSION% and %BUILDTIME% --> <copy file="MySourceClassFile.as" tofile="MyDestClassFile.as" overwrite="true" /> <replace file="MyDestClassFile.as" token="%SVNVERSION%" value="${version.number}" /> <replace file="MyDestClassFile.as" token="%BUILDTIME%" value="${build.time}" /> </target> The output ---------------------------------------------------- - SVN VERSION: [70467:72783M] - BUILD TIME: [04/08/2008 09:02 AM] ----------------------------------------------------

How to add the Subversion revision number to an ActionScript class using Ant

Mon, 08/04/2008 - 08:30

This comes in quite handy when you want to keep track of which version of your swf file resides on the server. You can trace it out and use Flashtracer or other tools like Flash Inspector. In short, this is what you have to do:

  • Make sure you have the latest Subversion
  • Create a template ActionScript class with a placeholder for the revision number
  • Call the svnversion command from your build script and assign the value to a variable
  • Copy the template class to a location in your source folder and replace the placeholder with the revision number
  • trace() the value in your application
The ActionScript class template file package { public class AppVersion { public static const SVN_VERSION : String = "%SVNVERSION%"; public static const BUILD_TIME : String = "%BUILDTIME%"; public static function log() : void { trace( "----------------------------------------------------" ); trace( "- SVN VERSION: [" + SVN_VERSION + "]" ); trace( "- BUILD TIME: [" + BUILD_TIME + "]" ); trace( "----------------------------------------------------" ); } } } The Ant build script <target name="setBuildVersion"> <!-- Get the SVN build version range --> <exec executable="svnversion" outputproperty="version.number" failifexecutionfails="false"> <arg line="." /> </exec> <!-- Get the current date & time --> <tstamp> <format property="build.time" pattern="dd/MM/yyyy hh:mm aa" locale="en,UK"/> </tstamp> <!-- Copy the template file and replace %SVNVERSION% and %BUILDTIME% --> <copy file="MySourceClassFile.as" tofile="MyDestClassFile.as" overwrite="true" /> <replace file="MyDestClassFile.as" token="%SVNVERSION%" value="${version.number}" /> <replace file="MyDestClassFile.as" token="%BUILDTIME%" value="${build.time}" /> </target> The output ---------------------------------------------------- - SVN VERSION: [70467:72783M] - BUILD TIME: [04/08/2008 09:02 AM] ----------------------------------------------------

Showing the hand cursor on a Flex scrollbar

Wed, 07/30/2008 - 09:43

Here’s a little trick/hack to get the hand cursor to appear on the up and down arrows of a standard Flex scrollbar. In order to do this you need to create a class that subclasses a class that has a scrollbar attached to it. In this case a TextArea:

public class CustomTextArea extends TextArea

The class mx.controls.TextArea extends mx.core.ScrollControlBase. This class contains the verticalScrollbar and horizontalScrollBar. We can reference these in our code. For instance:

verticalScrollBar.visible = false;

When you take a deeper look into the mx.controls.scrollClasses.Scrollbar class you’ll find the downArrow and upArrow properties:

/** * @private * The up arrow button. */ mx_internal var upArrow:Button; /** * @private * The down arrow button. */ mx_internal var downArrow:Button;

They’re defined in the mx_internal namespace and normally you can’t access these properties. There is a way to do it though (in the CustomTextArea class defined above):

import mx.core.mx_internal; .... use namespace mx_internal; verticalScrollBar.mx_internal::upArrow.useHandCursor = true; verticalScrollBar.mx_internal::upArrow.buttonMode = true; verticalScrollBar.mx_internal::downArrow.useHandCursor = true; verticalScrollBar.mx_internal::downArrow.buttonMode = true;

Only use this when you don’t have any other options though. I think Adobe uses this namespace to mark things that they might change in future releases.

Showing the hand cursor on a Flex scrollbar

Wed, 07/30/2008 - 09:43

Here’s a little trick/hack to get the hand cursor to appear on the up and down arrows of a standard Flex scrollbar. In order to do this you need to create a class that subclasses a class that has a scrollbar attached to it. In this case a TextArea:

public class CustomTextArea extends TextArea

The class mx.controls.TextArea extends mx.core.ScrollControlBase. This class contains the verticalScrollbar and horizontalScrollBar. We can reference these in our code. For instance:

verticalScrollBar.visible = false;

When you take a deeper look into the mx.controls.scrollClasses.Scrollbar class you’ll find the downArrow and upArrow properties:

/** * @private * The up arrow button. */ mx_internal var upArrow:Button; /** * @private * The down arrow button. */ mx_internal var downArrow:Button;

They’re defined in the mx_internal namespace and normally you can’t access these properties. There is a way to do it though (in the CustomTextArea class defined above):

import mx.core.mx_internal; .... use namespace mx_internal; verticalScrollBar.mx_internal::upArrow.useHandCursor = true; verticalScrollBar.mx_internal::upArrow.buttonMode = true; verticalScrollBar.mx_internal::downArrow.useHandCursor = true; verticalScrollBar.mx_internal::downArrow.buttonMode = true;

Only use this when you don’t have any other options though. I think Adobe uses this namespace to mark things that they might change in future releases.

Showing the hand cursor on a Flex scrollbar

Wed, 07/30/2008 - 07:43

Here's a little trick/hack to get the hand cursor to appear on the up and down arrows of a standard Flex scrollbar. In order to do this you need to create a class that subclasses a class that has a scrollbar attached to it. In this case a TextArea:

public class CustomTextArea extends TextArea

The class mx.controls.TextArea extends mx.core.ScrollControlBase. This class contains the verticalScrollbar and horizontalScrollBar. We can reference these in our code. For instance:

verticalScrollBar.visible = false;

When you take a deeper look into the mx.controls.scrollClasses.Scrollbar class you'll find the downArrow and upArrow properties:

/** * @private * The up arrow button. */ mx_internal var upArrow:Button; /** * @private * The down arrow button. */ mx_internal var downArrow:Button;

They're defined in the mx_internal namespace and normally you can't access these properties. There is a way to do it though (in the CustomTextArea class defined above):

import mx.core.mx_internal; .... use namespace mx_internal; verticalScrollBar.mx_internal::upArrow.useHandCursor = true; verticalScrollBar.mx_internal::upArrow.buttonMode = true; verticalScrollBar.mx_internal::downArrow.useHandCursor = true; verticalScrollBar.mx_internal::downArrow.buttonMode = true;

Only use this when you don't have any other options though. I think Adobe uses this namespace to mark things that they might change in future releases.