date:20091018

RE: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

2009-10-18 Thread Cor

I think it really is in the tiny difference in color values.
(if you want the glow rounded as on
http://www.jooria.com/Drawing-Glossy-Button-a138.html, you could use a
Bezier curve).
I did this and added a little bevel.

Regards
Cor
//---

package {
import flash.display.Sprite;

public class SimpleButton_Cor extends Sprite {
public function SimpleButton_Cor () {
var button:CustomSimpleButton = new
CustomSimpleButton();
button.x = button.y = 100;
addChild (button);
}
}
}

import flash.display.*;
import flash.filters.*;
import flash.geom.*;

class CustomSimpleButton extends SimpleButton {
private var overColor:uint = 0xFFCC00;
private var downColor:uint = 0xFF;
private var upColor:uint = 0x00CCFF;
private var size:uint = 80;

public function CustomSimpleButton () {
downState = new ButtonDisplayState(downColor,size);
overState = new ButtonDisplayState(overColor,size);
upState = new ButtonDisplayState(upColor,size);
hitTestState = upState;
useHandCursor = true;
}
}

class ButtonDisplayState extends Shape {
private var bgColor:uint;
private var size:uint;

public static const SHADOW:GlowFilter = new
GlowFilter(0x00,1.0,4,4,1,1,false,false);
public static const GLOW:GlowFilter = new
GlowFilter(0xFF,0.8,40,40,1,1,true,false);
public static const BEVEL:BevelFilter = new
BevelFilter(2,45,0xFF,.8,0x00,.8,2,2,3,3,inner,false);

public function ButtonDisplayState (bgColor:uint, size:uint) {
this.bgColor = bgColor;
this.size = size;
draw ();
}

private static function brighten (color:uint, modifier:int):uint {
var red:int   = (color  16)  0xFF;
var green:int = (color  8)  0xFF;
var blue:int = color  0xFF;

red += modifier;
if (red0xFF) {
red=0xFF;
} else if (red  0) {
red=0;

}
green+=modifier;
if (green0xFF) {
green=0xFF;
} else if (green  0) {
green=0;

}
blue+=modifier;
if (blue0xFF) {
blue=0xFF;
} else if (blue  0) {
blue=0;

}
return (red  16) | (green  8) | blue;
}

private function draw ():void {
var
colors:Array=[brighten(bgColor,120),bgColor,brighten(bgColor,40)];
var alphas:Array=[1,1,1];
var ratios:Array=[0,127,255];
var matrix:Matrix = new Matrix();
matrix.createGradientBox (size * 4, size, Math.PI / 2, 0,
0);

graphics.beginGradientFill (GradientType.LINEAR, colors,
alphas, ratios, matrix);
graphics.drawRoundRect (0, 0, size * 4, size, 4);

graphics.beginFill (0x00, 0.1);
graphics.drawRoundRect (0, size / 2, size * 4, size / 2, 4);
graphics.endFill ();

var colors2:Array=[0xff,0xff,0xff,0xff];
var alphas2:Array=[.9, .6, .5, .1];
var ratios2:Array=[0,127,128,255];
var matrix2:Matrix = new Matrix();
matrix2.createGradientBox (size, size/2, Math.PI / 2, 0, 0);

graphics.beginGradientFill (GradientType.LINEAR, colors2,
alphas2, ratios2, matrix2);
graphics.drawRect (0, size/2, size * 4, size/2);

filters=[SHADOW,GLOW,BEVEL];
}
}

___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

Re: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

2009-10-18 Thread Alexander Farber

Hello all,

thank you for your replies.

I've added another Shape on top of my gradient
and set its blendMode to BlendMode.OVERLAY
and am finally satisfied with the result (except
the downState - red doesn't look good there
for some reason. The overlay is too bright there)...

Your suggestion with BevelFilter, Cor, is a good
trick too - thank you. It just doesn't match my
case, I want to make a long bar of glossy buttons.

I'm pasting my source code below for
the archives and if someone is interested.

I wonder if the treshold for OVERLAY can
be changed (through setting DisplayObject's
alpha?) or if it's always at 50%?

Regards
Alex

package {
import flash.display.Sprite;

public class SimpleButtonExample extends Sprite {
public function SimpleButtonExample() {
var button:CustomSimpleButton = new CustomSimpleButton();
button.x = button.y = 100;
addChild(button);
}
}
}

import flash.display.*;
import flash.filters.*;
import flash.geom.*;

