I have a sprite that acts as a wall in a game that I am building. I would like to have the brick texture repeat itself instead of stretch to fit the height of the screen. I tried:
Texture lSideTexture = new Texture(Gdx.files.internal("wall.png"));
lSideTexture.setWrap(Texture.TextureWrap.Repeat, Texture.TextureWrap.Repeat);
lSideSprite = new Sprite(lSideTexture);
lSideSprite.setPosition(-50, -100 * (height/width) / 2);
lSideSprite.setSize(5,100 * (height/width));
But I am still getting a texture that has been stretched to fit the dimensions rather than repeated.
Any Ideas?
You also have to change the texture region of the Sprite to be bigger than the texture. So if you are drawing the sprite 5 times bigger than normal, you'd do this:
lsideSprite.setRegion(0, 0, 5f, 5f);
One "gotcha" here is that this method is overloaded to take all ints or all floats. If you use ints, then you specify the size in pixel dimensions. If you use floats, then you're specifying how many times you want it to repeat.
Related
I made an interface for a game, using extended viewport and when i resize the screen the aspect ratio changes and every element in scene is scales, but when this happens this is what i get :
This is the most annoying issue i dealt with, any advice ? I tried making the tower n times bigger and then just setting bigger world size for the viewport but same thing happens, idk what is this extra pixels on images..
I'm loading image from atlas
new TextureRegion(skin.getAtlas().findRegion("tower0"));
the atlas looks like this:
skin.png
size: 1024,1024
format: RGBA8888
filter: Nearest,Nearest
repeat: none
tower0
rotate: false
xy: 657, 855
size: 43, 45
orig: 43, 45
offset: 0, 0
index: -1
In the third picture, you are drawing your source image just slightly bigger than it's actual size in screen pixels. So there are some boundaries where extra pixels have to be filled in to make it fill its full on-screen size. Here are some ways to fix this.
Use linear filtering. For the best appearance, use MipMapLinearLinear for the min filter. This is a quick and dirty fix. The results might look slightly blurry.
Draw your game to a FrameBuffer that is sized to the same aspect ratio as you screen, but shrunk down to a size where your sprites will be drawn pixel perfect to their original scale. Then draw that FrameBuffer to the screen using an upsampling shader. There are some good ones you can find by searching for pixel upscale shaders.
The best looking option is to write a custom Viewport class that sizes your world width and height such that you will be always be drawing the sprites pixel perfect or at a whole number multiple. The downside here is that your world size will be inconsistent across devices. Some devices will see more of the scene at once. I've used this method in a game where the player is always traveling in the same direction, so I position the camera to show the same amount of space in front of the character regardless of world size, which keeps it fair.
Edit:
I looked up my code where I did option 3. As a shortcut, rather than writing a custom Viewport class, I used a StretchViewport, and simply changed its world width and height right before updating it in the game's resize() method. Like this:
int pixelScale = Math.min(
height / MIN_WORLD_HEIGHT,
width / MIN_WORLD_WIDTH);
int worldWidth = width / pixelScale;
int worldHeight = height / pixelScale;
stretchViewport.setWorldWidth(worldWidth);
stretchViewport.setWorldHeight(worldHeight);
stretchViewport.update(width, height, true);
Now you may still have rounding artifacts if your pixel scale becomes something that isn't cleanly divisible for both the screen width and height. You might want to do a bit more in your calculations, like round pixelScale off to the nearest common integer factor between screen width and height. The tricky part is picking a value that won't result in a huge variation in amounts of "zoom" between different phone dimensions, but you can quickly test this by experimenting with resizing a desktop window.
In my case, I merged options 2 and 3. I rounded worldWidth and worldHeight up to the nearest even number and used that size for my FrameBuffer. Then I draw the FrameBuffer to the screen at just the right size to crop off any extra from the rounding. This eliminates the possibility of variations in common factors. Quite a bit more complicated, though. Maybe someday I'll clean up that code and publish it.
I have my stage aligned to TOP_LEFT and scaled to StageScaleMode.NO_BORDER, the width and height of my SWF are : width = 1920 and height = 1080.
The thing is when my i change the SWF size to bigger (height/width) the movieClips on the stage scale up and that's a good thing for me, but when i reduce the size of my SWF to smaller values (smaller than the default size), the movieClips get reduced as well, aren't they supposed to stay the same, if not is there a way to make that happen ?
In fact the NO_BORDER scaleMode makes sure to not show the borders of the SWF and scale the center depending on the :
The ratios :
widthRatio = currentStageWidth/stageWidth
and
heightRatio = currentStageHeight/stageHeight.
The stageWidth and stageHeight are provided by AS3.
The currentStageWidth and currentStageHeight are supposed to be changing while resizing the browser window, the can be retrieved from the Flash Object (ie: $("#flashObjectId").width()).
Then we should compare the two ratios (widthRatio and heightRatio), the bigger one has the scale value for the stage and the other elements on the stage.
I am drawing a line using Shape Renderer in LibGDX and i am using Orthographic Camera in my code, so to increase the width i used
camera = new OrthographicCamera();
int lineWidth = 8; // pixels
Gdx.gl10.glLineWidth(lineWidth / camera.zoom);
Now, I get a wider line. But the problem arises when the screen power goes off and then turns on, the line becomes the normal one again. How to keep the width constant?
ShapeRenderer has the method rectLine that is intended to be used to draw thick lines. It draws a rotated filled rectangle with the smaller opposite sides centered on the points passed to it (as coordinates or as Vector2 objects). The method has the parameter width to set the line width.
You can see the documentation here
Example:
shapeRenderer.rectLine(new Vector2(x1,y1),new Vector2(x2,y2),lineWidth);
As you can see here:
libgdx Shaperenderer line .. How to draw line with a specific width
And here:
Libgdx gl10.glLineWidth()
And here:
Why Libgdx Gdx.gl10.glLineWidth(width); does not react to change projection properities
Playing with the line width in the shaperenderer isn't the best way to do what you want to achieve.
Try using a 1x1 white TextureRegion (you can change the color the Batch draws it with later), and draw it with the width and height that you desire:
batch.draw(region, x, y, width, height);
I'm having a sprite (canvas) which is being scaled. The canvas has a mask. The problem is that simple scaling (scaleX=newScale; scaleY=newScale;) takes the part of canvas under mask beyound the mask. So I need to move canvas after scaling in such a way that point of canvas under mask remain in the same place. I'm trying to do something like the following:
var deltaScale = newScale / scale;
//w and h are width and height of mask
canvas.scaleX = newScale;
canvas.scaleY = newScale;
canvas.x += (canvas.x + w/2) - (canvas.x + w/2) / deltaScale;
canvas.y += (canvas.y + h/2) - (canvas.y + h/2) / deltaScale;
still after that central point do not remain on the same place. Can somebody prompt me how should I move canvas after scaling?
PS: width and height of canvas is extremely big (some of 25000) if that helps.
UPD: Canvas with it's mask are added on Sprite, mask is having the same sizes as that parent sprite, canvas.x and canvas.y are negative.
The way I did something similar before was to put the canvas sprite inside another sprite eg. zoom which has its reg point in the centre of the screen (or where ever needed). You can then move canvas around inside the zoom sprite (in my case it was draggable) and scale the outer sprite so the centre is zoomed into.
Scaling and positioning different sprites I found much easier than doing an offset.
I have a mask i'm using for a continuous scroll type thingy, and notice that when my masked sprite gets past a certain pixel size in height (2878) the mask does not mask. Has anyone experienced this? is this a bug?
to reproduce:
create a sprite over 2878 px in height and apply mask, mask breaks
create a sprite 2877 px in height and apply mask, mask works
I can't verify if that is a hard limit, but there are a bunch of similar size limits for bitmaps in Flash that crop up in various areas. One potential solution would be to use the scrollRect property of your content display object. When you set scrollRect you are essentially creating a rectangular mask and I'm almost positive I've done it with 5000+ pixel wide sprites in the past.