You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
A simple example to show the use of OLED Library. In this example, a series of lines are drawn that originate in a corner of the screen and span out to the other side of the display, incremented by six pixels.
3
+
An example that shows drawing simple shapes using the SparkFun Qwiic OLED Library.
4
+
5
+
**Key Demo Features**
6
+
* Drawing lines, rectangles and circles
7
+
* Demonstrating how graphics size impacts display speed
8
+
* Drawing and erasing graphics quickly
9
+
* XOR operations using raster operators
4
10
5
11
## Setup
6
12
@@ -19,46 +25,173 @@ The user selects from one of the following classes:
The Example code supports all of the SparkFun Qwiic OLED boards. To select the board being used, uncomment the `#define` for the demo board.
29
+
22
30
For this example, the Qwiic Micro OLED is used.
31
+
```C++
32
+
#defineMICRO
33
+
//#define NARROW
34
+
//#define TRANSPARENT
35
+
```
36
+
Which results in myOLED being declared as:
37
+
23
38
```C++
24
39
QwiicMicroOLED myOLED;
25
40
```
26
41
27
-
## Drawing Lines
42
+
## Drawing Shapes
43
+
44
+
The shapes drawn are broken into a set of functions that perform one test, which is part of the overall example.
45
+
46
+
###Lines
47
+
48
+
This test starts with a short, horizontal line that is animated from the top to bottom of the display. After each iteration, the line size is increased and the animating sequence repeated.
49
+
50
+
To animate the line, the display is erased, then the line drawn. Once the line is draw, the updated graphics is sent to the OLED device by calling the `display()` method.
51
+
52
+
!!! note
53
+
When `display()` is called, only the range of modified pixels is sent to the OLED device, greatly reducing the data transferred for small graphic changes.
54
+
55
+
This is demonstrated by this test. When small lines are drawn, the update rate is fast, but as the line length increases, the update rate of the device is noticeably slower. A longer line requires more data to be sent to the device.
28
56
29
-
In the ```setup()``` function of this sketch, like all of the SparkFun qwiic libraries, the device is initialized by calling the ```begin()``` method. This method returns a value of ```true``` on success, or ```false``` on failure.
30
57
```C++
31
-
int width, height; // global variables for use in the sketch
32
-
voidsetup()
33
-
{
34
-
Serial.begin(115200);
35
-
if(!myOLED.begin()){
36
-
Serial.println("Device failed to initialize");
37
-
while(1); // halt execution
38
-
}
39
-
Serial.println("Device is initialized");
58
+
voidline_test_1(void){
59
+
60
+
int x, y, i;
61
+
62
+
int mid = width/2;
63
+
int delta = mid/8;
40
64
41
-
// get the device dimensions
42
-
width = myOLED.getWidth();
43
-
height = myOLED.getHeight();
65
+
for(int j =1; j < 8; j++ ){
66
+
67
+
x = delta*j;
68
+
69
+
for(i=0; i < height*2; i++){
70
+
71
+
y = i % height;
72
+
myOLED.erase();
73
+
myOLED.line(mid-x, y, mid+x, y);
74
+
myOLED.display();
75
+
}
76
+
}
44
77
}
45
78
```
46
-
Now that the library is initialized, in the ```loop()``` function of this sketch, the desired graphics are drawn. Here we erase the screen and draw simple series of lines that originate at the screen origin and fan out across the height of the display.
79
+
This test is followed up with a series of lines that span from a single point to the bottom of the screen, showing the flexibility of the line to raster algorithm used by the library.
47
80
48
81
```C++
49
-
voidloop(){
82
+
void line_test_2(void){
50
83
51
-
myOLED.erase(); // Erase the screen
52
-
myOLED.display(); // Send erase to device
53
-
54
-
delay(1000); // Slight pause
55
-
56
-
// Draw our lines from point (0,0) to (i, screen height)
57
-
58
-
for(int i=0; i < width; i+= 6){
59
-
myOLED.line(0, 0, i, height-1); // draw the line
60
-
myOLED.display(); // Send the new line to the device for display
84
+
for(int i=0; i < width; i +=6){
85
+
myOLED.line(0, 0, i, height-1);
86
+
myOLED.display();
87
+
}
88
+
delay(200);
89
+
myOLED.erase();
90
+
for(int i=width-1; i >= 0; i -=6){
91
+
myOLED.line(width-1, 0, i, height-1);
92
+
myOLED.display();
93
+
}
94
+
}
95
+
```
96
+
And the last line test draws a series of lines to test all three internal line drawing algorithms. Specifically:
97
+
* Angled lines drawn by the general purpose line algorithm
98
+
* Vertical lines drawn by an optimized line routine
99
+
* Horizontal lines draw by an optimized line routine
100
+
101
+
The test animates to show a growing box, giving an idea of the speed and flexibility of the system.
102
+
103
+
```C++
104
+
// Iterator function - called to animate graphic
105
+
voidline_test_vert_iter(uint8_t y0, uint8_t y1){
106
+
107
+
for(int i=0; i < width; i += 8)
108
+
myOLED.line( i, y0, i, y1);
109
+
110
+
// end off the vertical lines
111
+
myOLED.line( width-1, y0, width-1, y1);
112
+
113
+
// End lines and cross lines
114
+
myOLED.line(0, y0, width-1, y0);
115
+
myOLED.line(0, y1, width-1, y1);
116
+
myOLED.line(0, y0, width-1, y1);
117
+
myOLED.line(0, y1, width-1, y0);
118
+
}
119
+
120
+
// Entry point for test
121
+
void line_test_vert(void){
122
+
123
+
int mid = height/2;
124
+
125
+
for(int i=0; i < height; i+=4){
126
+
127
+
myOLED.erase();
128
+
line_test_vert_iter( mid - i/2, mid + i/2 );
129
+
myOLED.display();
130
+
delay(10);
61
131
}
62
132
}
63
133
```
64
-
A key point when using the OLED library, graphic/screen updates are only sent to the OLED device when the ```display()``` method is called.
134
+
135
+
### Rectangles
136
+
137
+
Several rectangle routines are shown in this example. A key test is a fast drawing routine which animates a small rectangle being drawn diagonally across the screen.
138
+
139
+
In this test, the rectangle is drawn, sent to the device via using `display()`, then the rectangle is drawn again, but this time in black. This effectively erases the rectangle. The position is incremented and the process loops, causing the rectangle to appear to fly across the screen.
140
+
141
+
The animation is quick, since only the portions of the screen that need updated are actually updated.
142
+
143
+
The animation algorithm:
144
+
145
+
```C++
146
+
for(int i = 0; i < steps; i++){
147
+
148
+
// Draw the rectangle and send it to device
149
+
myOLED.rectangle(x, y, x+side, y+side);
150
+
myOLED.display(); // sends erased rect and new rect pixels to device
151
+
152
+
// Erase the that rect, increment and loop
153
+
myOLED.rectangle(x, y, x+side, y+side, 0);
154
+
155
+
x += xinc;
156
+
y += yinc;
157
+
}
158
+
```
159
+
160
+
The next rectangle test draws a series of filled rectangles on the screen. The unique aspect of this test is that is uses the XOR functionally to overlay a rectangle on the device, presenting a alternating color pattern.
161
+
162
+
The XOR raster operation is set by calling the `setDrawMode()` method on the OLED device, and providing the `grROPXOR` code. This switch the device into a XOR drawing mode. Graphic operations are restored to normal by calling `setDrawMode()` and providing the `grROPCopy` code, which copies the new pixel value to the destination.
myOLED.setDrawMode(grROPCopy); // back to copy op (default)
176
+
}
177
+
```
178
+
179
+
### Circles
180
+
181
+
The final shape drawn by this example is a series of circles and filled circles. Using the geometry of the screen, a set of circles are drawn and displayed.
0 commit comments