class CustomSimpleButton extends SimpleButton {
private var overColor:uint = 0xFFCC00;
// this one still doesn't look good:
private var downColor:uint = 0xFF;
private var upColor:uint   = 0x00CCFF;
private var size:uint  = 80;

public function CustomSimpleButton() {
downState  = new ButtonDisplayState(downColor, size);
overState  = new ButtonDisplayState(overColor, size);
upState= new ButtonDisplayState(upColor, size);
hitTestState   = upState;
useHandCursor  = true;
}
}

class ButtonDisplayState extends Sprite {
private var bgColor:uint;
private var size:uint;

public static const SHADOW:GlowFilter =
new GlowFilter(0x00, 1.0, 4, 4, 1, 1, false, false);

private static const GLOW:GlowFilter =
new GlowFilter(0xFF, 0.8, 40, 40, 1, 1, true, false);

public function ButtonDisplayState(bgColor:uint, size:uint) {
this.bgColor = bgColor;
this.size= size;
draw();
}

private static function brighten(color:uint, modifier:int):uint {
var red:int   = (color  16)  0xFF;
var green:int = (color  8)  0xFF;
var blue:int  = color  0xFF;

red += modifier;
if (red  0xFF)
red = 0xFF;
else if (red  0)
red = 0;

green += modifier;
if (green  0xFF)
green = 0xFF;
else if (green  0)
green = 0;

blue += modifier;
if (blue  0xFF)
blue = 0xFF;
else if (blue  0)
blue = 0;

return (red  16) | (green  8) | blue;
}

private function draw():void {
var colors:Array = [brighten(bgColor, 120), bgColor];
var alphas:Array = [1, 1];
var ratios:Array = [0, 255];
var matrix:Matrix = new Matrix();
var overlay:Shape = new Shape();
matrix.createGradientBox(size * 4, size, Math.PI / 2, 0, 0);

graphics.beginGradientFill(GradientType.LINEAR, colors, alphas,
ratios, matrix);
graphics.drawRoundRect(0, 0, size * 4, size, 4);

overlay.graphics.beginFill(0xFF, 0.6);
overlay.graphics.drawRoundRect(0, 0, size * 4, size / 3, 8);
overlay.graphics.endFill();
overlay.blendMode = BlendMode.OVERLAY;
addChild(overlay);

filters = [ SHADOW, GLOW ];
}
}
___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

RE: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

2009-10-18 Thread Cor

Nice work Alex.
Thanks for your final solution!

Regards
Cor

-Original Message-
From: flashcoders-boun...@chattyfig.figleaf.com
[mailto:flashcoders-boun...@chattyfig.figleaf.com] On Behalf Of Alexander
Farber
Sent: zondag 18 oktober 2009 10:29
To: Flash Coders List
Subject: Re: [Flashcoders] Vista-like glossy SimpleButton - please help with
the final touch

Hello all,

thank you for your replies.

I've added another Shape on top of my gradient
and set its blendMode to BlendMode.OVERLAY
and am finally satisfied with the result (except
the downState - red doesn't look good there
for some reason. The overlay is too bright there)...

Your suggestion with BevelFilter, Cor, is a good
trick too - thank you. It just doesn't match my
case, I want to make a long bar of glossy buttons.

I'm pasting my source code below for
the archives and if someone is interested.

I wonder if the treshold for OVERLAY can
be changed (through setting DisplayObject's
alpha?) or if it's always at 50%?

Regards
Alex

package {
import flash.display.Sprite;

public class SimpleButtonExample extends Sprite {
public function SimpleButtonExample() {
var button:CustomSimpleButton = new CustomSimpleButton();
button.x = button.y = 100;
addChild(button);
}
}
}

import flash.display.*;
import flash.filters.*;
import flash.geom.*;

class CustomSimpleButton extends SimpleButton {
private var overColor:uint = 0xFFCC00;
// this one still doesn't look good:
private var downColor:uint = 0xFF;
private var upColor:uint   = 0x00CCFF;
private var size:uint  = 80;

public function CustomSimpleButton() {
downState  = new ButtonDisplayState(downColor, size);
overState  = new ButtonDisplayState(overColor, size);
upState= new ButtonDisplayState(upColor, size);
hitTestState   = upState;
useHandCursor  = true;
}
}

