Java-Gaming.org Hi !
Featured games (83)
games approved by the League of Dukes
Games in Showcase (539)
Games in Android Showcase (132)
games submitted by our members
Games in WIP (602)
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  
  Texture a Quad  (Read 5135 times)
0 Members and 1 Guest are viewing this topic.
Offline divxdede

Junior Devvie





« Posted 2012-05-14 05:17:49 »

Hi,

I want to texture a quad like it:



In black, the quad that i want to fill with the texture.
In Gray, the texture clamp & size with a repeat factor.

I must set the texture coord for 4 vertices, how can i give in this way the texture scaling and the texture clamp point and the repeat mode ?


Bets regards,
Sébastien.
Offline gouessej
« Reply #1 - Posted 2012-05-14 07:18:16 »

Hi Sébastien

I have a question for you. Have you noticed an important boost when using the repeat factor instead of using more vertices?

In your case, I would use something close to [0.5,0.5] [4.5,0.5][4.5,2.5][0.5,2.5] (not tested).

Offline divxdede

Junior Devvie





« Reply #2 - Posted 2012-05-14 07:31:38 »

Hi Sébastien

I have a question for you. Have you noticed an important boost when using the repeat factor instead of using more vertices?

In your case, I would use something close to [0.5,0.5] [4.5,0.5][4.5,2.5][0.5,2.5] (not tested).

Ok, if i understand it correctly, the 0.5 to 4.5 on the x axis means to draw 4 times the texture on this region starting it at the middle of the texture (0.5f)
This way it give the clamp point (0.5) and the scale (number of repetitions in the region).

I will try it this evening, i understand better how texCoord works (all examples found are always the same with texCoord from 0 to 1)

Thanks for all.

Games published by our own members! Check 'em out!
Legends of Yore - The Casual Retro Roguelike
Online theagentd

« JGO Bitwise Duke »


Medals: 365
Projects: 2
Exp: 8 years



« Reply #3 - Posted 2012-05-14 09:07:21 »

The final texture coordinate with wrapping just becomes (s % 1, y % 1) for each pixel, so 0.5 to 1.5 goes from 0.5 --> 1.0 == 0.0 --> 0.5. It just cuts off everything before the decimal point.

Myomyomyo.
Offline gouessej
« Reply #4 - Posted 2012-05-14 09:38:03 »

(all examples found are always the same with texCoord from 0 to 1)
I have the same problem, I want to use this feature but all examples I found are simplistic in comparison to what I plan to achieve. I fear that a part of the texture won't appear anyway with my suggestion because the repetitions are identical, you can only repeat the same "part" of the texture or use mirroring whereas in your case you don't want to do that, the very first and the very fast parts don't use the same part of the texture than the ones in the middle.

Online theagentd

« JGO Bitwise Duke »


Medals: 365
Projects: 2
Exp: 8 years



« Reply #5 - Posted 2012-05-14 11:19:12 »

(all examples found are always the same with texCoord from 0 to 1)
I have the same problem, I want to use this feature but all examples I found are simplistic in comparison to what I plan to achieve. I fear that a part of the texture won't appear anyway with my suggestion because the repetitions are identical, you can only repeat the same "part" of the texture or use mirroring whereas in your case you don't want to do that, the very first and the very fast parts don't use the same part of the texture than the ones in the middle.
Maybe I'm just misunderstanding but what are you trying to say? Are you asking for help ("have the same problem" ---> STILL have the same problem?) or are you just saying that the examples available on the internet are not very good? =S

Myomyomyo.
Offline divxdede

Junior Devvie





« Reply #6 - Posted 2012-05-14 14:39:23 »

I understand better how things works.

But now, i would texture a quad with a repeat factor but only with a region of a texture

So for the example, Considering that i want to use only the rectangle (0.25,0.25) x (0.75,0.75)  of a texture.
But i want to repeat i 4 times on a quad that have dimension (100,100) and starting at (50,50)

i would do a things like it
 
1  
2  
3  
4  
5  
6  
7  
8  
9  
10  
11  
12  
13  
14  
15  
16  
17  
18  
19  
20  
   // bind texture
   // enable "repeat" mode
   // set QUAD operation
   // begin

   // first vertex
   glTexCoord(0.25,0.25);
   glVertex2f( 50 , 50 );

    // second vertex
    glTexCoord(3.75,0.25);
    glVertex2f( 150 , 50);

    // third vertex
    glTexCoord( 3.75 , 3.75 );
    glVertex2f( 150 , 150);

    // last vertex
    glTexCoord( 0.25 , 3.75 );
    glVertex2f( 50 , 150);


(the vertices order may be wrong, i do it without my dev pc)
So if i understand, it will draw like it

