f. Bitmaps at Angles

<< Click to Display Table of Contents >>

Navigation:  Tutorials > Tutorial 03 - Displaying Bitmaps & Icons >

f. Bitmaps at Angles

This section shows how to draw bitmap images at various angles using the CleO commands. To draw a bitmap at an angle, you are required to have an angle and a radius set for the bitmap. The angle and radius can be adjusted using the BitmapRadius() and BitmapAngle() commands. Upon setting these values, a bitmap can be drawn using the Bitmap() command.



Command Prototype:


uint16_t Bitmap(int16_t Handle, int X, int Y)





returns value received from LoadImageFile() commmand


x coordinate value


y coordinate value


uint16_t BitmapRadius(int Radius);





Distance from center at which bitmap will be drawn


uint16_t BitmapAngle(int16_t Angle);





Angle at which bitmap will be drawn





The following code snippet illustrates how to draw multiple bitmaps files at various angles:


void setup()


 int16_t digit[10];

 int radiuses[10] = {165, 155, 125, 145, 155, 155, 145, 125, 155};

 int centerX = 320 / 2, centerY = 480 / 2;


/* Initialize CleO - needs to be done only once */



/* Get handles for all bitmap files */

 digit[0] = CleO.LoadImageFile("@Pictures/nixie/1.png", 0);

 digit[1] = CleO.LoadImageFile("@Pictures/nixie/2.png", 0);

 digit[2] = CleO.LoadImageFile("@Pictures/nixie/3.png", 0);

 digit[3] = CleO.LoadImageFile("@Pictures/nixie/4.png", 0);

 digit[4] = CleO.LoadImageFile("@Pictures/nixie/5.png", 0);

 digit[5] = CleO.LoadImageFile("@Pictures/nixie/6.png", 0);

 digit[6] = CleO.LoadImageFile("@Pictures/nixie/7.png", 0);

 digit[7] = CleO.LoadImageFile("@Pictures/nixie/8.png", 0);

 digit[8] = CleO.LoadImageFile("@Pictures/nixie/9.png", 0);


/* Start building a screen frame */



/* Set the radius and justification for the bitmap files */



 int angle = 0;

 for (int i = 0; i < 9; ++i)





  /* Draw bitmap at updated angle */

   CleO.Bitmap(digit[i], centerX, centerY);

   angle = (angle + 40) % 360;




/* Display completed screen frame */




void loop() { }





In the above code snippet, the Setup() routine loads the set of png bitmap files by getting the bitmap handle.

Upon setting these shared values for bitmap drawing, all the bitmaps are drawn inside a for loop by changing the angle of each bitmap.

The Bitmap() command takes the bitmap handle and draws it with centerX and centerY as a center coordinate.

Use the @ symbol only when performing the file operation from the eFlash and not from the SD Card.





Here is the output displayed upon executing the above code snippet -