Flex i automatycznie skalowane Canvas
W technologii Adobe Flex jest coś takiego jak płótno – Canvas. Jeżeli na tym płótnie położymy zbyt wiele obiektów, to Flex automatycznie narysuje suwaki (ScrollBar). Ja zamiast suwaków wolę skalować. To znaczy, gdy położę na płótnie jakieś elementy które z niego wystają to Flex skaluje zawartość zamiast rysować suwaki. Zrobiłem to dość prosto.
package eu.jakubiak.ui
{
import mx.containers.Canvas;
import mx.core.ScrollPolicy;
public class ScaledCanvas extends Canvas
{
public function ScaledCanvas()
{
super();
horizontalScrollPolicy = ScrollPolicy.OFF;
verticalScrollPolicy = ScrollPolicy.OFF;
}
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
super.updateDisplayList(unscaledWidth,unscaledHeight);
var mx:Number = measuredWidth / scaleX;
var my:Number = measuredHeight / scaleY;
if(width < mx || height < my) {
var sx:Number = width / mx;
var sy:Number = height / my;
if(Math.max(Math.abs(sy - scaleY),Math.abs(sx - scaleX))>0.01) {
var s:Number = Math.min( sx, sy );
this.scaleX = s;
this.scaleY = s;
}
} else if ( width > mx && height > my && ( scaleX != 1 || scaleY != 1 ) ) {
scaleX = 1;
scaleY = 1;
}
}
}
}
Jest to użyteczne, gdy na przykład mamy koszyk z elementami przeciąganymi techniką drag&drop. Gdy włożymy do koszyka za dużo elementów to koszyk się pomniejsza zamiast rysować suwaki.
Categories: FLEX