Horizontall i will have
   
1  
 [0.25 ~ 1] + [0 ~ 1 ] + [0 ~ 1 ] + [0 ~ 1 ] + [0 ~ 0.75 ]


Instead of what i want:
   
1  
 [0.25 ~ 0.75] + [0.25 ~ 0.75] + [0.25 ~ 0.75] + [0.25 ~ 0.75]


How can i achieve my goal ?
Thanks in advance.



   
Offline Orangy Tang

JGO Kernel


Medals: 56
Projects: 11


Monkey for a head


« Reply #7 - Posted 2012-05-14 14:59:30 »

How can i achieve my goal ?
Thanks in advance.
You can't, with regular texture coords. You either have to draw it as separate quads, copy the sub-section to a new texture, or write a shader that lets you tile sub regions.

Separate quads is probably most sensible.

[ TriangularPixels.com - Play Growth Spurt, Rescue Squad and Snowman Village ] [ Rebirth - game resource library ]
Offline davedes
« Reply #8 - Posted 2012-05-14 15:59:13 »

Unless you are pushing hundreds of thousands of vertices per frame, just use multiple quads to define each "repeat" of your tile. The performance difference will be negligible and it will allow you to use texture atlases. Use a single glBegin/glEnd to push all of your quads at once. Ideally you should be using vertex arrays instead of immediate mode.

Online theagentd

« JGO Bitwise Duke »


Medals: 365
Projects: 2
Exp: 8 years



« Reply #9 - Posted 2012-05-14 16:09:12 »

A pixel shader with a one-line main method does the trick, but just drawing many quads work. Textures only wrap around their edges, so you can't do this with wrapping. You could just cut out the needed part into it's own texture...

Myomyomyo.
Games published by our own members! Check 'em out!
Legends of Yore - The Casual Retro Roguelike
Offline divxdede

Junior Devvie





« Reply #10 - Posted 2012-05-14 16:32:49 »

The quad is just a case of filling form that should work.
I want to "generalize" it for triangles, shapes (with tesselation), circles (a shape) etc....

i don't know at all what is a pixel shader and how it works...
I will go deeper this evening on this stuff.


Offline divxdede

Junior Devvie





« Reply #11 - Posted 2012-05-14 18:11:23 »

I just read some stuf about Pixel shaders, and it seems to take a big bazzoka for kill an insect..
I must do few tests...
Online theagentd

« JGO Bitwise Duke »


Medals: 365
Projects: 2
Exp: 8 years



« Reply #12 - Posted 2012-05-14 18:18:51 »

It's not much more than writing a vertex and fragment shader and binding it. You don't even need a vertex shader if you use older versions of GLSL.

Myomyomyo.
Offline matheus23

JGO Kernel


Medals: 114
Projects: 3


You think about my Avatar right now!


« Reply #13 - Posted 2012-05-14 18:19:35 »

It's not much more than writing a vertex and fragment shader and binding it. You don't even need a vertex shader if you use older versions of GLSL.

Problem is creating the classes to load Shaders in opengl. thats the most hard part for me.

See my:
    My development Blog:     | Or look at my RPG | Or simply my coding
http://matheusdev.tumblr.comRuins of Revenge  |      On Github
Offline divxdede

Junior Devvie





« Reply #14 - Posted 2012-05-14 18:29:07 »

all of this is new , i need to understand theses new stuff. it will take some times.
Online theagentd

« JGO Bitwise Duke »


Medals: 365
Projects: 2
Exp: 8 years



« Reply #15 - Posted 2012-05-14 18:57:29 »

It's not much more than writing a vertex and fragment shader and binding it. You don't even need a vertex shader if you use older versions of GLSL.

Problem is creating the classes to load Shaders in opengl. thats the most hard part for me.
ShaderProgram + Shader = 120 lines of code for me, with like 30-40% blank lines, and 50% of the Shader class is loading a text file from disc. All in all it's only like 10 encapsulated OpenGL functions. Well, shaders aren't the easiest part of OpenGL at least, I'll give you that. =S

Myomyomyo.
Offline matheus23

JGO Kernel


Medals: 114
Projects: 3


You think about my Avatar right now!


« Reply #16 - Posted 2012-05-14 19:03:01 »

It's not much more than writing a vertex and fragment shader and binding it. You don't even need a vertex shader if you use older versions of GLSL.

Problem is creating the classes to load Shaders in opengl. thats the most hard part for me.
ShaderProgram + Shader = 120 lines of code for me, with like 30-40% blank lines, and 50% of the Shader class is loading a text file from disc. All in all it's only like 10 encapsulated OpenGL functions. Well, shaders aren't the easiest part of OpenGL at least, I'll give you that. =S

