Away3DLite uses an inverted y-axis
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
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
Posted by admin in Uncategorized on June 27th, 2010
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
Posted by admin in Uncategorized on May 4th, 2010
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
Posted by admin in Uncategorized on April 23rd, 2010
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
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
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
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!
Use syntax highlighting in WordPress
Posted by admin in Uncategorized on February 14th, 2010
I spent more than an hour to find out how you can use syntax highlighting in WordPress. There’s tons of information around this subject, but I couldn’t find anything to get you started with a few easy steps. So….here is my attempt.
Step 1:
Install Syntax Highlighter Evolved.
Step 2:
Create or edit a post and select the ‘HTML’ tab on the top right.
Step 3. Copy your source code from your html-editor and paste into the post.
Step 4. Put code tags around the pasted code:
Flex HSlider tooltip does not respect stage boundaries
Had some difficulty in formulating a good title. But the problem is as follows:
If you have an HSlider and the right side of the slider is close to the right side of the stage, the tooltip may ‘walk off’ the screen. See the following image. The grey background is the standard Flex Halo background. The green background is the color of my desk top.
This does not happen at the left side of the stage. If you drag the thumb to the left end of the slider, you see some smart things happening: the tooltip gets stuck at stage.x = 0;
I set myself to solve this problem and came up with a solution, which may also be called a hack. It uses mx_internal namespace, which means that it may not work in future versions of the Flex SDK. But I don’t know a better way. You do? Please let me know!
Step 1. Extend the SliderDataTip class:
package cbs.components.sliderClasses
{
import flash.geom.Point;
import mx.controls.sliderClasses.Slider;
import mx.controls.sliderClasses.SliderDataTip;
public class MySliderDataTip extends SliderDataTip
{
private var _slider:Slider;
public function MySliderDataTip(owner:Slider):void {
_slider = owner;
}
override protected function updateDisplayList(w:Number, h:Number):void {
super.updateDisplayList(w,h);
// Check if the tip overlaps the right side of the slider
if (_slider) {
var sliderPos:Point = _slider.localToGlobal(new Point(0, 0));
if (this.x + w >= sliderPos.x + _slider.width) {
this.x = sliderPos.x + _slider.width - w;
}
}
}
}
}
Extend the HSlider and override the onThumbPress function.
override mx_internal function onThumbPress(thumb:Object):void {
// Hack this function, to be able to generate our own slidertip and
// set a parameter.
if (!dataTip) {
dataTip = MySliderDataTip(new MySliderDataTip(this));
systemManager.toolTipChildren.addChild(dataTip);
var dataTipStyleName:String = getStyle("dataTipStyleName");
if (dataTipStyleName)
{
dataTip.styleName = dataTipStyleName;
}
}
super.onThumbPress(thumb);
}
That’s it!