I have a problem to maintain full screen of my flash player built in flex and as3 using osmf
I want to display panel bar right at the bottom of user's screen. This should work on all screen resolution. What I am doing currently is working fine to display video on full screen but issue is that its not aligning control panel of video accordingly.
What I have currently is this
stage.fullScreenSourceRect = new Rectangle(0, 0, fsvideoContainerW , fsvideoContainerH);
videoContainer.width = fsvideoContainerW;
videoContainer.height = fsvideoContainerH;
stage.scaleMode = StageScaleMode.EXACT_FIT;
stage.displayState = StageDisplayState.FULL_SCREEN;
Please help me on this.
I can't see code dedicated to the positioning controls in your code. Main idea when you create resizable components is to listen to the Event.RESIZE. Here is an small snippet how it works:
package {
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;
public class StackOverflow extends Sprite {
private var _playerControls:VideoPlayerControls;
public function StackOverflow() {
addEventListener(Event.ADDED_TO_STAGE, onAdded);
}
private function onAdded(e:Event):void {
removeEventListener(Event.ADDED_TO_STAGE, onAdded);
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
setup();
}
private function setup():void {
//Main event that will help you reposition and resize your UI components
stage.addEventListener(Event.RESIZE, onResize);
_playerControls = new VideoPlayerControls();
addChild(_playerControls)
}
private function onResize(e:Event):void {
_playerControls.updateWidth(stage.stageWidth);
_playerControls.y = stage.stageHeight - _playerControls.height;
}
}
}
import flash.display.Sprite;
internal class VideoPlayerControls extends Sprite {
public function VideoPlayerControls() {
this.graphics.beginFill(0x333333);
this.graphics.drawRect(0, 0, 100, 40);
}
internal function updateWidth(width:int):void {
//Do logic with reposition and resizing components
this.width = width;
}
}
Stage properties align and scaleMode should be set only once at startup of you video player.
Related
In ActionScript I am try to use a button to generate an editable stage and allocate a movie clip to the center of the new stage.
This is my first set of goals and my attempts aren't working and I figured I'd ask for help:
Use the first movie clip as an orientation point (0) in an array
Populate it with clones of the first movie clip in Compass directions via a numeric stepper.
Normally to keep track of stage dimensions you put this into the root document class:
package
{
import flash.events.Event;
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
public class Main extends Sprite
{
public var Central:Sprite;
public function Main()
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.showDefaultContextMenu = false;
stage.align = StageAlign.TOP_LEFT;
stage.stageFocusRect = false;
stage.color = 0x00000000;
stage.addEventListener(Event.RESIZE, onResize);
}
private function onResize(event:Event = null):void
{
// Handle new stage dimensions here by
// stage.stageWidth
// stage.stageHeight
Central.x = stage.stageWidth / 2;
Central.y = stage.stageHeight / 2;
}
}
}
The center of the stage is (stage.stageWidth / 2, stage.stageHeight / 2). Then if you have content that exceeds stage width and height you scale it down by .scaleX and .scaleY properties.
I am attempting to display a class derived from SimpleButton on a Flash screen. This button is supposed to load an external JPG file and use it as the display.
The code for the custom button is shown below:
package {
import flash.display.Sprite;
import flash.display.Loader;
import flash.net.URLRequest;
public class CustomState extends Sprite {
public function CustomState()
{
var loader:Loader = new Loader();
loader.load(new URLRequest("file.jpg"));
this.width = 70;
this.height = 100;
addChild(loader);
trace("State Width: "+this.width);
}
}
}
The button state code is shown below:
package {
import flash.display.Sprite;
import flash.display.Loader;
import flash.net.URLRequest;
public class CustomState extends Sprite {
public function CustomState()
{
var loader:Loader = new Loader();
loader.load(new URLRequest("file.jpg"));
this.width = 70;
this.height = 100;
addChild(loader);
trace("State Width: "+this.width);
}
}
}
The code used to test the button is below:
package {
import flash.display.MovieClip;
public class TestButton extends MovieClip{
public function TestButton()
{
var button:CustomButton = new CustomButton();
button.x = 10;
button.y = 30;
addChild(button);
}
}
}
For reasons that are not clear, the button does not appear at all.
Can someone tell me how to make this button appear? As can be seen from the test class, I am adding the button to its display list. I also note that despite the fact that I am setting width and height for the sprite, its width and height apparently aren't being set. Something funky is going on, but my attempts to find a piece of working code that does what I am trying to do have failed.
Someone please advise...
I have a transparent image and a square. I'm wanting to detect when the square collides with the image. However, because the image is transparent it would still detect it colliding with the transparent pixels. So, after some reading I've attempted using BitmapData, which I haven't used before. And so, it isn't working. To be honest I didn't expect the bellow code to work. I just wrote to give you an idea of what I wanted to do and how I wanted to it.
Here's my code:
package
{
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.Sprite;
import flash.events.Event;
/**
* Testing Transparency
* #author Craig Jackson
*/
public class Main extends Sprite
{
public var square:Sprite;
[Embed(source="../lib/TestTransparency.png")]
public var TestTrans:Class;
public var testTransBitmapData:BitmapData = new BitmapData(300, 30, true, 0);
public var testTransBitmap:Bitmap = new TestTrans();
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
startUp();
}
public function startUp():void
{
square = new Sprite();
square.graphics.beginFill(0x666666);
square.graphics.drawRect(0, 0, 50, 50);
square.graphics.endFill();
addChild(square);
testTransBitmapData.draw(testTransBitmap);
addChild(testTransBitmap);
addEventListener(Event.ENTER_FRAME, enterFrame);
}
public function enterFrame(e:Event):void
{
square.x = mouseX;
square.y = mouseY;
if (square.hitTestObject(testTransBitmap))
{
trace("Touching");
}
}
}
Anyone know how I can make the it detect only when the square collides with visible part of the image?
Massive thanks in advance.
Unless you have a personal reason for wanting to implement this yourself, I'd recommend using Corey O'Neil's collision detection kit:
https://code.google.com/p/collisiondetectionkit/
I'm currently working through a AS3 game tutorial on Lynda.com and am coming across a problem with the MouseEvent.CLICK and child indexes. The game is a simple point and shoot, where the player must shoot all of the approaching enemies before they get too close. It works initially, however the custom cursor I added displays behind the enemies. However when I try and adjust the index (I've used the addChildAt function and moving the addChild(cursor) line of code below the enemy container initializer) the on click interaction, which is supposed to remove the enemy when clicked on, doesn't work.
My document class:
package {
import flash.display.*;
import flash.utils.*;
import flash.events.*;
import flash.ui.*;
public class Game extends MovieClip {
public var cursor:Cursor;
public var enemy:Enemy;
public var numberOfEnemies:uint;
public var enemyContainer:MovieClip;
public var enemyTimer:Timer;
public function Game() {
addEventListener(Event.ADDED_TO_STAGE, init);
Mouse.hide();
}
public function init(event:Event):void {
cursor = new Cursor;
addChild(cursor);
stage.addEventListener(MouseEvent.MOUSE_MOVE, dragCursor);
numberOfEnemies = 10;
enemyTimer = new Timer(1000, numberOfEnemies);
enemyContainer = new MovieClip();
addChild(enemyContainer);
enemyTimer.addEventListener(TimerEvent.TIMER, createEnemies);
enemyTimer.start();
}
public function dragCursor(event:MouseEvent) {
cursor.x = this.mouseX;
cursor.y = this.mouseY;
}
public function createEnemies(event:TimerEvent):void {
enemy = new Enemy();
enemy.x = 25 + Math.random() * (stage.stageWidth - 75);
enemy.y = 25 + Math.random() * (stage.stageHeight - 75);
enemyContainer.addChild(enemy);
enemy.timerStart();
}
}
}
My enemy class:
package {
import flash.display.MovieClip;
import flash.utils.Timer;
import flash.ui.Mouse;
import flash.events.*;
public class Enemy extends MovieClip {
public var scaleObj:Number = 0.50;
public var growTimer:Timer;
public function Enemy() {
scaleX = scaleObj;
scaleY = scaleObj;
addEventListener(MouseEvent.CLICK, shootEnemy);
}
public function timerStart() {
growTimer = new Timer(50);
growTimer.addEventListener(TimerEvent.TIMER, objectGrow);
growTimer.start();
}
public function objectGrow(event:TimerEvent):void {
if(scaleObj <= 1.0) {
scaleObj += 0.01;
scaleX = scaleObj;
scaleY = scaleObj;
}
else {
killEnemy();
}
}
public function killEnemy():void {
this.parent.removeChild(this);
growTimer.stop();
}
public function shootEnemy(event:MouseEvent):void {
killEnemy();
}
}
}
There also is a cursor class, however there is no code beyond the package and class definers. Please let me know of any questions or comments you might have, thanks.
Most likely the Cursor object is intercepting the mouse click since it is above the Enemy object.
You can stop the Cursor from intercepting mouse events by setting in the cursor class:
this.mouseEnabled = false;
this.mouseChildren = false;
Also, you should ideally be using a native mouse cursor instead of manually creating your own. Check out this Adobe tutorial for an example.
Set your Cursor instance to not receive mouse events itself as it would block the click events from getting to the objects behind it. Code would be something like
cursor = new Cursor;
cursor.mouseEnabled = false;
cursor.mouseChildren = false;
I'm developing an AS 3.0 wrapper to add some extra stuff that has to load some old and plain frame to frame SwishMax 3 animations and then be able to stop them, play them, and so...
Here is my code:
package {
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.display.Loader;
import flash.display.MovieClip;
import flash.net.URLRequest;
import flash.events.*;
[SWF(backgroundColor="#ffffff", frameRate="17", width="300", height="250")]
public class SwishMaxWrapper extends Sprite {
function SwishMaxWrapper() {
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, completeHandler);
addChild(loader);
var request:URLRequest = new URLRequest("swishy.swf");
loader.load(request);
}
private function completeHandler(event:Event):void {
var movie:MovieClip = event.target.content;
movie.stop();
}
}
}
The animation load works as expected but the movie.stop() doesn't. What is wrong?
I tested your code and it works on my machine. The SWF that I loaded had its animation in the main timeline. Is it possible that the swishy.swf has animation that is not on the main timeline? Perhaps the animation is in another symbol instead, and an instance of that symbol is on the stage. Anyway, when you call stop() in your code above, it's just telling the main timeline to stop, but other movie clips on the stage will keep on going.
I think that's what Simsoft was pointing out.
I tested your code using a SWF that had a symbol on the stage that had animation in it, and I got the problem that you are describing. I fixed it by modifying completeHandler() as follows:
public function completeHandler(event:Event):void {
var movie:MovieClip = event.target.content;
movie.stop(); //doesn't work - main timeline is only one frame long
for(var i:int = 0; i<movie.numChildren; i++) {
var child:MovieClip = movie.getChildAt(i) as MovieClip;
if(child) { //need this test - if the cast to MovieClip fails, child will be null
child.stop(); //works
}
}
}
Hopefully you don't have more animations nested at deeper layers. If that's the case, you'll have to modify this to keep peering into the children of each child and trying to stop their timelines as well.
Anyway, hope that helps. Good luck!
stop() isn't recurive, I think the problem is here.
function ruleThemAll(target : DisplayObjectContainer, doStop : Boolean = true) : void
{
for(var i : uint = 0; i < target.childNum; ++i)
{
var child : DisplayObject = target.getChildAt(i);
// If it's a container, go into to stop children
if(child is DisplayObjectContainer)
ruleThemAll(child as DisplayObjectContainer, doStop);
if(child is MovieClip)
{
if(doStop)
MovieClip(child).stop();
else
MovieClip(child).play();
}
}
}