Displaying long string in pygame - pygame

If I want to display long string using pygame normally the part of string will go outside pygame screen depending on font size, so is it possible to show long string by scrolling in pygame like we see in news channel moving text on bottom of TV screen?

Yes, it is possible. Here is a draft on how it should work.
Create a class that will hold a surface where you will draw your text.
This class should also contain the current sprites as well as a list of text to be written.
Now you create these methods:
Init method
should put the first text int the current_sprite list.
Draw method
draws all sprites in the current sprite list.
An update method that does this:
For each current sprite:
moveUp
checkIf out of bounds -> if true remove from current sprites
checkIf the first sprite has crossed the y offset,
so you can spawn a new sprite at the bottom.
When you spawn a new one, you should increment the counter responsible for
remembering which text to create next.

Related

Arrange the sprites and text on the screen with Libgdx

I'm in the process of building my splash screen and I'm having some doubts related to align the elements and fit them right. How can make my sprites, text and other elements to occupy the right place and make them align on the screen, if you know what I mean. Should I use Table for that? How can I do that and how can I use the Table for this operation?
I changed my code: now may Player class extends the Actor class.
But I'm getting some troubles because I added the player into the table but the player image appears almost in the middle of the screen. It wasn't happening before I have inserted the method align the table to the center, but I removed this method and the player still keeps with that position on the screen
A part from the SplashScreen in the show() method:
// Create the SpriteBatch
this.game.spriteBatch = new SpriteBatch();
// Create the stage
this.game.stage = new Stage(this.game.viewPort);
// Create the table
this.table = new Table();
this.table.setFillParent(true);
this.game.stage.addActor(this.table);
// Insert the elements into the table
this.table.row();
this.table.add(this.game.player);
Now from the render() method from the SplashScreen:
// Set the projection matrix for the SpriteBatch
this.game.spriteBatch.setProjectionMatrix(this.game.orthoCamera.combined);
// SpriteBatch begins
this.game.spriteBatch.begin();
// Display the ClimbUp logo
this.gameTitle.draw(this.game.spriteBatch);
this.table.draw(this.game.spriteBatch, 1);
this.game.player.draw(this.game.spriteBatch, 1);
// SpriteBatch ends
this.game.spriteBatch.end();
Yes, when it comes to alignment in LibGdx Table is the way to go. Using Table's is very easy.
There first thing you need to have is a Skin instance which takes a TextureAtlas parameter, then you can instantiate the Table.
Table someTable = new Table(); //Takes a Skin object as a parameter.
someTable.add(); // Element as parameter.
someTable.row(); // Add a row if you need it.
someTable.add(); //Element as parameter.
someTable.debug(); // Don't forget to call debug();
When you have the Table object instantiated and ready to go just add it to a Stage object and let it do the drawing and other stuff.
someStage.addActor(someTable);
But before doing any of this you should probably take a look here.

flash actionscript 3.0 hide part of an image

I am working on a flash sound mixer application with multiple sound channels, and I am having trouble with the lights beside the volume knob.
Is there a way to hide just a part of an image?
On the image below, image-2 is on top of image-1 to create some kind of volume level indicator effect, and how much of image-2 is shown depends on the value of the volume.
image-url: http://s30.postimg.org/r3ow1g5bl/volume_lights_level.png
I've tried by just reducing the height of image-2, but it looks awful and distorted.
Is there something in flash that works closely the same as CSS's behavior.
example: I'll just make image-2 a background of a shape, and when I reduce the shape's height, the image-background does not get distorted or changes it's height as well.
By searching for solutions, I have come across the mask property, but I don't quite understand how it works, and most of the examples shown are images placed inside circles.
Is the mask property applicable in this situation?
I'm quite new to flash so I don't know a lot of things yet.
You can indeed use a mask.
How to programmatically create your mask
Put an occurrence of your image named myImage on the stage, and put over this occurrence a mask named myMask with the same dimensions. You can apply myMask mask to myImage using it's mask property like below:
Main Timeline
myImage.mask = myMask;
function mouseMoveHandler(e:MouseEvent):void {
myMask.height = myImage.y - e.stageY;
}
stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
You have just to adapt this code to your animation, in the function where you click your button.
I got it working now, many THANKS #VC.One. heres how I did it.
Imported img-2 to stage, converted it into symbol(type:Movie Clip), assigned instance name: img2_mc.
I created a new layer for the mask, drawn a rectangle using rectangle tool, converted it also to symbol(type:Movie Clip), assigned instance name: mask_mc.
Then applied the mask to img2_mc.
/* the code */
img2_mc.mask = mask_mc;
function onEnterFrame(event:Event):void{
var volumeKnob_y = volSliderKnobOn.y + 12; // adjust it to the center of the knob
mask_mc.height = volumeKnob_y;
}

Cocos2dx sublayers

