Skip to content

Commit 5554319

Browse files
FWeinbFWeinb
committed
Update sample to use extended UI
1 parent 237d24b commit 5554319

File tree

2 files changed

+127
-86
lines changed

2 files changed

+127
-86
lines changed

‎examples/SSD1306Demo/SSD1306Demo.ino‎

Lines changed: 80 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
#include <ArduinoJson.h>
2-
31
/**The MIT License (MIT)
42
53
Copyright (c) 2015 by Daniel Eichhorn
@@ -26,6 +24,7 @@ See more at http://blog.squix.ch
2624
*/
2725
#include <Wire.h>
2826
#include "ssd1306_i2c.h"
27+
#include "SSD1306Ui.h"
2928
#include "images.h"
3029

3130
// if you are using a ESP8266 module with NodeMCU
@@ -48,105 +47,125 @@ See more at http://blog.squix.ch
4847

4948
// Initialize the oled display for address 0x3c
5049
// sda-pin=14 and sdc-pin=12
51-
SSD1306 display(0x3c, NODEMCU_D6, NODEMCU_D5);
50+
SSD1306 display(0x3c, NODEMCU_D6, NODEMCU_D5);
51+
SSD1306Ui ui ( &display );
5252

5353
// this array keeps function pointers to all frames
5454
// frames are the single views that slide from right to left
55-
void (*frameCallbacks[])(int x, int y) = {drawFrame1, drawFrame2, drawFrame3, drawFrame4};
55+
bool (*frames[])(SSD1306 *display, int x, int y) = { drawFrame1, drawFrame2, drawFrame3, drawFrame4 };
5656

5757
// how many frames are there?
5858
int frameCount = 4;
5959

60+
bool (*overlays[])(SSD1306 *display) = { msOverlay };
61+
int overlaysCount = 1;
62+
6063
void setup() {
6164
Serial.begin(115200);
6265
Serial.println();
6366
Serial.println();
64-
65-
// initialize dispaly
66-
display.init();
67+
68+
69+
ui.setTargetFPS(30);
70+
71+
ui.setActiveSymbole(activeSymbole);
72+
ui.setInactiveSymbole(inactiveSymbole);
73+
74+
// You can change this to
75+
// TOP, LEFT, BOTTOM, RIGHT
76+
ui.setIndicatorPosition(BOTTOM);
77+
78+
// Defines where the first frame is located in the bar.
79+
ui.setIndicatorDirection(LEFT_RIGHT);
80+
81+
// You can change the transition that is used
82+
// SLIDE_LEFT, SLIDE_RIGHT, SLIDE_TOP, SLIDE_DOWN
83+
ui.setFrameAnimation(SLIDE_LEFT);
84+
85+
// Add frames
86+
ui.setFrames(frames, frameCount);
87+
88+
// Add overlays
89+
ui.setOverlays(overlays, overlaysCount);
90+
91+
// Inital UI takes care of initalising the display too.
92+
ui.init();
93+
6794
display.flipScreenVertically();
68-
// set the drawing functions
69-
display.setFrameCallbacks(frameCount, frameCallbacks);
70-
// how many ticks does a slide of a frame take?
71-
display.setFrameTransitionTicks(10);
72-
// defines how many ticks the driver waits between frame transitions
73-
display.setFrameWaitTicks(150);
74-
75-
display.clear();
76-
display.display();
77-
95+
7896
}
7997

8098
void loop() {
81-
if (display.getFrameState() == display.FRAME_STATE_FIX) {
82-
// do something which consumes a lot of time in a moment
83-
// when there is no transition between frames going on.
84-
// This will keep transitions smooth;
85-
}
86-
87-
// clear the frame
88-
display.clear();
89-
90-
// Tell the driver to render the next frame.
91-
// This enables the frame mode including the transition
92-
// and the drawing of the frame indicators
93-
display.nextFrameTick();
99+
int remainingTimeBudget = ui.update();
94100

95-
// Even in frame mode you can draw static elements.
96-
// But they won't be transitioned
97-
display.setFont(ArialMT_Plain_10);
98-
display.setTextAlignment(TEXT_ALIGN_LEFT);
99-
display.drawString(0, 54, "20:54");
101+
if (remainingTimeBudget > 0) {
102+
// You can do some work here
103+
// Don't do stuff if you are below your
104+
// time budget.
105+
delay(remainingTimeBudget);
106+
}
107+
}
100108

