Java-Gaming.org    
Featured games (79)
games approved by the League of Dukes
Games in Showcase (477)
Games in Android Showcase (107)
games submitted by our members
Games in WIP (534)
games currently in development
News: Read the Java Gaming Resources, or peek at the official Java tutorials
 
    Home     Help   Search   Login   Register   
Pages: [1]
  ignore  |  Print  
  [LibGDX] Anybody can explain U, V, U2 and V2 values?  (Read 1108 times)
0 Members and 1 Guest are viewing this topic.
Offline kutucuk

Senior Member


Medals: 5
Exp: 3 years



« Posted 2014-02-19 07:44:40 »

Here is a draw method we can use in LibGDX:
1  
spriteBatch.draw(texture, x, y, width, height, u, v, u2, v2);


I wanted to make a background draw more than once. I mean, the player will move and background will not, but instead a new image will be drawn when the first one's borders are on the screen.

I could do it with this method. But I am curious, because I couldn't really understand what it does. My background image is a 128x128 one, and it is drawn 4 times on the screen. I can manipulate u, v, u2 and v2 values and make it draw once or twice. But I really don't know which one to manipulate to get the results I want.

I have no particular result I want to get, I just want to know what the values in this constructor do. I especially want to know what u, v, u2 and v2 does. Searched the internet, everybody just gave the OPs numbers instead of an explanation. I need explanations.
Offline Phibedy

Senior Member


Medals: 8



« Reply #1 - Posted 2014-02-19 08:27:06 »

UV are the koordinates of your texture normalised in each component. u-v is top right, u2-v2 is bottom left corner.
Just read that article: https://github.com/mattdesl/lwjgl-basics/wiki/LibGDX-Textures#wiki-wrap-modes

But for accomplishing your task you might wanna use gl_repeat: http://open.gl/textures
Offline Gibbo3771
« Reply #2 - Posted 2014-02-19 08:35:50 »

UV are the koordinates of your texture normalised in each component. u-v is top right, u2-v2 is bottom left corner.
Just read that article: https://github.com/mattdesl/lwjgl-basics/wiki/LibGDX-Textures#wiki-wrap-modes

But for accomplishing your task you might wanna use gl_repeat: http://open.gl/textures

Or you could create a simple if statement and for loop, basically just draw 3 background images, one behind the player out of view, one in view, one ahead.

This seemed to work for me, can't imagine it is expensive to draw considering how many sprites a game actually processes.

"This code works flawlessly first time and exactly how I wanted it"
Said no programmer ever
Games published by our own members! Check 'em out!
Legends of Yore - The Casual Retro Roguelike
Offline kutucuk

Senior Member


Medals: 5
Exp: 3 years



« Reply #3 - Posted 2014-02-19 10:03:22 »

UV are the koordinates of your texture normalised in each component. u-v is top right, u2-v2 is bottom left corner.
Just read that article: https://github.com/mattdesl/lwjgl-basics/wiki/LibGDX-Textures#wiki-wrap-modes

But for accomplishing your task you might wanna use gl_repeat: http://open.gl/textures
Thanks. I am already using GL20.GL_REPEAT. I'm also experimenting with GL_CLAMP_TO_EDGES to see differences.

Thanks to the article link you gave me, I could search with better keywords. I came to conclusion that if I make u and v 0 and u2 and v2 2, it will repeat the image twice vertically and horizontally. So, I am getting 4 images.

But, what do you mean with the word "normalized"?

Or you could create a simple if statement and for loop, basically just draw 3 background images, one behind the player out of view, one in view, one ahead.

This seemed to work for me, can't imagine it is expensive to draw considering how many sprites a game actually processes.
Thanks to Phibedy, I'm able to do what I want, with some problems I can fix with some trial-error. But I'm interested in learning about your method. Can you elaborate?
Offline nerb
« Reply #4 - Posted 2014-02-19 13:14:50 »

But, what do you mean with the word "normalized"?

'Normalised' in this case just means that texture coordinates are represented as a floating point ratio between 0.0 and 1.0, instead of absolute integer values. The good part about this is that you can resize your textures, and not have to mess around re-aligning everything. 0.0 will always point to the start, 0.5 the middle and 1.0 the end of the image (in either the x or y direction). To go from an absolute value to a normalised value, divide the pixel coordinate by the width of the texture, i.e. 32pix / 64width = 0.5norm. Do the opposite to convert a normalised value to an absolute one, i.e. 0.5norm * 64width = 32pix.

As you've discovered, you can use UV coordinates >1.0, and how OpenGL handles this will be defined by the wrapping mode.
Offline kutucuk

Senior Member


Medals: 5
Exp: 3 years



« Reply #5 - Posted 2014-02-19 16:06:23 »

Thanks nerb. Thanks to Phibedy, I discovered the UV coordinates which I kinda ignored and stayed away until now Smiley
So, this should also mean the same with Vector2 normalize method. Good to know.

Here is my other question, you guys know that my initial problem was to repeat the background. I set the background using this method:
1  
spriteBatch.draw(texture, x, y, width, height, u, v, u2, v2);

And of course, setWrap method is used as well.

But when I try to render sprites in the same manner, I cannot do this, because there is not a similar method for this. What should I do to draw the sprites like that background?
Offline Phibedy

Senior Member


Medals: 8



« Reply #6 - Posted 2014-02-19 16:10:12 »

