Showing posts with label gui. Show all posts
Showing posts with label gui. Show all posts

13 April 2009

Cool Dialog GUI (9 quads method)



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 (256x256 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)