Teachers: 18

Showing posts with label 18. Show all posts

Friday, February 13, 2015

HowTo Install VirtualBox on Fedora 18 x64

Step1:
- download VirtualBox 4.2.6 for Linux hosts and VirtualBox 4.2.6 Oracle VM VirtualBox Extension Pack on this website https://www.virtualbox.org/wiki/Downloads
- choose the AMD64 architecture for Fedora 18 ("Spherical Cow")

Step2:
- open terminal and type the following
su -
yum update -y
reboot
**your computer will reboot

Step3:
su -
yum install -y dkms gcc
cd /home/**user**/Downloads
yum install -y VirtualBox-4.2-4.2.6_82870_fedora18-1.x86_64.rpm
/etc/init.d/vboxdrv setup
usermod -a -G vboxusers administrator

Step4:
- open a new terminal and type the following
VirtualBox

Step5:
- the Oracle VM VirtualBox Manager will pop-up
- click File->Preferences
- select Extensions
- press the add package button

- find and select Oracle_VM_VirtualBox_Extension_Pack-4.2.6-82870.vbox-extpack
- press Install
- read and understand the VirtualBox licence (click and drag the scrollbar up to the bottom to activate the "I Agree" button)
- supply your root password
- your done!

Creating Advanced Alert Window class Part 18

Today well improve the skinning capabilities for AdvAlertButton objects.

Start by going to AdvAlertButton.as and declare 5 new variables:

private var textFormat:TextFormat;
private var bgStroke:*;
private var bgRect:*;
private var pos:Point;
private var textPadding:TextPadding;

Modify the constructor so that it doesnt erceive width and height values anymore, and doesnt set their values to w and h variables. Instead, call a setSkin() method.

/**
 * Button object placed in the alert window.
 * @paramlabel Text label of the button.
 */

public function AdvAlertButton(label:String) 
{
txt = label;
textField = new TextField();
addChild(textField);

setSkin();

updateDraw();
}

In setSkin(), apply values to all the skinning variables we have.

public function setSkin():void {
w = 80;
h = 30;
textFormat = new TextFormat("Arial", 16, 0xffffff);
textFormat.align = "center";
bgStroke = new SolidColorStroke(2, 0x333399, 1);
bgRect = new SolidColorRect(0x6666ff, [3, 3, 3, 3], 1);
pos = new Point(0, 0);
textPadding = new TextPadding(3, 0, 3, 0);
}

Now go to updateDraw() function. Here, add the piece of code from AdvAlertWindows which draws background box based on the values:

// bg stroke
if (bgStroke is SolidColorStroke) {
this.graphics.lineStyle(bgStroke._lineThickness, bgStroke._lineColor, bgStroke._lineAlpha);
}
if (bgStroke is GradientColorStroke) {
this.graphics.lineStyle(bgStroke._lineThickness);
this.graphics.lineGradientStyle(bgStroke._gradientType, bgStroke._colors, bgStroke._alphas, bgStroke._ratios, bgStroke._matrix, bgStroke._spreadMethod, bgStroke._interpolationMethod, bgStroke._focalPointRatio);
}
if (bgStroke is BitmapStroke) {
this.graphics.lineStyle(bgStroke._lineThickness);
this.graphics.lineBitmapStyle(bgStroke._bitmap, bgStroke._matrix, bgStroke._repeat, bgStroke._smooth);
}

// bg fill
if (bgRect is SolidColorRect) this.graphics.beginFill(bgRect._backgroundColor, bgRect._alpha);
if (bgRect is GradientColorRect) this.graphics.beginGradientFill(bgRect._gradientType, bgRect._colors, bgRect._alphas, bgRect._ratios, bgRect._matrix, bgRect._spreadMethod, bgRect._interpolationMethod, bgRect._focalPointRatio);
if (bgRect is BitmapRect) this.graphics.beginBitmapFill(bgRect._bitmap, bgRect._matrix, bgRect._repeat, bgRect._smooth);

this.graphics.drawRoundRectComplex(pos.x, pos.y, w, h,
bgRect._radius[0], bgRect._radius[1], bgRect._radius[2], bgRect._radius[3]);
this.graphics.endFill();

