Repeating Texture on Model/Mesh - java

When I just draw texture on SpriteBatch and set TextureWrap.Repeat everything is OK. But now I have 3D scene and I want have ground and texture must be repeated on model/mesh and this just don' t work.
public static StillModel createPlainMesh(float xs, float zs, Texture texture) {
final Mesh mesh = new Mesh(true, 4, 6, new VertexAttribute(
Usage.Position, 3, "a_position"), new VertexAttribute(
Usage.TextureCoordinates, 2, "a_texCoords"));
mesh.setVertices(new float[]
{ xs, 0f, zs, 0, 0,
xs, 0f, -zs, 0, 1,
-xs, 0f, zs, 1, 0,
-xs, 0f, -zs , 1,1
});
mesh.setIndices(new short[] { 0, 1, 2, 1, 2, 3 });
final StillModel model = new StillModel(new StillSubMesh(
"ground", mesh, GL10.GL_TRIANGLES, new Material()));
texture.setWrap(TextureWrap.Repeat, TextureWrap.Repeat);
model.setMaterial(new Material("material", new TextureAttribute(texture, 0, "s_tex")));
return model;
}
I have this code. I use setWrap(TextureWrap.Repeat, TextureWrap.Repeat), but textures are still streched. I don't know why, but it looks terrible.

I solved it. If you want repeat texture on model, You must modify this:
mesh.setVertices(new float[]
{ xs, 0f, zs, 0, 0,
xs, 0f, -zs, 0, 1,
-xs, 0f, zs, 1, 0,
-xs, 0f, -zs , 1,1
});
Modify Texture Coords - change to for example 20 if You want repeat it 20times
Example:
mesh.setVertices(new float[]
{ xs, 0f, zs, 0, 0,
xs, 0f, -zs, 0, 20,
-xs, 0f, zs, 20, 0,
-xs, 0f, -zs , 20,20
});

Related

How to get face coordinates?

On the topic of creating custom 3D models, I found this answer. It remains incomprehensible to me how the coordinates of the texture and points mix.
Here's question.
If this is some kind of global concept, and not a feature of building 3D in Java, then I will be glad to mention any literature where these things are well covered. For convenience, I give an example of a code where getting the coordinates of the faces is covered with darkness for me. Thank!
float[] points =
{
50, 0, 0, // v0 (iv0 = 0)
45, 10, 0, // v1 (iv1 = 1)
55, 10, 0 // v2 (iv2 = 2)
};
float[] texCoords =
{
0.5f, 0.5f, // t0 (it0 = 0)
0.0f, 1.0f, // t1 (it1 = 1)
1.0f, 1.0f // t2 (it2 = 2)
};
int[] faces =
{
0, 0, 2, 2, 1, 1, // iv0, it0, iv2, it2, iv1, it1 (front face)
0, 0, 1, 1, 2, 2 // iv0, it0, iv1, it1, iv2, it2 back face
};
Found the literature with the answers. If anyone is interested, here is the link.a link

javafx shape3d texturing: Don't strectch the image