class ButtonDisplayState extends Sprite {
private var bgColor:uint;
private var size:uint;

public static const SHADOW:GlowFilter =
new GlowFilter(0x00, 1.0, 4, 4, 1, 1, false, false);

private static const GLOW:GlowFilter =
new GlowFilter(0xFF, 0.8, 40, 40, 1, 1, true, false);

public function ButtonDisplayState(bgColor:uint, size:uint) {
this.bgColor = bgColor;
this.size= size;
draw();
}

private static function brighten(color:uint, modifier:int):uint {
var red:int   = (color  16)  0xFF;
var green:int = (color  8)  0xFF;
var blue:int  = color  0xFF;

red += modifier;
if (red  0xFF)
red = 0xFF;
else if (red  0)
red = 0;

green += modifier;
if (green  0xFF)
green = 0xFF;
else if (green  0)
green = 0;

blue += modifier;
if (blue  0xFF)
blue = 0xFF;
else if (blue  0)
blue = 0;

return (red  16) | (green  8) | blue;
}

private function draw():void {
var colors:Array = [brighten(bgColor, 120), bgColor];
var alphas:Array = [1, 1];
var ratios:Array = [0, 255];
var matrix:Matrix = new Matrix();
var overlay:Shape = new Shape();
matrix.createGradientBox(size * 4, size, Math.PI / 2, 0, 0);

graphics.beginGradientFill(GradientType.LINEAR, colors, alphas,
ratios, matrix);
graphics.drawRoundRect(0, 0, size * 4, size, 4);

overlay.graphics.beginFill(0xFF, 0.6);
overlay.graphics.drawRoundRect(0, 0, size * 4, size / 3, 8);
overlay.graphics.endFill();
overlay.blendMode = BlendMode.OVERLAY;
addChild(overlay);

filters = [ SHADOW, GLOW ];
}
}
___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

Re: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

2009-10-18 Thread Hans Wichman

Cool alex,

I was trying to find my old aqua code, but can't locate it, it was as2
anyway, so I'll have rewrite it for as3.

Not quite vista, but still acceptable I think:
http://www.objectpainters.com/flashExamples/aqua/

As said, I'll have to rewrite it for as3 and I made an error in the
reflection, mixing it up with how the shadow would fall when using
backlighting I applied a displacement map to have it 'spread' which is of
course wrong for a reflection, which shouldn't spread at all.

Anyway, if anyone is interested I can still post the code after migration.

regards,
JC



On Sun, Oct 18, 2009 at 10:57 AM, Cor c...@chello.nl wrote:

 Nice work Alex.
 Thanks for your final solution!

 Regards
 Cor

 -Original Message-
 From: flashcoders-boun...@chattyfig.figleaf.com
 [mailto:flashcoders-boun...@chattyfig.figleaf.com] On Behalf Of Alexander
 Farber
 Sent: zondag 18 oktober 2009 10:29
 To: Flash Coders List
 Subject: Re: [Flashcoders] Vista-like glossy SimpleButton - please help
 with
 the final touch

 Hello all,

 thank you for your replies.

 I've added another Shape on top of my gradient
 and set its blendMode to BlendMode.OVERLAY
 and am finally satisfied with the result (except
 the downState - red doesn't look good there
 for some reason. The overlay is too bright there)...

 Your suggestion with BevelFilter, Cor, is a good
 trick too - thank you. It just doesn't match my
 case, I want to make a long bar of glossy buttons.

 I'm pasting my source code below for
 the archives and if someone is interested.

 I wonder if the treshold for OVERLAY can
 be changed (through setting DisplayObject's
 alpha?) or if it's always at 50%?

 Regards
 Alex

 package {
import flash.display.Sprite;

public class SimpleButtonExample extends Sprite {
public function SimpleButtonExample() {
var button:CustomSimpleButton = new CustomSimpleButton();
button.x = button.y = 100;
addChild(button);
}
}
 }

 import flash.display.*;
 import flash.filters.*;
 import flash.geom.*;

 class CustomSimpleButton extends SimpleButton {
private var overColor:uint = 0xFFCC00;
// this one still doesn't look good:
private var downColor:uint = 0xFF;
private var upColor:uint   = 0x00CCFF;
private var size:uint  = 80;

public function CustomSimpleButton() {
downState  = new ButtonDisplayState(downColor, size);
overState  = new ButtonDisplayState(overColor, size);
upState= new ButtonDisplayState(upColor, size);
hitTestState   = upState;
useHandCursor  = true;
}
 }

 class ButtonDisplayState extends Sprite {
private var bgColor:uint;
private var size:uint;

public static const SHADOW:GlowFilter =
new GlowFilter(0x00, 1.0, 4, 4, 1, 1, false, false);

private static const GLOW:GlowFilter =
new GlowFilter(0xFF, 0.8, 40, 40, 1, 1, true, false);

public function ButtonDisplayState(bgColor:uint, size:uint) {
this.bgColor = bgColor;
this.size= size;
draw();
}

private static function brighten(color:uint, modifier:int):uint {
var red:int   = (color  16)  0xFF;
var green:int = (color  8)  0xFF;
var blue:int  = color  0xFF;

red += modifier;
if (red  0xFF)
red = 0xFF;
else if (red  0)
red = 0;

green += modifier;
if (green  0xFF)
green = 0xFF;
else if (green  0)
green = 0;

blue += modifier;
if (blue  0xFF)
blue = 0xFF;
else if (blue  0)
blue = 0;

return (red  16) | (green  8) | blue;
}

private function draw():void {
var colors:Array = [brighten(bgColor, 120), bgColor];
var alphas:Array = [1, 1];
var ratios:Array = [0, 255];
var matrix:Matrix = new Matrix();
var overlay:Shape = new Shape();
matrix.createGradientBox(size * 4, size, Math.PI / 2, 0, 0);

graphics.beginGradientFill(GradientType.LINEAR, colors, alphas,
 ratios, matrix);
graphics.drawRoundRect(0, 0, size * 4, size, 4);

overlay.graphics.beginFill(0xFF, 0.6);
overlay.graphics.drawRoundRect(0, 0, size * 4, size / 3, 8);
overlay.graphics.endFill();
overlay.blendMode = BlendMode.OVERLAY;
addChild(overlay);

filters = [ SHADOW, GLOW ];
}
 }
 ___
 Flashcoders mailing list
 Flashcoders@chattyfig.figleaf.com
 http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

 ___
 Flashcoders mailing list
 Flashcoders@chattyfig.figleaf.com
 http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com

