A lightweight GUI library for monochrome 128x64 displays to be used with Arduino.
- Edit your
platform.ini
and include the following:
lib_deps = https://github.com/ironlungx/pixel-view
pio run
- Download the current ZIP file from github here
- Inside the IDE, go to
Sketch->Include Library->Add a .ZIP library
and select the downloaded zip-file - The Library will be installed and you can include the library in your sketch.
- Keyboard:
- Numpad
- Radio buttons
- Check boxes
- Menu
- Progress Bars:
- Dialog Boxes
#include <pixelView.h>
#include <U8g2lib.h>
U8G2 u8g2; ////// REPLACE WITH YOUR DISPLAY
void doDelay(int n) {
// Replace with vTaskDelay if using FreeRTOS
delay(n);
}
PixelView pv(&u8g2, sendInput, doDelay, u8g2_font_haxrcorp4089_tr);
// A simple function for input management
// 5 button navigation
//
// This function must return one of the following:
// - ACTION_UP
// - ACTION_DOWN
// - ACTION_LEFT
// - ACTION_RIGHT
// - ACTION_SEL
int sendInput() {
if (digitalRead(BTN_UP)) return ACTION_UP;
else if (digitalRead(BTN_DOWN)) return ACTION_DOWN;
else if (digitalRead(BTN_LEFT)) return ACTION_LEFT;
else if (digitalRead(BTN_RIGHT)) return ACTION_RIGHT;
if (digitalRead(BTN_SEL) == LOW) return ACTION_SEL;
return ACTION_NONE;
}
void setup() {
u8g2.begin();
}
void loop() {
pv.showMessage("Hello World!!");
}
PixelView is a library designed for 128x64 monochrome OLED displays. It provides various UI elements such as keyboards, menus, progress bars, and more.
This is the main class that handles rendering and input for UI components.
PixelView(U8G2 *display, function<int(void)> inputFunction, function<void(int)> delayer, const uint8_t font[] = u8g2_font_6x12_tr);
- display: Pointer to a
U8G2
object. - inputFunction: Function that returns any action.
- delayer: Function that delays execution for
n
milliseconds. - font: Default font used for rendering (optional).
- xloc: X-coordinate to start the text.
- yloc: Y-coordinate to start the text.
- text: The text to be rendered.
- maintainX: If true, the X location remains unchanged between lines.
This method renders text with word wrapping. Set the font before calling the function
- message: The message displayed above the buttons (optional).
- defaultOption: The default selected option (
false
for "No",true
for "Yes").
Displays a dialog box with "Yes" and "No" options and returns the selected option.
- message: The message to be displayed.
Displays a dialog box with a single "Yes" button.
A Gboard-like keyboard for OLEDs.
Keyboard(PixelView &pixelView);
- pixelView: Reference to the
PixelView
object.
String fullKeyboard(const String &message = "", bool isEmptyAllowed = false, const String &defaultText = "")
- message: Optional message to be displayed on the screen.
- isEmptyAllowed: Whether empty input is allowed (
true
for allowed,false
otherwise). - defaultText: The default text displayed on the keyboard.
Displays a full keyboard for input and returns the entered text.
- defaultText: Default text to be displayed.
- isEmptyAllowed: Whether empty input is allowed.
Displays a numeric keypad for input.
Creates a paged view that cycles through different "pages".
Pager(int numFuncs, std::function<void(U8G2, std::function<int(void)>)> *displayFunctions, const int indicatorType = PAGE_DOT_NAV);
- numFuncs: The number of pages.
- displayFunctions: Array of functions that render each page.
- indicatorType: The type of page indicator (e.g., dots or arrows).
Renders the current page and handles input.
The library includes three types of menus: one with icons, one without icons, and one with just icons.
- items: Array of
menuItem
objects. - numItems: Number of items in the menu.
Displays a menu with icons and returns the selected menuItem
.
Use menuItem::name
to get the selected item's name
- header: Header text displayed at the top of the menu.
- items: Array of menu items.
- numItems: Number of items in the menu.
Displays a submenu without icons and returns the selected item.
Here is the portion for the gridMenu
:
![Gridmenu] (images/gridMenu.jpg)
- items: Array of
menuItem
objects. - numItems: Number of items in the menu.
- rowSize: Number of items displayed per row.
Displays a grid menu with icons and returns the selected menuItem
.
- header: String displayed with a highlight.
- items: Array of item strings.
- numItems: Number of items.
Displays a list of radio buttons and returns the selected option.
- header: The string displayed with a highlight.
- items: Array of
checkBox
objects. - numItems: Number of items.
Displays a list of checkboxes for the user to select.
void listBrowser(const char *header, const unsigned char iconBitmap[], const char *items[], unsigned int numItems, int displayType = LIST_NUMBER)
- header: Title displayed above the list.
- iconBitmap: A 16x16 icon (use
NULL
for no icon). - items: Array of items to display.
- numItems: Number of items in the list.
- displayType: Display style (numbers, bullets, or none).
Displays a scrollable list of items.
- progress: The current progress value.
- header: Optional header text displayed above the progress bar.
- bitmap: Optional bitmap (16x16) displayed next to the header.
Displays a horizontal progress bar.
- frame: The current frame in the circular progress animation.
Displays a circular loading animation.