Functions to draw into a graphics context.
Use these drawing functions inside a Layer's .update_proc drawing callback. A GContext is passed into this callback as an argument. This GContext can then be used with all of the drawing functions which are documented below. See Graphics Context for more information about the graphics context.
Refer to User Interface Layers chapter in the Pebble Developer Guides (chapter "Layers" and "Graphics") for a conceptual overview of the drawing system, Layers and relevant code examples.
Other drawing functions and related documentation:
Draws a pixel at given point in the current stroke color.
The destination graphics context in which to draw
The point at which to draw the pixel
Draws a 1-pixel wide rectangle outline in the current stroke color.
The destination graphics context in which to draw
The rectangle for which to draw the outline
Fills a rectangle with the current fill color, optionally rounding all or a selection of its corners.
The destination graphics context in which to draw
The rectangle to fill
The rounding radius of the corners in pixels (maximum is 8 pixels)
Bitmask of the corners that need to be rounded.
Draws the outline of a rounded rectangle in the current stroke color.
The destination graphics context in which to draw
The rectangle defining the dimensions of the rounded rectangle to draw
The corner radius in pixels
Draws a bitmap into the graphics context, inside the specified rectangle.
If the size of rect is smaller than the size of the bitmap, the bitmap will be clipped on right and bottom edges. If the size of rect is larger than the size of the bitmap, the bitmap will be tiled automatically in both horizontal and vertical directions, effectively drawing a repeating pattern.
The destination graphics context in which to draw the bitmap
The bitmap to draw
The rectangle in which to draw the bitmap
GBitmap
A shortcut to capture the framebuffer in the native format of the watch.
Captures the frame buffer for direct access, using the given format. Graphics functions will not affect the frame buffer while it is captured. The frame buffer is released when graphics_release_frame_buffer is called. The frame buffer must be released before the end of a layer's .update_proc for the layer to be drawn properly.
While the frame buffer is captured calling graphics_capture_frame_buffer will fail and return NULL.
When writing to the frame buffer, you should respect the visible boundaries of a window on the screen. Use layer_get_frame(window_get_root_layer(window)).origin to obtain its position relative to the frame buffer. For example, drawing to (5, 5) in the frame buffer while the window is transitioning to the left with its origin at (-20, 0) would effectively draw that point at (25, 5) relative to the window. For this reason you should consider the window's root layer frame when calculating drawing coordinates.
The graphics context providing the frame buffer
The format in which the framebuffer should be captured. Supported formats are GBitmapFormat1Bit and GBitmapFormat8Bit.
A pointer to the frame buffer. NULL if failed.
Releases the frame buffer. Must be called before the end of a layer's .update_proc for the layer to be drawn properly.
If buffer does not point to the address previously returned by graphics_capture_frame_buffer the frame buffer will not be released.
The graphics context providing the frame buffer
The pointer to frame buffer
True if the frame buffer was released successfully
Whether or not the frame buffer has been captured by graphics_capture_frame_buffer. Graphics functions will not affect the frame buffer until it has been released by graphics_release_frame_buffer.
The graphics context providing the frame buffer
True if the frame buffer has been captured
Draws a rotated bitmap with a memory-sensitive 2x anti-aliasing technique (using ray-finding instead of super-sampling), which is thresholded into a b/w bitmap for 1-bit and color blended for 8-bit.
This API has performance limitations that can degrade user experience. Use sparingly.
The destination graphics context in which to draw
The source bitmap to draw
Instance center (single point unaffected by rotation) relative to source bitmap
Angle of rotation. Rotation is an integer between 0 (no rotation) and TRIG_MAX_ANGLE (360 degree rotation). Use DEG_TO_TRIGANGLE to easily convert degrees to the appropriate value.
Where to draw the instance center of the rotated bitmap in the context.
Draws a line arc clockwise between angle_start and angle_end, where 0° is the top of the circle. If the difference between angle_start and angle_end is greater than 360°, a full circle will be drawn.
The destination graphics context in which to draw using the current stroke color and antialiasing setting.
The reference rectangle to derive the center point and radius (see scale_mode).
Determines how rect will be used to derive the center point and radius.
Radial starting angle. Use DEG_TO_TRIGANGLE to easily convert degrees to the appropriate value.
Radial finishing angle. If smaller than angle_start, nothing will be drawn.
Fills a circle clockwise between angle_start and angle_end, where 0° is the top of the circle. If the difference between angle_start and angle_end is greater than 360°, a full circle will be drawn and filled. If angle_start is greater than angle_end nothing will be drawn.
A simple example is drawing a 'Pacman' shape, with a starting angle of -225°, and ending angle of 45°. By setting inset_thickness to a non-zero value (such as 30) this example will produce the letter C.
The destination graphics context in which to draw using the current fill color and antialiasing setting.
The reference rectangle to derive the center point and radius (see scale).
Determines how rect will be used to derive the center point and radius.
Describes how thick in pixels the radial will be drawn towards its center measured from the outside.
Radial starting angle. Use DEG_TO_TRIGANGLE to easily convert degrees to the appropriate value.
Radial finishing angle. If smaller than angle_start, nothing will be drawn.
Calculates a GPoint located at the angle provided on the perimeter of a circle defined by the provided GRect.
The reference rectangle to derive the center point and radius (see scale_mode).
Determines how rect will be used to derive the center point and radius.
The angle at which the point on the circle's perimeter should be calculated. Use DEG_TO_TRIGANGLE to easily convert degrees to the appropriate value.
The point on the circle's perimeter.
Calculates a rectangle centered on the perimeter of a circle at a given angle. Use this to construct rectangles that follow the perimeter of a circle as an input for graphics_fill_radial_internal or graphics_draw_arc_internal, e.g. to draw circles every 30 degrees on a watchface.
The reference rectangle to derive the circle's center point and radius (see scale_mode).
Determines how rect will be used to derive the circle's center point and radius.
The angle at which the point on the circle's perimeter should be calculated. Use DEG_TO_TRIGANGLE to easily convert degrees to the appropriate value.
Width and height of the desired rectangle.
The rectangle centered on the circle's perimeter.
Bit mask values to specify the corners of a rectangle. The values can be combines using binary OR (|), For example: the mask to indicate top left and bottom right corners can: be created as follows: (GCornerTopLeft | GCornerBottomRight)
No corners.
Top-Left corner.
Top-Right corner.
Bottom-Left corner.
Bottom-Right corner.
All corners.
Top corners.
Bottom corners.
Left corners.
Right corners.
Values to specify how a given rectangle should be used to derive an oval shape.
Places the largest possible fully visible circle in the center of a rectangle.
Places the smallest possible circle in the center of a rectangle so that the rectangle is fully inside the circle.
Do you have questions about the Pebble SDK?
Do you need some help understanding something on this page?
You can either take advantage of our awesome developer community and check out the SDK Help forums, or you can send us a message through the website!