Wow.. thank you for that point Cheesy

See my:
    My development Blog:     | Or look at my RPG | Or simply my coding
http://matheusdev.tumblr.comRuins of Revenge  |      On Github
Offline sproingie

JGO Kernel


Medals: 202



« Reply #17 - Posted 2012-05-14 19:11:42 »

Problem is creating the classes to load Shaders in opengl. thats the most hard part for me.

You only need to do it once, then you have a library. Here's a minimal example, feel free to adapt from this: https://bitbucket.org/chuck/lwjgl-sandbox/src/tip/src/main/java/sandbox/util/ShaderProgram.java

Sadly it's incomplete, stuff like binding attributes isn't in there, you'll have to take that on yourself or find a better library.

Offline divxdede

Junior Devvie





« Reply #18 - Posted 2012-05-14 20:37:55 »

At the first, i decide to wrote the coord mapping in java before to try to do it in a pixel shader.

It give this try :

1  
2  
3  
4  
5  
6  
7  
8  
9  
10  
11  
12  
13  
14  
15  
16  
17  
18  
19  
20  
21  
22  
23  
24  
25  
26  
27  
28  
29  
30  
31  
32  
33  
34  
35  
36  
37  
38  
39  
40  
public static class TextureCoordInterpolator {
     
      /**
       * Coordinate of the sub-texture inside the whole texture
       */

      private int       x,y;
     
      /** Dimension of the sub-texture
       */

      private int       width,height;
     
      /** Dimension of the whole-texture
       */

      private int       textureWidth,textureHeight;
     
      /* The anchor region.
       * This region define an area where drawing the Sub-Texture exactely and completely 1 time from (0,0) to (1,1) in sub-texture space-coordinate
       */

      private Rectangle anchor;
     
      public void getTextureCoord( float pX , float pY ) {
         /** Sub-Texture coords
          */

         float sx = ( pX - anchor.getX()  ) / ( anchor.getWidth() );
         float sy = ( pY - anchor.getY()  ) / ( anchor.getHeight() );
         System.out.println("getTextureCoord(" + pX + "," + pY + ") == subTextureCoord(" + sx + "," + sy + ")");
         
         /** Normalized Sub-Texture coord in [ 0 ~ 1 ]
          */

         float rx = sx - (int)sx;   // just the rest ==> don't see difference between 0f and 1f
         float ry = sy - (int)sy;   // just the rest ==> don't see difference between 0f and 1f
         System.out.println("getTextureCoord(" + pX + "," + pY + ") == normalSubTextureCoord(" + rx + "," + ry + ")");
         
         /** Global Texture coord
          */

         float gx = ( x + (rx * width) ) / textureWidth;
         float gy = ( y + (ry * height) ) / textureHeight;
         System.out.println("getTextureCoord(" + pX + "," + pY + ") == globalTextureCoord(" + gx + "," + gy + ")");
         
      }


It globbaly works, except that i don't see any difference between the 0f and the 1f texCoord.
I'm not sure how can i handle it properly !! any idea ?

my main was:
1  
2  
3  
4  
5  
6  
7  
8  
9  
10  
11  
12  
13  
14  
   public static void main(String[] args) {
      TextureCoordInterpolator test = new TextureCoordInterpolator();
      test.x = 50;
      test.y = 50;
      test.width = 100;
      test.height = 100;
      test.textureWidth  = 200;
      test.textureHeight = 200;
      test.anchor = new Rectangle( 5 , 5 , 20 , 20 );
      test.getTextureCoord(5,5);
      test.getTextureCoord(24,24);
      test.getTextureCoord(25,24);
      test.getTextureCoord(26,24);
   }

Offline divxdede

Junior Devvie





« Reply #19 - Posted 2012-05-14 21:14:19 »

With this version, i handle correctly the 0.0f and 1.0f texCoord

1  
2  
3  
4  
5  
6  
7  
8  
9  
10  
11  
12  
13  
14  
15  
16  
17  
18  
19  
20  
21  
22  
23  
24  
25  
26  
27  
28  
29  
30  
31  
32  
33  
34  
35  
36  
37  
38  
39  
40  
41  
42  
43  
44  
45  
46  
47  
48  
49  
50  
51  
52  
53  
54  
public static class TextureCoordInterpolator {
         
         /**
          * Coordinate of the sub-texture inside the whole texture
          */

         private int       x,y;
         
         /** Dimension of the sub-texture
          */

         private int       width,height;
         
         /** Dimension of the whole-texture
          */

         private int       textureWidth,textureHeight;
         