Sprite.class from libgdx?
If yes, you can create a Sprite using a Texturegion.class, texturegion handles UV-Coords.
Offline Gibbo3771
« Reply #7 - Posted 2014-02-19 16:41:55 »

UV are the koordinates of your texture normalised in each component. u-v is top right, u2-v2 is bottom left corner.
Just read that article: https://github.com/mattdesl/lwjgl-basics/wiki/LibGDX-Textures#wiki-wrap-modes

But for accomplishing your task you might wanna use gl_repeat: http://open.gl/textures
Thanks. I am already using GL20.GL_REPEAT. I'm also experimenting with GL_CLAMP_TO_EDGES to see differences.

Thanks to the article link you gave me, I could search with better keywords. I came to conclusion that if I make u and v 0 and u2 and v2 2, it will repeat the image twice vertically and horizontally. So, I am getting 4 images.

But, what do you mean with the word "normalized"?

Or you could create a simple if statement and for loop, basically just draw 3 background images, one behind the player out of view, one in view, one ahead.

This seemed to work for me, can't imagine it is expensive to draw considering how many sprites a game actually processes.
Thanks to Phibedy, I'm able to do what I want, with some problems I can fix with some trial-error. But I'm interested in learning about your method. Can you elaborate?

Basically you have 3 vectors that control the position of each image. So you draw your images in a grid like so

1 2 3
1 2 3
1 2 3

Your character would be in the centre square ( 2), you can use a for loop to draw the images one after the other or just call batch.draw  on 3 lines.

Use an if statement inside the loop right before you draw that decides if the viewport / 2 is > background width / 2, if so you would take the vector belonging to image 1 and add it's width onto it in the multiple of 3.

You then end up with this

2 3 1
2 3 1
2 3 1

then

3 1 2
3 1 2
3 1 2

then

1 2 3
1 2 3
1 2 3

(Think that's right, hard to visualize it lol )

Keep doing so and you will have an infinite movement of having basically the front and back images swapping. Obv if the character turns around you would be subtracting values.

This is how I did it, can't find the code but it worked but it did look a little bit "dirty" lol.

"This code works flawlessly first time and exactly how I wanted it"
Said no programmer ever
Offline kutucuk

Senior Member


Medals: 5
Exp: 3 years



« Reply #8 - Posted 2014-02-20 18:24:49 »

So basically, you just pick the places a player can go (and for the sake of my explaining, put them in an array), and say, if it goes to up, you delete the bottom image coordinates from the array and add a new coordinate which is higher.
If it goes to left, you delete the right one, your middle one becomes right one, your left one becomes middle one (because that's where your player is) and you just create a new left.

I don't know if it's because I heard your solution or it is really the only way, but I it makes sense to me to use this Cheesy

I'll stick to OpenGL wrapping method for now, but for an infinite background, I think I'd have to switch to your method.
Offline Gibbo3771
« Reply #9 - Posted 2014-02-21 06:34:29 »

So basically, you just pick the places a player can go (and for the sake of my explaining, put them in an array), and say, if it goes to up, you delete the bottom image coordinates from the array and add a new coordinate which is higher.
If it goes to left, you delete the right one, your middle one becomes right one, your left one becomes middle one (because that's where your player is) and you just create a new left.

I don't know if it's because I heard your solution or it is really the only way, but I it makes sense to me to use this Cheesy

I'll stick to OpenGL wrapping method for now, but for an infinite background, I think I'd have to switch to your method.

Yah pretty much, works fine until your user f**ks with the resolution Lol, you would need to have preset res that you can support, for android you could just use a fixed viewport.

"This code works flawlessly first time and exactly how I wanted it"
Said no programmer ever
Pages: [1]
  ignore  |  Print  
 
 

 

Add your game by posting it in the WIP section,
or publish it in Showcase.

The first screenshot will be displayed as a thumbnail.

pw (35 views)
2014-07-24 01:59:36

Riven (33 views)
2014-07-23 21:16:32

Riven (21 views)
2014-07-23 21:07:15

Riven (24 views)
2014-07-23 20:56:16

ctomni231 (55 views)
2014-07-18 06:55:21

Zero Volt (47 views)
2014-07-17 23:47:54

danieldean (38 views)
2014-07-17 23:41:23

MustardPeter (43 views)
2014-07-16 23:30:00

Cero (59 views)
2014-07-16 00:42:17

Riven (56 views)
2014-07-14 18:02:53
HotSpot Options
by dleskov
2014-07-08 03:59:08

Java and Game Development Tutorials
by SwordsMiner
2014-06-14 00:58:24

Java and Game Development Tutorials
by SwordsMiner
2014-06-14 00:47:22

How do I start Java Game Development?
by ra4king
2014-05-17 11:13:37

HotSpot Options
by Roquen
2014-05-15 09:59:54

HotSpot Options
by Roquen
2014-05-06 15:03:10

Escape Analysis
by Roquen
2014-04-29 22:16:43

Experimental Toys
by Roquen
2014-04-28 13:24:22
java-gaming.org is not responsible for the content posted by its members, including references to external websites, and other references that may or may not have a relation with our primarily gaming and game production oriented community. inquiries and complaints can be sent via email to the info‑account of the company managing the website of java‑gaming.org
Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines | Managed by Enhanced Four Valid XHTML 1.0! Valid CSS!