Apply values to textField as well:

// text field
textField.width = w;
textField.height = h;
textField.text = txt;
textField.setTextFormat(textFormat);
textField.selectable = false;
textField.x = pos.x + textPadding.right;
textField.y = pos.y + textPadding.top;

Full class:

package com.kircode.AdvAlert 
{
import flash.display.MovieClip;
import flash.geom.Point;
import flash.text.TextField;
import flash.text.TextFormat;

/**
 * Advanced Alert window object.
 * @author Kirill Poletaev
 */
public class AdvAlertButton extends MovieClip
{

public var w:Number;
public var h:Number;
private var textFormat:TextFormat;
private var bgStroke:*;
private var bgRect:*;
private var pos:Point;
private var textPadding:TextPadding;

private var textField:TextField;
private var txt;

/**
 * Button object placed in the alert window.
 * @paramlabel Text label of the button.
 */

public function AdvAlertButton(label:String) 
{
txt = label;
textField = new TextField();
addChild(textField);

setSkin();

updateDraw();
}

public function setSkin():void {
w = 80;
h = 30;
textFormat = new TextFormat("Arial", 16, 0xffffff);
textFormat.align = "center";
bgStroke = new SolidColorStroke(2, 0x333399, 1);
bgRect = new SolidColorRect(0x6666ff, [3, 3, 3, 3], 1);
pos = new Point(0, 0);
textPadding = new TextPadding(3, 0, 3, 0);
}

public function updateDraw():void {
this.graphics.clear();

// bg stroke
if (bgStroke is SolidColorStroke) {
this.graphics.lineStyle(bgStroke._lineThickness, bgStroke._lineColor, bgStroke._lineAlpha);
}
if (bgStroke is GradientColorStroke) {
this.graphics.lineStyle(bgStroke._lineThickness);
this.graphics.lineGradientStyle(bgStroke._gradientType, bgStroke._colors, bgStroke._alphas, bgStroke._ratios, bgStroke._matrix, bgStroke._spreadMethod, bgStroke._interpolationMethod, bgStroke._focalPointRatio);
}
if (bgStroke is BitmapStroke) {
this.graphics.lineStyle(bgStroke._lineThickness);
this.graphics.lineBitmapStyle(bgStroke._bitmap, bgStroke._matrix, bgStroke._repeat, bgStroke._smooth);
}

// bg fill
if (bgRect is SolidColorRect) this.graphics.beginFill(bgRect._backgroundColor, bgRect._alpha);
if (bgRect is GradientColorRect) this.graphics.beginGradientFill(bgRect._gradientType, bgRect._colors, bgRect._alphas, bgRect._ratios, bgRect._matrix, bgRect._spreadMethod, bgRect._interpolationMethod, bgRect._focalPointRatio);
if (bgRect is BitmapRect) this.graphics.beginBitmapFill(bgRect._bitmap, bgRect._matrix, bgRect._repeat, bgRect._smooth);

this.graphics.drawRoundRectComplex(pos.x, pos.y, w, h,
bgRect._radius[0], bgRect._radius[1], bgRect._radius[2], bgRect._radius[3]);
this.graphics.endFill();

// text field
textField.width = w;
textField.height = h;
textField.text = txt;
textField.setTextFormat(textFormat);
textField.selectable = false;
textField.x = pos.x + textPadding.right;
textField.y = pos.y + textPadding.top;
}


}

}

We now have skinnable buttons! Only default skins work right now, though. Well work on implementing custom skinning next time!

For now, you can test out the buttons with two simple lines of code in main.as:

AlertManager = new AdvAlertManager(this, stage.stageWidth, stage.stageHeight);
AlertManager.alert("This is an alert window with the default skin.", "Example alert!", [new AdvAlertButton("OK"), new AdvAlertButton("Cancel"), new AdvAlertButton("Back")]);

Thanks for reading!

Friday, February 13, 2015

HowTo Install VirtualBox on Fedora 18 x64

Wednesday, February 4, 2015

Creating Advanced Alert Window class Part 18