I'm working now with javafx to build a maze and I want the walls to be textured with some seamless texture (that can be repeated). The maze is randomly generated so I don't know the size of any walls. I started by using a PhongMaterial with the desired texture, but it expand the image to fill the whole wall (a Box), so my texture is totally stretched. Is there any way to force the Material to replicate the texture as needed ?
The code is like:
Image img = new Image(new FileInputStream("img.jpg"), 400, 400, true, false);
Material mat = new PhongMaterial(Color.WHITE, img, null, null, null);
Box w = new Box(100,10,10);
w.setMaterial(mat);
Something like an ImagePattern seems a good idea, but there is no Material that accept it.
Thanks in advance for any help
As #fabian mentioned, Box is not suitable for customizing the texture. By default the image you set as diffuse map will be applied for each of its six faces, and, as you already discovered, this means that it will stretch the image to accommodate the different sides.
Using the FXyz library, we can easily try the Carbon-Kevlar pattern. But obviously we have to select a size for it. Like 100 x 30.
#Override
public void start(Stage primaryStage) {
Box box = new Box(100, 30, 50);
PhongMaterial material = new PhongMaterial();
Patterns pattern = new Patterns(100, 30);
material.setDiffuseMap(pattern.createPattern(Patterns.CarbonPatterns.CARBON_KEVLAR, false));
box.setMaterial(material);
Scene scene = new Scene(new Group(box), 500, 400, true, SceneAntialiasing.BALANCED);
primaryStage.setScene(scene);
primaryStage.show();
}
While the texture fits perfectly fine the front face with dimensions 100x30, this image is distorted to fit in the same way the other faces 50x50 and 100x50.
Solution 1
We can try to generate our own Box, so we can decide how to apply the diffuse map.
Creating a TriangleMesh for a cuboid is easy in terms of vertices and faces or normals.
The tricky part is setting the texture coordinates. In the following snippet I set them based on one of the different possible 2D net images of the 3D cuboid:
public MeshView createCuboid(float w, float h, float d) {
float hw = w / 2f;
float hh = h / 2f;
float hd = d / 2f;
float points[] = {
hw, hh, hd,
hw, hh, -hd,
hw, -hh, hd,
hw, -hh, -hd,
-hw, hh, hd,
-hw, hh, -hd,
-hw, -hh, hd,
-hw, -hh, -hd};
float L = 2 * w + 2 * d;
float H = h + 2 * d;
float tex[] = {
d / L, 0f,
(d + w) / L, 0f,
0f, d / H,
d / L, d / H,
(d + w) / L, d / H,
(2 * d + w) / L, d / H,
1f, d / H,
0f, (d + h) / H,
d / L, (d + h) / H,
(d + w) / L, (d + h) / H,
(2 *d + w) / L, (d + h) / H,
1f, (d + h) / H,
d / L, 1f,
(d + w) / L, 1f};
float normals[] = {
1f, 0f, 0f,
-1f, 0f, 0f,
0f, 1f, 0f,
0f, -1f, 0f,
0f, 0f, 1f,
0f, 0f, -1f,
};
int faces[] = {
0, 0, 10, 2, 0, 5, 1, 0, 9,
2, 0, 5, 3, 0, 4, 1, 0, 9,
4, 1, 7, 5, 1, 8, 6, 1, 2,
6, 1, 2, 5, 1, 8, 7, 1, 3,
0, 2, 13, 1, 2, 9, 4, 2, 12,
4, 2, 12, 1, 2, 9, 5, 2, 8,
2, 3, 1, 6, 3, 0, 3, 3, 4,
3, 3, 4, 6, 3, 0, 7, 3, 3,
0, 4, 10, 4, 4, 11, 2, 4, 5,
2, 4, 5, 4, 4, 11, 6, 4, 6,
1, 5, 9, 3, 5, 4, 5, 5, 8,
5, 5, 8, 3, 5, 4, 7, 5, 3};
TriangleMesh mesh = new TriangleMesh();
mesh.setVertexFormat(VertexFormat.POINT_NORMAL_TEXCOORD);
mesh.getPoints().addAll(points);
mesh.getTexCoords().addAll(tex);
mesh.getNormals().addAll(normals);
mesh.getFaces().addAll(faces);
return new MeshView(mesh);
}
Now we can generate the image, but using the net dimensions:
#Override
public void start(Stage primaryStage) {
MeshView box = createCuboid(100, 30, 50);
PhongMaterial material = new PhongMaterial();
Patterns pattern = new Patterns(300, 160);
material.setDiffuseMap(pattern.createPattern(Patterns.CarbonPatterns.CARBON_KEVLAR, false));
box.setMaterial(material);
box.getTransforms().addAll(rotateX, rotateY);
Scene scene = new Scene(new Group(box), 500, 400, true, SceneAntialiasing.BALANCED);
primaryStage.setScene(scene);
primaryStage.show();
}
Note that the image is not distorted anymore.
You can play with its size to get a more fine or dense pattern (with a bigger image pattern).
Note that you can find this Cuboid primitive in the FXyz library, among many other 3D primitives.
Also you can find different texture modes (density maps, images, patterns...)

Libgdx: SpriteBatch.draw spriteVertecies wierd UV coords behavior

