Tjoa Design

Syndicate content
Technical notes about Flex, Flash and other geeky things
Updated: 1 year 6 weeks ago

Away3DLite uses an inverted y-axis

Mon, 06/28/2010 - 21:45

I switched over from Away3D to Away3DLite, hoping that my performance issues would be solved. And indeed, Away3DLite is much faster than it’s big brother. However, I suddenly noticed that the y-axis seemed to be inverted (negative values above the root and positive values under the root). I first thought I made some errors with the camera and that I was seeing everyting upside down.

This post seems to explain the reason: The y-axis is inverted.

Strange thing is, however, if you place a cone on the scene, it is pointing upwards as you would expect when using a normal (not-inverted) y-axis. Makes it all a bit confusing, but now you know…

Monthly open source donation: Away3D

Sun, 06/27/2010 - 13:18

Away3D is an open source 3D Flash Engine, much like PaperVision3D. The documentation is ok and you can find a good collection of tutorials to get started. It’s quite easy to get started, although it is not always easy to find precise descriptions of object properties and how they should be used. I haven’t looked at the forum yet.

So far, I’m quite pleased about it and donated $20,-.

Using filters in Away3D

Sun, 06/27/2010 - 06:42

I’m working on my first project using Away3D and am stumbling on some basic issues. I was trying to use a blurfilter on objects with no result whatsoever. Until I found an example written by tartiflop that gave the answer: use the property ‘ownCanvas’.

Like:

var topPlane:Plane = new Plane({ownCanvas:true}); topPlane.filters.push(new BlurFilter(8, 8));

Cannot change general setup of MySql Eventum

Tue, 05/04/2010 - 06:54

I installed the issue and bug tracking system Eventum. This is an open source system that is both made and used by the MySql team. During installation, I didn’t configure the smtp settings correctly and couldn’t find a way to reconfigure this. The installation guide mentions the path ‘Administration/General Setup’, but I couldn’t find the General Setup option. After googling around, I only found a spanish post about this issue:

http://gacimartin.com/2008/07/20/como-ver-las-opciones-de-superusuario-de-eventum-smtp-etc/

If you don’t read Spanish, this is a summary of the problem and the solution:

Apparently, it sometimes happens that your account is not registered as an ‘Admin’ account. You have find the id of your user account in the table ‘user’. Then find the corresponding row in the table ‘project_user” and set the field ‘pru_role’ to ‘7′.

Canvas with an easing scrollbar

Fri, 04/23/2010 - 09:52

Unfortunately, Flex does not contain a container class with an easing scrollbar. I mean a scrollbar that will give you an ‘organic’ or ‘physical’ feeling. This is often implemented with an effect that causes the container content to gradually stop scrolling after you have stopped dragging the scroll thumb. Compare it with how you scroll through a list in for example an iPhone.

I superficially read some articles on how people implemented their version. I didn’t find a ready to use component, so I decided to make one myself as a challenge.

My component behaves like a Canvas with an HScrollBar and the idea is really simple:
There is an inner Canvas and an outer Canvas. The inner Canvas contains the content you want to scroll. The HScrollBar of the inner Canvas is hidden. The outer Canvas creates a proxy HScrollBar and positions this over the hidden HScrollBar. Now the user interacts with the proxy HScrollBar and each change is copied to the HScrollBar of the inner Canvas. And the trick now is to use an easing function when you copy the proxy Scroll thumb position to the hidden Scroll thumb position.

Here you see both HScrollBars on top of each other. The upper HScrollBar is the original scrollbar of the inner Canvas. The lower HScrollBar is the proxy version.

-->

-->

And if we hide the upper HScrollBar and shift the lower HScrollBar upwards to take its place, we get this:

-->

-->

While the principle seems to work, the feeling is not perfect. It’s not as nice as it is on an iPhone. So I’ll have to work on that.

Furthermore, I want to combine two behaviours:

  • Slow scrolling with a behaviour almost without easing
  • Stepwise/fast scrolling with a strong apparent easing

I’ll continue working on this and post improvements.

Refer to an embedded image by a string variable

Fri, 04/23/2010 - 08:58

I’m making a small banner like application. All images have to be embedded into the application, but I want to be able to dynamically create these images. The position on the stage is configured using an external XML file. So, somehow, I have to be able to make references to the embedded images in my XML-file.

Example of an embedded image:

[Embed(source="assets/image.jpg")] [Bindable] private var myImage:Class;

An easy way to do this is of course:

var imgClass:Class; switch (imageName) { case 'myImage': imgClass = myImage; break; case 'otherImage': imgClass = otherImage; break; }

But there is an easier solution. Say that the image is embedded in MyView.mxml, then you can use this statement in MyView.mxml;

var imgClass:Class = getDefinitionByName(getQualifiedClassName(this)+'_'+imageName) as Class;

If you use the debugger, you’ll see that imgClass looks like: MyView_myImage. Or more specifically, if MyView.mxml is located in package, e.g. ‘views’, then imgClass = views.MyView_myImage;

How to make a Dictionary bindable

Mon, 04/12/2010 - 17:48

The Dictionary class in Flex is not bindable. To make a Dictionary bindable, use the ObjectProxy class as a wrapper.

public class BindableDictionary extends ObjectProxy { private var _state:Dictionary; public function BindableDictionary() { _state = new Dictionary(); super(_state); } }

Now you can set eventlisteners on the wrapper:

var bd:BindableDictionary = new BindableDictionary(); bd.addEventListener(PropertyChangeEvent.PROPERTY_CHANGE, handler);

I haven’t done full functional testing on this, but it seems to work fine so far.

Monthly open source donation: Efflex – Flex effects

Thu, 04/01/2010 - 20:03

I wanted to donate in March to the Efflex project. There is a Paypal button on the site, but it doesn’t lead to page where you can actually donate. So I’ll wait until this button is fixed.

The project presents some excellent effects, especially for use with viewstacks.

Update april 14, 2010:
The button now works!