Roller Coaster Ride

Traces to leave, thoughts to share.

Archive for the ‘clutter code opengl gui’ Category

Cool Dialog GUI (9 quads method)

Posted by alimbourg on April 13, 2009

Hey all,

If you want to draw some cool looking rectangle/dialog:

this is the 9 quads method using… Clutter.

First we need some texture like this (256×256 icon):

To be loaded with:


texture = cogl_texture_new_from_file (texPath, 10, COGL_TEXTURE_NONE, COGL_PIXEL_FORMAT_ANY, NULL);

Then, some layout parameters (inner rectangle coordinates):


float framing[4]={108.0/256.0,50.0/256.0,200.0/256.0,147.0/256.0};

and a function which splits the texture into 9 quads, to stretch the whole thing smartly:


static void _cogl_9_rectangle (float x_1, float y_1, float x_2, float y_2,
float framing[4], CoglHandle texHandle)
{
float verts[12*9];

if (!cogl_is_texture(texHandle))
return;

cogl_set_source_texture (texHandle);

cogl_push_matrix ();
cogl_translate (x_1, y_1, 0);

float subrect[4];
float w = x_2-x_1;
float h = y_2-y_1;
//uniformly stretched
subrect[0]=w*dims[0];
subrect[1]=h*dims[1];
subrect[2]=w*dims[2];
subrect[3]=h*dims[3];
//and or preserving original texture dims
int tex_w = cogl_texture_get_width(texHandle);
int tex_h = cogl_texture_get_height(texHandle);
float value = tex_w*dims[0];
if (value<subrect[0]) subrect[0]=value;
value = tex_h*dims[1];
if (value<subrect[1]) subrect[1]=value;
value = w - tex_w*(1.0f-dims[2]);
if (value>subrect[2]) subrect[2]=value;
value = h - tex_h*(1.0f-dims[3]);
if (value>subrect[3]) subrect[3]=value;
//and the 9 quads
cogl_rectangle_with_texture_coords (0.0f, 0.0f, subrect[0], subrect[1],
0.0f, 0.0f, dims[0], dims[1]);
cogl_rectangle_with_texture_coords (subrect[0], 0.0f, subrect[2], subrect[1],
dims[0], 0.0f, dims[2], dims[1]);
cogl_rectangle_with_texture_coords (subrect[2], 0.0f, w, subrect[1],
dims[2], 0.0f, 1.0f, dims[1]);

cogl_rectangle_with_texture_coords (0.0f, subrect[1], subrect[0], subrect[3],
0.0f, dims[1], dims[0], dims[3]);
cogl_rectangle_with_texture_coords (subrect[0], subrect[1], subrect[2], subrect[3],
dims[0], dims[1], dims[2], dims[3]);
cogl_rectangle_with_texture_coords (subrect[2], subrect[1], w, subrect[3],
dims[2], dims[1], 1.0f, dims[3]);

cogl_rectangle_with_texture_coords (0.0f, subrect[3], subrect[0], h,
0.0f, dims[3], dims[0], 1.0);
cogl_rectangle_with_texture_coords (subrect[0], subrect[3], subrect[2], h,
dims[0], dims[3], dims[2], 1.0);
cogl_rectangle_with_texture_coords (subrect[2], subrect[3], w, h,
dims[2], dims[3], 1.0f, 1.0);

cogl_pop_matrix();
}

(http://code.google.com/p/syntaxhighlighter/ rocks)

Posted in clutter code opengl gui | Leave a Comment »

 
Follow

Get every new post delivered to your Inbox.