         /* The anchor region.
          * This region define an area where drawing the Sub-Texture exactely and completely 1 time from (0,0) to (1,1) in sub-texture space-coordinate
          */

         private Rectangle anchor;
         
         public void getTextureCoord( float pX , float pY ) {
            /** Sub-Texture coords
             *  ==================
           *  ( ( pX - anchorX ) % anchorWidth ) / ( anchorWidth - 1 )

           *  With :
           *  ====
           *  x   [ 05      06      07      08    ] [ 09      10      11      12    ]
           *  rx  [ 0.00f   0.33f   0.66f   1.00f ] [ 0.00f   0.33f   0.66f   1.00f ]
           *  
           *  anchorX     = 05
           *  anchorWidth = 4
           *  
           *  case 05 >>>  ( ( 05 - 5 ) % 4 ) / 3 == 0.00f
           *  case 06 >>>  ( ( 06 - 5 ) % 4 ) / 3 == 0.33f
           *  case 07 >>>  ( ( 07 - 5 ) % 4 ) / 3 == 0.66f
           *  case 08 >>>  ( ( 08 - 5 ) % 4 ) / 3 == 1.00f
           *  
           *  case 09 >>>  ( ( 09 - 5 ) % 4 ) / 3 == 0.00f
           *  case 10 >>>  ( ( 10 - 5 ) % 4 ) / 3 == 0.33f
           *  case 11 >>>  ( ( 11 - 5 ) % 4 ) / 3 == 0.66f
           *  case 12 >>>  ( ( 12 - 5 ) % 4 ) / 3 == 1.00f
           */

            float rx = ( ( pX - anchor.getX()  ) % anchor.getWidth() ) / ( anchor.getWidth() - 1 );
            float ry = ( ( pY - anchor.getY()  ) % anchor.getHeight() ) / ( anchor.getHeight() - 1 );
            System.out.println("getTextureCoord(" + pX + "," + pY + ") == subTextureCoord(" + rx + "," + ry + ")");
           
            /** Global Texture coord
             */

            float gx = ( x + (rx * width) ) / textureWidth;
            float gy = ( y + (ry * height) ) / textureHeight;
            System.out.println("getTextureCoord(" + pX + "," + pY + ") == globalTextureCoord(" + gx + "," + gy + ")");
         }
      }
Offline davedes
« Reply #20 - Posted 2012-05-14 21:39:14 »

Here is another WIP "ShaderProgram" type utility that you can feel free to use/adapt (using GL20). Also includes a geometry shader class (old-style, using EXT and GL_GEOMETRY_VERTICES_OUT).

https://github.com/mattdesl/slim/tree/master/slim/src/slim/shader

Offline divxdede

Junior Devvie





« Reply #21 - Posted 2012-05-14 22:09:41 »

Here is another WIP "ShaderProgram" type utility that you can feel free to use/adapt (using GL20). Also includes a geometry shader class (old-style, using EXT and GL_GEOMETRY_VERTICES_OUT).

https://github.com/mattdesl/slim/tree/master/slim/src/slim/shader

Thanks, i will study it tomorrow, it is too late for today Tongue
I just need to learn how write my above code in GLSL... nothing is quite simple this day...
Pages: [1]
  ignore  |  Print  
 
 
You cannot reply to this message, because it is very, very old.

 

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

The first screenshot will be displayed as a thumbnail.

rwatson462 (30 views)
2014-12-15 09:26:44

Mr.CodeIt (20 views)
2014-12-14 19:50:38

BurntPizza (42 views)
2014-12-09 22:41:13

BurntPizza (76 views)
2014-12-08 04:46:31

JscottyBieshaar (37 views)
2014-12-05 12:39:02

SHC (51 views)
2014-12-03 16:27:13

CopyableCougar4 (48 views)
2014-11-29 21:32:03

toopeicgaming1999 (115 views)
2014-11-26 15:22:04

toopeicgaming1999 (103 views)
2014-11-26 15:20:36

toopeicgaming1999 (31 views)
2014-11-26 15:20:08
Resources for WIP games
by kpars
2014-12-18 10:26:14

Understanding relations between setOrigin, setScale and setPosition in libGdx
by mbabuskov
2014-10-09 22:35:00

Definite guide to supporting multiple device resolutions on Android (2014)
by mbabuskov
2014-10-02 22:36:02

List of Learning Resources
by Longor1996
2014-08-16 10:40:00

List of Learning Resources
by SilverTiger
2014-08-05 19:33:27

Resources for WIP games
by CogWheelz
2014-08-01 16:20:17

Resources for WIP games
by CogWheelz
2014-08-01 16:19:50

List of Learning Resources
by SilverTiger
2014-07-31 16:29:50
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!