I'm trying to display a simple textured trapezoid (a road in perspective). For this I'm using SpriteBatch.draw with vertexes array as a parameter. But the result is unexpected.
What I expected:
What I got:
What exactly gone wrong? Or maybe I'm using the wrong method?
Here is the code:
#Override
public void create () {
texture = new Texture("road.jpg");
spriteBatch = new SpriteBatch();
float color = Color.toFloatBits(255, 255, 255, 255);
verts = new float[]{
0, 0, color, 0, 0,
Gdx.graphics.getWidth()/2-100, 300, color, 0, 1,
Gdx.graphics.getWidth()/2+100, 300, color, 1, 1,
Gdx.graphics.getWidth(), 0, color, 1, 0,
};
shapeRenderer = new ShapeRenderer();
}
#Override
public void render () {
Gdx.gl.glClearColor(0, 0.5f, 1f, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
shapeRenderer.begin(ShapeRenderer.ShapeType.Filled);
shapeRenderer.rect(0, 0, 640, 300);
shapeRenderer.end();
spriteBatch.begin();
spriteBatch.draw(texture, verts, 0, verts.length);
spriteBatch.end();
}
From documentation
draw(Texture texture, float[] spriteVertices, int offset, int count)
Draws a rectangle using the given vertices.
LibGDX draws these rectangles as two triangles, so it splits the texture. The problem is that these triangles in rectangle are the same size, but in trapezoid they are not, so they become distorted.
Solution would be to use projection or mesh.

How to use glDrawArrays to display cube in JOGL

I am new in with Java OpenGL (JOGL). I want to display a 3D cube in JOGL.
I have vertex array information with me.
double vertices[]= {
0 0 0,
0 0 1,
0 1 0,
0 1 1,
1 0 0,
1 0 1,
1 1 0,
1 1 1,
};
I want to use glDrawArrays() to display it. Since I have display a model having a huge amount of vertices.
The display method is given below.
public void display(GLAutoDrawable drawable) {
GL2 gl = drawable.getGL().getGL2();
gl.glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
gl.glLoadIdentity();
gl.glBegin(GL_TRIANGLE_STRIP);
gl.glEnd();
}
I need to use GL_TRIANGLES or GL_TRIANGLE_STRIP only and not GL_QUADS.
If anyone knows how to use glDrawArrays(); in JOGL please help me. I want JOGL syntax and not opengl.
If you want to use glDrawArrays(); then you have to create a VBO (Vertex Buffer Objects) or a VA (Vertex Arrays). If you're after speed, then choose VBO, though they require some extra lines of code to be made!
The best way I think I can explain how to create a VBO to you, is by giving you an example!
VBO Example
Here is a little example of a VBO storing Vertices and Colors for a Triangle and rendering it and also how to delete it!
Creating the VBO
This is the code where you create the actual Vertex and Color Buffer and bind them to the VBO.
int vertices = 3;
int vertex_size = 3; // X, Y, Z,
int color_size = 3; // R, G, B,
FloatBuffer vertex_data = BufferUtils.createFloatBuffer(vertices * vertex_size);
vertex_data.put(new float[] { -1f, -1f, 0f, });
vertex_data.put(new float[] { 1f, -1f, 0f, });
vertex_data.put(new float[] { 1f, 1f, 0f, });
vertex_data.flip();
FloatBuffer color_data = BufferUtils.createFloatBuffer(vertices * color_size);
color_data.put(new float[] { 1f, 0f, 0f, });
color_data.put(new float[] { 0f, 1f, 0f, });
color_data.put(new float[] { 0f, 0f, 1f, });
color_data.flip();
int vbo_vertex_handle = glGenBuffers();
glBindBuffer(GL_ARRAY_BUFFER, vbo_vertex_handle);
glBufferData(GL_ARRAY_BUFFER, vertex_data, GL_STATIC_DRAW);
glBindBuffer(GL_ARRAY_BUFFER, 0);
int vbo_color_handle = glGenBuffers();
glBindBuffer(GL_ARRAY_BUFFER, vbo_color_handle);
glBufferData(GL_ARRAY_BUFFER, color_data, GL_STATIC_DRAW);
glBindBuffer(GL_ARRAY_BUFFER, 0);
You can of course add more Vertices and Colors to the vertex_data and color_data if you want to! But always remember that the amount of vertex data, need to match with the amount of color data and vice versa!
Important: Only create the VBO(s) once, and only update them when necessary! Don't create them for each frame, since them you will end up with a frame-rate worse than when using immediate mode for rendering!
Rendering the VBO
This is the code you need to call, to render the VBO.
glBindBuffer(GL_ARRAY_BUFFER, vbo_vertex_handle);
glVertexPointer(vertex_size, GL_FLOAT, 0, 0l);
glBindBuffer(GL_ARRAY_BUFFER, vbo_color_handle);
glColorPointer(color_size, GL_FLOAT, 0, 0l);
glEnableClientState(GL_VERTEX_ARRAY);
glEnableClientState(GL_COLOR_ARRAY);
glDrawArrays(GL_TRIANGLES, 0, vertices);
glDisableClientState(GL_COLOR_ARRAY);
glDisableClientState(GL_VERTEX_ARRAY);
Deleting the VBO
Then when you're done with the VBO and you don't need it anymore, you can delete it by doing the following.
glDeleteBuffers(vbo_vertex_handle);
glDeleteBuffers(vbo_color_handle);

Why does this not make a good looking square?

Ok, first of all I totally agree that "TheNewBoston" tutorials are very... wrong at times. However that is what I was following to try to make a cube in OpenGL on android.
Anyways, I can't say that I have found great material on OpenGL to be honest. I have read through OpenGL Superbible... it was ok.
So here is the code that I have.
GLRenderer.java
package android.gem.opengltest;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import android.opengl.GLU;
import android.opengl.GLSurfaceView.Renderer;
import android.os.SystemClock;
public class GLRenderer implements Renderer {
private GLCube cube;
public GLRenderer() {
cube = new GLCube();
}
#Override
public void onDrawFrame(GL10 gl) {
// TODO Auto-generated method stub
gl.glDisable(GL10.GL_DITHER);
gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT | GL10.GL_STENCIL_BUFFER_BIT);
gl.glMatrixMode(GL10.GL_MODELVIEW);
gl.glLoadIdentity();
GLU.gluLookAt(gl, 0, 0, -5, 0, 0, 0, 0, 2, 0);
long time = SystemClock.uptimeMillis() % 4000L;
float angle = .09f * ((int) time);
gl.glRotatef(angle, 1, 1.5f, 2);
cube.draw(gl);
}
#Override
public void onSurfaceChanged(GL10 gl, int width, int height) {
// TODO Auto-generated method stub
float ratio = (float) width / height;
gl.glViewport(0, 0, width, height);
gl.glMatrixMode(GL10.GL_PROJECTION);
gl.glLoadIdentity();
gl.glFrustumf(-ratio, ratio, -1, 1, 1, 25);
}
#Override
public void onSurfaceCreated(GL10 gl, EGLConfig eglConfig) {
// TODO Auto-generated method stub
// START OF PERFORMANCE //
gl.glDisable(GL10.GL_DITHER);
gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_FASTEST);
// END OF PERFORMANCE //
gl.glClearColor(.8f, 0, .2f, 1f); // Red, Green, Blue, Alpha (0 - 1)
gl.glClearDepthf(1f);
}
}
GLCube.java
package android.gem.opengltest;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;
import java.nio.ShortBuffer;
import javax.microedition.khronos.opengles.GL10;
public class GLCube {
private float verticies[] = {
1, 1, -1, // point 0 - topFrontRight
1, -1, -1, // point 1 - bottomFrontRight
-1, -1, -1, // point 2 - bottomFrontLeft
-1, 1, -1, // point 3 - frontTopLeft
1, 1, 1, // point 4 - topBackRight
1, -1, 1, // point 5 - bottomBackRight
-1, -1, 1, // point 6 - bottomBackLeft
-1, 1, 1 // point 7 - frontBackLeft
};
private float rgbaValues[] = {
1, 1, 0, 1,
.25f, 0, .85f, 1,
0, 1, 1, 1,
1, 1, 0, 1,
.25f, 0, .85f, 1,
0, 1, 1, 1,
.5f, .5f, .2f, 1,
.3f, .3f, .3f, 1
};
private FloatBuffer vertBuff, colorBuff;
private short[] pIndex = { // Indicies
3, 4, 0, 0, 4, 1, 3, 0, 1,
3, 7, 4, 7, 6, 4, 7, 3, 6,
3, 1, 2, 1, 6, 2, 6, 3, 2,
1, 4, 5, 5, 6, 1, 6, 5, 4
};
private ShortBuffer pBuffer;
public GLCube() {
ByteBuffer bBuff = ByteBuffer.allocateDirect(this.verticies.length * 4);
bBuff.order(ByteOrder.nativeOrder());
vertBuff = bBuff.asFloatBuffer();
vertBuff.put(this.verticies);
vertBuff.position(0);
ByteBuffer pbBuff = ByteBuffer.allocateDirect(this.pIndex.length * 2);
pbBuff.order(ByteOrder.nativeOrder());
pBuffer = pbBuff.asShortBuffer();
pBuffer.put(pIndex);
pBuffer.position(0);
ByteBuffer cBuff = ByteBuffer.allocateDirect(this.rgbaValues.length * 4);
cBuff.order(ByteOrder.nativeOrder());
colorBuff = cBuff.asFloatBuffer();
colorBuff.put(rgbaValues);
colorBuff.position(0);
}
public void draw(GL10 gl) {
gl.glFrontFace(GL10.GL_CW); // Clock Wise
gl.glEnable(GL10.GL_CULL_FACE); // Removes back end of cube
gl.glCullFace(GL10.GL_BACK);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, this.vertBuff);
gl.glColorPointer(4, GL10.GL_FLOAT, 0, this.colorBuff);
gl.glDrawElements(GL10.GL_TRIANGLES, this.pIndex.length, GL10.GL_UNSIGNED_SHORT, this.pBuffer);
gl.glDisableClientState(GL10.GL_COLOR_ARRAY);
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
gl.glDisable(GL10.GL_CULL_FACE);
}
}
I get a cube that looks like this...
What am I doing wrong? What should I do to make it look like an actual cube?
Also, if it helps all my code is at the following address: https://github.com/gemurdock/OpenGlTest/tree/alpha.0.1.0
First of all, this is a (horribly deformed) cube, not a square. Unless you look at it face-on it is never going to look like a "good square" :)
Your polygon face culling appears to be culling the wrong side of your cube faces. It still looks like a cube, just an inside out cube.
This is likely because you have overridden OpenGL's default front face winding direction (GL_CCW).

Categories

Resources