What is a texture and how do I use it?

Now that 1.3 is out, we can use the fantastic new mesh stuff. So far, my experiments have been limited to using colours to render meshes. But there’s something called a texture which I really don’t get. My experiments have left me baffled. Could anyone point me to a resource where I can learn about it? Or explain it in words of one syllable (or less)?

You can assign Mesh.texture a sprite name (string) or an image.

The texture is linearly interpolated between the vertices of the mesh according to the texture coordinates assigned to each vertex.

Texture coordinates are 2D coordinates (u, v) from 0 to 1. A coordinate of (0,0) represents the lower left corner of the image or sprite, a coordinate of (1,1) represents the upper right corner.

When you use the mesh:addRect convenience method, texture coordinates are automatically set so that the rect maps the entire texture (from 0 to 1 on both axis).



Because the texture is interpolated across the mesh according to texture coordinates, you can map part of an image onto an arbitrary structure made of triangles, deform an image, and so on.

The texture is bi-linearly interpolated if smooth() is enabled, and interpolated using nearest-neighbour if noSmooth() is enabled.

A-ha! It was the range that I hadn’t understood. Makes sense when I see it, but I was thinking in terms of pixels. Thanks!

function setup()
    i = image(64, 64)
    background(0, 0, 255, 255)
    stroke(255, 0, 0, 255)
    fill(0, 0, 0, 255)
    text("&", 32,32)
    m:setRectTex(1, 0,0,0.5, 0.5)

-- This function gets called once every frame
function draw()
    -- This sets the background color to black
    background(0, 0, 0)

    -- This sets the line thickness
    sprite(i, WIDTH/2, HEIGHT/2)

Since Andrew has admitted that he didn’t quite get textures, it should shock no one that they went straight over my head.

Can you attach a texture to each rect in your mesh, or only one? I was thinking of mesh as a way to draw a map composed of multiple textures. Can that be done?

went over my head first time too. But basically you set the texture to an image (so yes, only one image per mesh) and then can do can create a bunch of rectangles to show that image. Each rectangle can either show an entire copy of the image or just a small part of it.

Mark, your idea of creating a map with all the images you want to draw and then having each rectangle pick out just a part of that map does seem the way to go. Keep in mind though that there’s a size limit for the texture, so potentially you need multiple meshes if your map will have lots of images (according to Simeon the limit is 2048x2048 but you shouldn’t really do more than 1024x1024).

Here’s my go at it: https://gist.github.com/1686376

This code defines an Atlas class. You can use the atlas to map a name (a string) to a function that draws an image, and then afterwards you can add new rectangles that draw one of the images that you mapped. The Atlas class will layout each image in its mesh, and potentially create multiple meshes if it can’t fit the entire map in one.

Finally in draw, all you have to do is draw the atlas, and then you can move some of the rects around if you want to as well.

also as far as I understood so far, not sure if this is accurate, but there’s another use case for meshes, and it is to draw arbitrary polygons. At the bottom meshes are really made of triangles and it knows how to combine the triangles to make polygons. Although I haven’t played much with that part of the functionality so I can’t give details.

I was just trying to figure this out tonight and this whole conversation was very helpful. Thanks to all.