101-
// copy the buffer to the display
102-
display.display();
109+
bool msOverlay(SSD1306 *display) {
110+
display->setTextAlignment(TEXT_ALIGN_RIGHT);
111+
display->setFont(ArialMT_Plain_10);
112+
display->drawString(128, 0, String(millis()));
113+
return true;
103114
}
104115

105-
void drawFrame1(int x, int y) {
116+
bool drawFrame1(SSD1306 *display, int x, int y) {
106117
// draw an xbm image.
107118
// Please note that everything that should be transitioned
108119
// needs to be drawn relative to x and y
109-
display.drawXbm(x + 34, y + 14, WiFi_Logo_width, WiFi_Logo_height, WiFi_Logo_bits);
110-
}
111120

112-
void drawFrame2(int x, int y) {
121+
// if this frame need to be refreshed at the targetFPS you need to
122+
// return true
123+
display->drawXbm(x + 34, y + 14, WiFi_Logo_width, WiFi_Logo_height, WiFi_Logo_bits);
124+
return false;
125+
}
126+
127+
bool drawFrame2(SSD1306 *display, int x, int y) {
113128
// Demonstrates the 3 included default sizes. The fonts come from SSD1306Fonts.h file
114129
// Besides the default fonts there will be a program to convert TrueType fonts into this format
115-
display.setTextAlignment(TEXT_ALIGN_LEFT);
116-
display.setFont(ArialMT_Plain_10);
117-
display.drawString(0 + x, 0 + y, "Arial 10");
130+
display->setTextAlignment(TEXT_ALIGN_LEFT);
131+
display->setFont(ArialMT_Plain_10);
132+
display->drawString(0 + x, 10 + y, "Arial 10");
133+
134+
display->setFont(ArialMT_Plain_16);
135+
display->drawString(0 + x, 20 + y, "Arial 16");
118136

119-
display.setFont(ArialMT_Plain_16);
120-
display.drawString(0 + x, 10 + y, "Arial 16");
137+
display->setFont(ArialMT_Plain_24);
138+
display->drawString(0 + x, 34 + y, "Arial 24");
121139

122-
display.setFont(ArialMT_Plain_24);
123-
display.drawString(0 + x, 24 + y, "Arial 24");
140+
return false;
124141
}
125142

126-
void drawFrame3(int x, int y) {
143+
bool drawFrame3(SSD1306 *display, int x, int y) {
127144
// Text alignment demo
128-
display.setFont(ArialMT_Plain_10);
145+
display->setFont(ArialMT_Plain_10);
129146

130147
// The coordinates define the left starting point of the text
131-
display.setTextAlignment(TEXT_ALIGN_LEFT);
132-
display.drawString(0 + x, 0 + y, "Left aligned (0,0)");
148+
display->setTextAlignment(TEXT_ALIGN_LEFT);
149+
display->drawString(0 + x, 11 + y, "Left aligned (0,10)");
133150

134151
// The coordinates define the center of the text
135-
display.setTextAlignment(TEXT_ALIGN_CENTER);
136-
display.drawString(64 + x, 20, "Center aligned (64,20)");
152+
display->setTextAlignment(TEXT_ALIGN_CENTER);
153+
display->drawString(64 + x, 22, "Center aligned (64,22)");
137154

138155
// The coordinates define the right end of the text
139-
display.setTextAlignment(TEXT_ALIGN_RIGHT);
140-
display.drawString(128 + x, 40, "Right aligned (128,40)");
156+
display->setTextAlignment(TEXT_ALIGN_RIGHT);
157+
display->drawString(128 + x, 33, "Right aligned (128,33)");
158+
return false;
141159
}
142160

143-
void drawFrame4(int x, int y) {
144-
// Demo for drawStringMaxWidth:
161+
bool drawFrame4(SSD1306 *display, int x, int y) {
162+
// Demo for drawStringMaxWidth:
145163
// with the third parameter you can define the width after which words will be wrapped.
146164
// Currently only spaces and "-" are allowed for wrapping
147-
display.setTextAlignment(TEXT_ALIGN_LEFT);
148-
display.setFont(ArialMT_Plain_10);
149-
display.drawStringMaxWidth(0 + x, 0 + y, 128, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore.");
165+
display->setTextAlignment(TEXT_ALIGN_LEFT);
166+
display->setFont(ArialMT_Plain_10);
167+
display->drawStringMaxWidth(0 + x, 10 + y, 128, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore.");
168+
return false;
150169
}
151170

152171

‎examples/SSD1306Demo/images.h‎

Lines changed: 47 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,50 @@
11
#define WiFi_Logo_width 60
22
#define WiFi_Logo_height 36
33
const char WiFi_Logo_bits[] PROGMEM = {
4-
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xF8,
5-
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0xFF, 0x07, 0x00, 0x00, 0x00,
6-
0x00, 0x00, 0xE0, 0xFF, 0x1F, 0x00, 0x00, 0x00, 0x00, 0x00, 0xF8, 0xFF,
7-
0x7F, 0x00, 0x00, 0x00, 0x00, 0x00, 0xFC, 0xFF, 0xFF, 0x00, 0x00, 0x00,
8-
0x00, 0x00, 0xFE, 0xFF, 0xFF, 0x01, 0x00, 0x00, 0x00, 0x00, 0xFF, 0xFF,
9-
0xFF, 0x03, 0x00, 0x00, 0x00, 0xFC, 0xFF, 0xFF, 0xFF, 0xFF, 0x00, 0x00,
10-
0x00, 0xFF, 0xFF, 0xFF, 0x07, 0xC0, 0x83, 0x01, 0x80, 0xFF, 0xFF, 0xFF,
11-
0x01, 0x00, 0x07, 0x00, 0xC0, 0xFF, 0xFF, 0xFF, 0x00, 0x00, 0x0C, 0x00,
12-
0xC0, 0xFF, 0xFF, 0x7C, 0x00, 0x60, 0x0C, 0x00, 0xC0, 0x31, 0x46, 0x7C,
13-
0xFC, 0x77, 0x08, 0x00, 0xE0, 0x23, 0xC6, 0x3C, 0xFC, 0x67, 0x18, 0x00,
14-
0xE0, 0x23, 0xE4, 0x3F, 0x1C, 0x00, 0x18, 0x00, 0xE0, 0x23, 0x60, 0x3C,
15-
0x1C, 0x70, 0x18, 0x00, 0xE0, 0x03, 0x60, 0x3C, 0x1C, 0x70, 0x18, 0x00,
16-
0xE0, 0x07, 0x60, 0x3C, 0xFC, 0x73, 0x18, 0x00, 0xE0, 0x87, 0x70, 0x3C,
17-
0xFC, 0x73, 0x18, 0x00, 0xE0, 0x87, 0x70, 0x3C, 0x1C, 0x70, 0x18, 0x00,
18-
0xE0, 0x87, 0x70, 0x3C, 0x1C, 0x70, 0x18, 0x00, 0xE0, 0x8F, 0x71, 0x3C,
19-
0x1C, 0x70, 0x18, 0x00, 0xC0, 0xFF, 0xFF, 0x3F, 0x00, 0x00, 0x08, 0x00,
20-
0xC0, 0xFF, 0xFF, 0x1F, 0x00, 0x00, 0x0C, 0x00, 0x80, 0xFF, 0xFF, 0x1F,
21-
0x00, 0x00, 0x06, 0x00, 0x80, 0xFF, 0xFF, 0x0F, 0x00, 0x00, 0x07, 0x00,
22-
0x00, 0xFE, 0xFF, 0xFF, 0xFF, 0xFF, 0x01, 0x00, 0x00, 0xF8, 0xFF, 0xFF,
23-
0xFF, 0x7F, 0x00, 0x00, 0x00, 0x00, 0xFE, 0xFF, 0xFF, 0x01, 0x00, 0x00,
24-
0x00, 0x00, 0xFC, 0xFF, 0xFF, 0x00, 0x00, 0x00, 0x00, 0x00, 0xF8, 0xFF,
25-
0x7F, 0x00, 0x00, 0x00, 0x00, 0x00, 0xE0, 0xFF, 0x1F, 0x00, 0x00, 0x00,
26-
0x00, 0x00, 0x80, 0xFF, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xFC,
27-
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00,
28-
};
4+
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xF8,
5+
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0xFF, 0x07, 0x00, 0x00, 0x00,
6+
0x00, 0x00, 0xE0, 0xFF, 0x1F, 0x00, 0x00, 0x00, 0x00, 0x00, 0xF8, 0xFF,
7+
0x7F, 0x00, 0x00, 0x00, 0x00, 0x00, 0xFC, 0xFF, 0xFF, 0x00, 0x00, 0x00,
8+
0x00, 0x00, 0xFE, 0xFF, 0xFF, 0x01, 0x00, 0x00, 0x00, 0x00, 0xFF, 0xFF,
9+
0xFF, 0x03, 0x00, 0x00, 0x00, 0xFC, 0xFF, 0xFF, 0xFF, 0xFF, 0x00, 0x00,
10+
0x00, 0xFF, 0xFF, 0xFF, 0x07, 0xC0, 0x83, 0x01, 0x80, 0xFF, 0xFF, 0xFF,
11+
0x01, 0x00, 0x07, 0x00, 0xC0, 0xFF, 0xFF, 0xFF, 0x00, 0x00, 0x0C, 0x00,
12+
0xC0, 0xFF, 0xFF, 0x7C, 0x00, 0x60, 0x0C, 0x00, 0xC0, 0x31, 0x46, 0x7C,
13+
0xFC, 0x77, 0x08, 0x00, 0xE0, 0x23, 0xC6, 0x3C, 0xFC, 0x67, 0x18, 0x00,
14+
0xE0, 0x23, 0xE4, 0x3F, 0x1C, 0x00, 0x18, 0x00, 0xE0, 0x23, 0x60, 0x3C,
15+
0x1C, 0x70, 0x18, 0x00, 0xE0, 0x03, 0x60, 0x3C, 0x1C, 0x70, 0x18, 0x00,
16+
0xE0, 0x07, 0x60, 0x3C, 0xFC, 0x73, 0x18, 0x00, 0xE0, 0x87, 0x70, 0x3C,
17+
0xFC, 0x73, 0x18, 0x00, 0xE0, 0x87, 0x70, 0x3C, 0x1C, 0x70, 0x18, 0x00,
18+
0xE0, 0x87, 0x70, 0x3C, 0x1C, 0x70, 0x18, 0x00, 0xE0, 0x8F, 0x71, 0x3C,
19+
0x1C, 0x70, 0x18, 0x00, 0xC0, 0xFF, 0xFF, 0x3F, 0x00, 0x00, 0x08, 0x00,
20+
0xC0, 0xFF, 0xFF, 0x1F, 0x00, 0x00, 0x0C, 0x00, 0x80, 0xFF, 0xFF, 0x1F,
21+
0x00, 0x00, 0x06, 0x00, 0x80, 0xFF, 0xFF, 0x0F, 0x00, 0x00, 0x07, 0x00,
22+
0x00, 0xFE, 0xFF, 0xFF, 0xFF, 0xFF, 0x01, 0x00, 0x00, 0xF8, 0xFF, 0xFF,
23+
0xFF, 0x7F, 0x00, 0x00, 0x00, 0x00, 0xFE, 0xFF, 0xFF, 0x01, 0x00, 0x00,
24+
0x00, 0x00, 0xFC, 0xFF, 0xFF, 0x00, 0x00, 0x00, 0x00, 0x00, 0xF8, 0xFF,
25+
0x7F, 0x00, 0x00, 0x00, 0x00, 0x00, 0xE0, 0xFF, 0x1F, 0x00, 0x00, 0x00,
26+
0x00, 0x00, 0x80, 0xFF, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xFC,
27+
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00,
28+
};
29+
30+
const char activeSymbole[] PROGMEM = {
31+
B00000000,
32+
B00000000,
33+
B00011000,
34+
B00100100,
35+
B01000010,
36+
B01000010,
37+
B00100100,
38+
B00011000
39+
};
40+
41+
const char inactiveSymbole[] PROGMEM = {
42+
B00000000,
43+
B00000000,
44+
B00000000,
45+
B00000000,
46+
B00011000,
47+
B00011000,
48+
B00000000,
49+
B00000000
50+
};

0 commit comments

Comments
 (0)