I am developing a 2D games with cocos2dx, in which I am still very new... inside the game, there's a number of UI Elements that I'd like to group together as one (I intend to group them into CCLayers). For example a few text labels and sprites form a CStatBar which is a CCLayer. This CStatBar will then be included in the various other CCLayer
How do I do that? I created the CStatBar class and then, inside the containing class's init() function, I CStatBar::create() and call this->addChild(pStatBar) however, the statbar did not appear... is there any obvious thing that I missed? All the positions are correct. Thanks!
EDIT:
Notes:
1. ccTouchesBegan of the sublayer is called, however it is not rendered/seen
2. How do I resize the sublayer so that it only cover partial area of the parent layer? Supposedly the CStatBar should only cover 10% of the top area of the screen, not the whole screen...
inside the CParent::init() function, you can initialize the CSublayer like so:
// Create and initialize CSublayer
CSublayer* pSublayer= CSublayer::create();
float fWidth = pSublayer->getContentSize().width;
float fHeight = pSublayer->getContentSize().height;
pSublayer->setPosition(ccp(fWidth/2.0f, fHeight/2.0f));
this->addChild( pSublayer );
and your CSublayer can be defined like other CCLayer.
If you want to restrict the CSublayer to be smaller than the CParent layer, you can do so inside its init function like so:
CSublayer::init() {
// initialize the size with the size of the background sprite
CCSprite *pSpriteBackground = CCSprite::createWithSpriteFrame(
CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("background.png")
);
this->setContentSize(CCSize(pSpriteBackground->getContentSize().width, pSpriteBackground->getContentSize().height));
pSpriteBackground->setPosition(ccp(fScreenHalfWidth, fScreenHeight-(pSpriteBackground->getContentSize().height/2.0f)));
this->addChild(pSpriteBackground);
}

Flash: AS3 – Bring symbol to front on rollover within movie

I have created a map of Europe in Flash using AS3. I am an absolute beginner. Each country has been converted into a movie (using lasso tool). These movies are on one layer (with slight outline visible) on main timeline. On the other main timeline layer is the original outline map of Europe.
I have managed to make it so when a country is rolled over, a box tweens in scale to full size (to later insert text in).
I need to make it so that when each country is rolled over, that country's text box (which appears on Roll_Over) comes 'to the front'.
At the moment a couple of countries' text boxes work perfectly (ie: filled with white and completely visible), but most are either buried beneath the main map, or threading randomly through the faint movie clip outlines (which are at the front).
I'm guessing that this has to do with the display list. The countries that work perfectly are probably at the top. But how do I make it so that the country rolled over immediately goes to the top and returns on Roll_Out?
This would complete my map so any help would be VERY MUCH appreciated.
I have used following code:
//FRAME ONE
this.stop();
movieClip_6.addEventListener(MouseEvent.ROLL_OVER, fl_MouseOverHandler_15);
function fl_MouseOverHandler_15(event:MouseEvent):void
{
gotoAndPlay(2);
}
movieClip_6.addEventListener(MouseEvent.ROLL_OUT, fl_MouseOutHandler_67);
function fl_MouseOutHandler_67(event:MouseEvent):void
{
gotoAndStop(1);
}
//SECTION BELOW IS MY PROBLEM
movieclip_6.addEventListener(MouseEvent.ROLL_OVER,Rollover,false,0,true);
function Rollover(event:MouseEvent): void
{
setChildIndex(MovieClip(e.target),this.numChildren-1);
}
Many thanks in advance.
You can try calling addChild() again to the DisplayObject/Movieclip to bring it to the front. Instead of:
setChildIndex(MovieClip(e.target),this.numChildren-1);
Try going:
addChild(MovieClip(e.target));
You can use "layers" to bring objects in front of another.
constructor:
//Create the front layer
var frontLayer:Sprite = new Sprite();
//put all text boxes into front layer
frontLayer.addChild(textbox1); //etc...
//Add layer to mc
addChild(frontLayer);
rollover pops up:
textbox1.visible = true;
pop down:
textbox1.visible = false;

Flash drawing line overlapping check

I have an application where user have to draw a line on the canvas without overlapping it. Is there a way to test the overlapping? I have googled already but found result with circles and rectangle overlapping. My case is different. Here user will draw lines on canvas without overlap the line itself. May be I am missing something so any guidance is appreciated. Thanks
I take it you mean the user draws a line with some sort of pen tool, using the mouse.
Here's what I would do:
First, hold the path of the line drawn in a BitmapData object.
var lineBitmapData:BitmapData = new BitmapData(display.width,display.height,true,0x00000000);
This creates a transparent bitmap object with the user's line on it.
On each frame (or timer event, if you use timer) do the following:
1.capture the current mouse position and put it into a Point object.
var currentMousePosition:Point = new Point(mouse.x,mouse.y);
you will also need a point representing the upper-left corner of your bitmapData.
var pt1:Point = new Point(1,1);
2.perform collision detection between the current mouse position and the lineBitmapData
var result:Boolean = lineBitmapData.hitTest(pt1, 0xFF, currentMousePosition);
the second parameter in the hitTest method is the threshhold value. Basically, this needs to be set to the minimum alpha value that you want to count as a hit.
3.check the result of the hitTest. If it's false, this means what the user is about to draw this frame does not intersect what was already drawn. In this case, you add the bit that was drawn during the last frame to the lineBitmapData.
If the hitTest returns true, however, that means the user is about to make his line intersect, so your program needs to stop the drawing (or whatever behavior you want).
if(result){
myPenTool.stopDrawing();}else{
var drawnLastFrame:BitmapData = myPenTool.drawSingleFrameLine();
lineBitmapData.draw(drawnLastFrame);}
4.Update what the user sees on the screen with the new lineBitmapData