Re: [Flashcoders] Movieclip in a remote shared object

2009-10-18 Thread Steven Sacks


What does that mean?


ktt wrote:

Hello,

Is it possible to store Movieclip in a remote shared object?

Ktt


  
___

Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders


___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

Re: [Flashcoders] Movieclip in a remote shared object

2009-10-18 Thread Hans Wichman

Hi,

as far as I'm aware, stored objects lose all type info except the basic
types objects, strings, number etc.
So no no storing of movieclips I think, but you can always try;)

regards,
Hans

On Sun, Oct 18, 2009 at 12:53 AM, ktt kestuti...@yahoo.com wrote:

 Hello,

 Is it possible to store Movieclip in a remote shared object?

 Ktt



 ___
 Flashcoders mailing list
 Flashcoders@chattyfig.figleaf.com
 http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

Re: [Flashcoders] Movieclip in a remote shared object

2009-10-18 Thread Patrick Matte

I don't think you can store MovieClip but I don't know exactly why, you
can't store BitmapData either, because it needs parameters passed to the
constructor.
But you can store many different types of objects, just make sure you use
flash.net.registerClassAlias(full.class.path, Class);
And make sure that all the parameters in the constructor of the objects you
want to store are all optional(have a default value).


 From: ktt kestuti...@yahoo.com
 Reply-To: Flash Coders List flashcoders@chattyfig.figleaf.com
 Date: Sat, 17 Oct 2009 15:53:48 -0700 (PDT)
 To: Flash Coders List flashcoders@chattyfig.figleaf.com
 Subject: [Flashcoders] Movieclip in a remote shared object
 
 Hello,
 
 Is it possible to store Movieclip in a remote shared object?
 
 Ktt
 
 
   
 ___
 Flashcoders mailing list
 Flashcoders@chattyfig.figleaf.com
 http://chattyfig.figleaf.com/mailman/listinfo/flashcoders



This e-mail is intended only for the named person or entity to which it is 
addressed and contains valuable 
business information that is proprietary, privileged, confidential and/or 
otherwise protected from disclosure.

If you received this e-mail in error, any review, use, dissemination, 
distribution or copying of this e-mail 
is strictly prohibited. Please notify us immediately of the error via e-mail to 
disclai...@tbwachiat.com and 
please delete the e-mail from your system, retaining no copies in any media. We 
appreciate your cooperation.

___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

RE: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

2009-10-18 Thread Kerry Thompson

Hans Wichman wrote:

 if anyone is interested I can still post the code after migration.

That's pretty cool-looking, Hans. I'd love to see the AS3 implementation.

Cordially,

Kerry Thompson

___
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders

RE: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

Re: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

RE: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

Re: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

Re: [Flashcoders] Movieclip in a remote shared object

Re: [Flashcoders] Movieclip in a remote shared object

Re: [Flashcoders] Movieclip in a remote shared object

RE: [Flashcoders] Vista-like glossy SimpleButton - please help with the final touch

8 matches

Site Navigation

Mail list logo

Footer information