5 Replies Latest reply on Mar 30, 2011 5:30 AM by ABlueEyedMonkey

    Large vertical gradients not working like examples

    ABlueEyedMonkey

      Hello guys, now this seems to be a very straight forward thing to do and there are loads of tutorials about the subject. None of them are helping me get this right though, and I can't for the life of me figure out what's wrong...

      Im trying to create a simple gui component that has a vertical gradient, simple enough right... I create the sprite, and draw the gradient with beginGradientFill and a matrix with a 90 degree radian angle on it; but it stops working if the sprite has a long width, below is an exmaple of what I mean:

       

      package

      {

      import flash.display.GradientType;

      import flash.display.Shape;

      import flash.display.Sprite;

      import flash.geom.Matrix;

       

      public class Main extends Sprite

      {

      public function Main()

      {

      var theWidth : Number = 800;

      var theHeight: Number = 100;

       

      var shape1:Shape = new Shape();

      var matrix:Matrix = new Matrix();

      matrix.createGradientBox(theWidth , theHeight, Math.PI*0.5, 0, 0);

      var colors:Array = [ 0xffffff, 0x000000];

      var alphas:Array = [ 100, 100];

      var ratios:Array = [ 0, 255];

      shape1.graphics.lineStyle(2,0xa1b0b6);

      shape1.graphics.beginGradientFill(GradientType.LINEAR,colors, alphas, ratios, matrix);

      shape1.graphics.drawRect( 0.0, 0.0, theWidth , theHeight);

      shape1.graphics.endFill();

      addChild(shape1);

      }

      }

      }

       

      If I change

      matrix.createGradientBox(800, 100, Math.PI*0.5, 0, 0);

       

      to

       

      matrix.createGradientBox(800, 100, Math.PI, 0, 0);

       

      it works fine - but horizontally - why is it that applying 90 degrees the fill does not work?

       

      Thanks for your help, I really don't know whats wrong with this