cottongin/crosspoint-reader
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases 4 Wiki Activity

Grid pagination, window frame

Browse Source
This commit is contained in:
Emilien Huet (Malt) 2025-12-22 06:37:20 -08:00
parent c1f25e9c2a
commit d3e16152e2
6 changed files with 259 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
lib/GfxRenderer/GfxRenderer.cpp
View File

@ -80,11 +80,18 @@ void GfxRenderer::drawText(const int fontId, const int x, const int y, const cha
}
}
void GfxRenderer::drawTextInBox(const int fontId, const int x, const int y, const int w, const int h, const char* text, const bool black, const EpdFontStyle style) const {
void GfxRenderer::drawTextInBox(const int fontId, const int x, const int y, const int w, const int h, const char* text, const bool centered, const bool black, const EpdFontStyle style) const {
const int lineHeight = getLineHeight(fontId);
const int spaceWidth = getSpaceWidth(fontId);
int xpos = x;
int ypos = y + lineHeight;
if (centered) {
int textWidth = getTextWidth(fontId, text, style);
if (textWidth < w) {
// Center if text on single line
xpos = x + (w - textWidth) / 2;
}
}
// cannot draw a NULL / empty string
if (text == nullptr || *text == '\0') {
@ -117,6 +124,13 @@ void GfxRenderer::drawTextInBox(const int fontId, const int x, const int y, cons
renderChar(font, '.', &dotX, &ypos, black, style);
break;
} else {
// TODO center when more than one line
// if (centered) {
// int textWidth = getTextWidth(fontId, text, style);
// if (textWidth < w) {
// xpos = x + (w - textWidth) / 2;
// }
// }
xpos = x;
ypos += lineHeight;
if (h > 0 && ypos - y > h) {
@ -155,6 +169,12 @@ void GfxRenderer::drawLine(int x1, int y1, int x2, int y2, const bool state) con
}
}
void GfxRenderer::drawLine(int x1, int y1, int x2, int y2, const int lineWidth, const bool state) const {
for (int i = 0; i < lineWidth; i++) {
drawLine(x1, y1 + i, x2, y2 + i, state);
}
}
void GfxRenderer::drawRect(const int x, const int y, const int width, const int height, const bool state) const {
drawLine(x, y, x + width - 1, y, state);
drawLine(x + width - 1, y, x + width - 1, y + height - 1, state);
@ -162,6 +182,68 @@ void GfxRenderer::drawRect(const int x, const int y, const int width, const int
drawLine(x, y, x, y + height - 1, state);
}
// Border is inside the rectangle
void GfxRenderer::drawRect(const int x, const int y, const int width, const int height, const int lineWidth, const bool state) const {
for (int i = 0; i < lineWidth; i++) {
drawLine(x + i, y + i, x + width - i, y + i, state);
drawLine(x + width - i, y + i, x + width - i, y + height - i, state);
drawLine(x + width - i, y + height - i, x + i, y + height - i, state);
drawLine(x + i, y + height - i, x + i, y + i, state);
}
}
void GfxRenderer::drawArc(const int maxRadius, const int cx, const int cy, const int xDir, const int yDir, const int lineWidth, const bool state) const {
const int stroke = std::min(lineWidth, maxRadius);
const int innerRadius = std::max(maxRadius - stroke, 0);
const int outerRadiusSq = maxRadius * maxRadius;
const int innerRadiusSq = innerRadius * innerRadius;
for (int dy = 0; dy <= maxRadius; ++dy) {
for (int dx = 0; dx <= maxRadius; ++dx) {
const int distSq = dx * dx + dy * dy;
if (distSq > outerRadiusSq || distSq < innerRadiusSq) {
continue;
}
const int px = cx + xDir * dx;
const int py = cy + yDir * dy;
drawPixel(px, py, state);
}
}
};
// Border is inside the rectangle, rounded corners
void GfxRenderer::drawRoundedRect(const int x, const int y, const int width, const int height, const int lineWidth, const int cornerRadius, const bool state) const {
if (lineWidth <= 0 || width <= 0 || height <= 0) {
return;
}
const int maxRadius = std::min({cornerRadius, width / 2, height / 2});
if (maxRadius <= 0) {
drawRect(x, y, width, height, lineWidth, state);
return;
}
const int stroke = std::min(lineWidth, maxRadius);
const int right = x + width - 1;
const int bottom = y + height - 1;
const int horizontalWidth = width - 2 * maxRadius;
if (horizontalWidth > 0) {
fillRect(x + maxRadius, y, horizontalWidth, stroke, state);
fillRect(x + maxRadius, bottom - stroke + 1, horizontalWidth, stroke, state);
}
const int verticalHeight = height - 2 * maxRadius;
if (verticalHeight > 0) {
fillRect(x, y + maxRadius, stroke, verticalHeight, state);
fillRect(right - stroke + 1, y + maxRadius, stroke, verticalHeight, state);
}
drawArc(maxRadius, x + maxRadius, y + maxRadius, -1, -1, lineWidth, state); // TL
drawArc(maxRadius, right - maxRadius, y + maxRadius, 1, -1, lineWidth, state); // TR
drawArc(maxRadius, right - maxRadius, bottom - maxRadius, 1, 1, lineWidth, state); // BR
drawArc(maxRadius, x + maxRadius, bottom - maxRadius, -1, 1, lineWidth, state); // BL
}
void GfxRenderer::fillRect(const int x, const int y, const int width, const int height, const bool state) const {
for (int fillY = y; fillY < y + height; fillY++) {
drawLine(x, fillY, x + width - 1, fillY, state);
@ -173,6 +255,10 @@ void GfxRenderer::drawImage(const uint8_t bitmap[], const int x, const int y, co
einkDisplay.drawImage(bitmap, y, x, height, width);
}
void GfxRenderer::drawIcon(const uint8_t bitmap[], const int x, const int y, const int width, const int height) const {
einkDisplay.drawImage(bitmap, y, getScreenWidth() - width - x, height, width);
}
void GfxRenderer::drawBitmap(const Bitmap& bitmap, const int x, const int y, const int maxWidth,
const int maxHeight) const {
float scale = 1.0f;

7
lib/GfxRenderer/GfxRenderer.h
View File

@ -45,16 +45,21 @@ class GfxRenderer {
// Drawing
void drawPixel(int x, int y, bool state = true) const;
void drawLine(int x1, int y1, int x2, int y2, bool state = true) const;
void drawLine(int x1, int y1, int x2, int y2, int lineWidth, bool state = true) const;
void drawRect(int x, int y, int width, int height, bool state = true) const;
void drawRect(int x, int y, int width, int height, int lineWidth, bool state) const;
void drawArc(int maxRadius, int cx, int cy, int xDir, int yDir, int lineWidth, bool state) const;
void drawRoundedRect(int x, int y, int width, int height, int lineWidth, int cornerRadius, bool state) const;
void fillRect(int x, int y, int width, int height, bool state = true) const;
void drawImage(const uint8_t bitmap[], int x, int y, int width, int height) const;
void drawIcon(const uint8_t bitmap[], int x, int y, int width, int height) const;
void drawBitmap(const Bitmap& bitmap, int x, int y, int maxWidth, int maxHeight) const;
// Text
int getTextWidth(int fontId, const char* text, EpdFontStyle style = REGULAR) const;
void drawCenteredText(int fontId, int y, const char* text, bool black = true, EpdFontStyle style = REGULAR) const;
void drawText(int fontId, int x, int y, const char* text, bool black = true, EpdFontStyle style = REGULAR) const;
void drawTextInBox(int fontId, int x, int y, int w, int h, const char* text, bool black = true, EpdFontStyle style = REGULAR) const;
void drawTextInBox(int fontId, int x, int y, int w, int h, const char* text, bool centered, bool black = true, EpdFontStyle style = REGULAR) const;
int getSpaceWidth(int fontId) const;
int getLineHeight(int fontId) const;

120
src/activities/home/GridBrowserActivity.cpp
View File

@ -2,12 +2,14 @@
#include <GfxRenderer.h>
#include <SD.h>
#include <InputManager.h>
#include "config.h"
#include "../../images/FolderIcon.h"
#include "../util/Window.h"
namespace {
constexpr int PAGE_ITEMS = 12;
constexpr int PAGE_ITEMS = 9;
constexpr int SKIP_PAGE_MS = 700;
constexpr int TILE_W = 135;
constexpr int TILE_H = 200;
@ -15,6 +17,8 @@ constexpr int TILE_PADDING = 5;
constexpr int THUMB_W = 90;
constexpr int THUMB_H = 120;
constexpr int TILE_TEXT_H = 60;
constexpr int gridLeftOffset = 45;
constexpr int gridTopOffset = 125;
} // namespace
inline int min(const int a, const int b) { return a < b ? a : b; }
@ -37,6 +41,8 @@ void GridBrowserActivity::taskTrampoline(void* param) {
void GridBrowserActivity::loadFiles() {
files.clear();
selectorIndex = 0;
previousSelectorIndex = -1;
page = 0;
auto root = SD.open(basepath.c_str());
for (File file = root.openNextFile(); file; file = root.openNextFile()) {
const std::string filename = std::string(file.name());
@ -49,7 +55,7 @@ void GridBrowserActivity::loadFiles() {
files.emplace_back(FileInfo{ filename, filename, F_DIRECTORY });
} else {
FileType type = F_FILE;
size_t dot = filename.find_last_of('.');
size_t dot = filename.find_first_of('.');
std::string basename = filename;
if (dot != std::string::npos) {
std::string ext = filename.substr(dot);
@ -58,7 +64,7 @@ void GridBrowserActivity::loadFiles() {
for (char &c : ext) c = (char)tolower(c);
if (ext == ".epub") {
type = F_EPUB;
} else if (ext == ".bmp") {
} else if (ext == ".thumb.bmp") {
type = F_BMP;
}
}
@ -78,12 +84,13 @@ void GridBrowserActivity::onEnter() {
Serial.printf("Enter grid\n");
renderingMutex = xSemaphoreCreateMutex();
basepath = "/Dev/Thumbs";
basepath = "/";
loadFiles();
selectorIndex = 0;
page = 0;
// Trigger first update
updateRequired = true;
// Trigger first render
renderRequired = true;
xTaskCreate(&GridBrowserActivity::taskTrampoline, "GridFileBrowserTask",
8192, // Stack size
@ -111,6 +118,7 @@ void GridBrowserActivity::loop() {
const bool prevReleased = inputManager.wasReleased(InputManager::BTN_UP) || inputManager.wasReleased(InputManager::BTN_LEFT);
const bool nextReleased = inputManager.wasReleased(InputManager::BTN_DOWN) || inputManager.wasReleased(InputManager::BTN_RIGHT);
const bool skipPage = inputManager.getHeldTime() > SKIP_PAGE_MS;
const int selected = selectorIndex + page * PAGE_ITEMS;
if (inputManager.wasPressed(InputManager::BTN_CONFIRM)) {
if (files.empty()) {
@ -120,57 +128,77 @@ void GridBrowserActivity::loop() {
if (basepath.back() != '/') {
basepath += "/";
}
if (files[selectorIndex].type == F_DIRECTORY) {
if (files[selected].type == F_DIRECTORY) {
// open subfolder
basepath += files[selectorIndex].name;
basepath += files[selected].name;
loadFiles();
updateRequired = true;
renderRequired = true;
} else {
onSelect(basepath + files[selectorIndex].name);
onSelect(basepath + files[selected].name);
}
} else if (inputManager.wasPressed(InputManager::BTN_BACK)) {
if (basepath != "/") {
basepath = basepath.substr(0, basepath.rfind('/'));
if (basepath.empty()) basepath = "/";
loadFiles();
updateRequired = true;
renderRequired = true;
} else {
// At root level, go back home
onGoHome();
}
} else if (prevReleased) {
if (skipPage) {
selectorIndex = ((selectorIndex / PAGE_ITEMS - 1) * PAGE_ITEMS + files.size()) % files.size();
previousSelectorIndex = selectorIndex;
if (selectorIndex == 0 || skipPage) {
if (page > 0) {
page--;
selectorIndex = 0;
previousSelectorIndex = -1;
renderRequired = true;
}
} else {
selectorIndex = (selectorIndex + files.size() - 1) % files.size();
selectorIndex--;
updateRequired = true;
}
updateRequired = true;
} else if (nextReleased) {
if (skipPage) {
selectorIndex = ((selectorIndex / PAGE_ITEMS + 1) * PAGE_ITEMS) % files.size();
previousSelectorIndex = selectorIndex;
if (selectorIndex == min(PAGE_ITEMS, files.size() - page * PAGE_ITEMS) - 1 || skipPage) {
if (page < files.size() / PAGE_ITEMS) {
page++;
selectorIndex = 0;
previousSelectorIndex = -1;
renderRequired = true;
}
} else {
selectorIndex = (selectorIndex + 1) % files.size();
selectorIndex++;
updateRequired = true;
}
updateRequired = true;
}
}
void GridBrowserActivity::displayTaskLoop() {
while (true) {
if (updateRequired) {
if (renderRequired) {
renderRequired = false;
xSemaphoreTake(renderingMutex, portMAX_DELAY);
render(true);
xSemaphoreGive(renderingMutex);
} else if (updateRequired) {
updateRequired = false;
xSemaphoreTake(renderingMutex, portMAX_DELAY);
render();
// update(true);
render(false);
xSemaphoreGive(renderingMutex);
}
vTaskDelay(10 / portTICK_PERIOD_MS);
}
}
void GridBrowserActivity::render() const {
const auto pageWidth = renderer.getScreenWidth();
const auto pageHeight = renderer.getScreenHeight();
renderer.clearScreen();
void GridBrowserActivity::render(bool clear) const {
if (clear) {
renderer.clearScreen();
auto folderName = basepath == "/" ? "SD card" : basepath.substr(basepath.rfind('/') + 1).c_str();
drawFullscreenWindowFrame(renderer, folderName);
}
bool hasGeyscaleBitmaps = false;
if (!files.empty()) {
@ -184,20 +212,17 @@ void GridBrowserActivity::render() const {
}
}
const int16_t iconOffsetX = (TILE_W - FOLDERICON_WIDTH) / 2;
const int16_t iconOffsetY = (TILE_H - TILE_TEXT_H - FOLDERICON_HEIGHT) / 2;
const int16_t thumbOffsetX = (TILE_W - THUMB_W) / 2;
const int16_t thumbOffsetY = (TILE_H - TILE_TEXT_H - THUMB_H) / 2;
for (size_t i = 0; i < min(PAGE_ITEMS, files.size()); i++) {
const auto file = files[i];
for (size_t i = 0; i < min(PAGE_ITEMS, files.size() - page * PAGE_ITEMS); i++) {
const auto file = files[i + page * PAGE_ITEMS];
const int16_t tileX = 45 + i % 3 * TILE_W;
const int16_t tileY = 115 + i / 3 * TILE_H;
const int16_t tileX = gridLeftOffset + i % 3 * TILE_W;
const int16_t tileY = gridTopOffset + i / 3 * TILE_H;
if (pass == 0) {
Serial.printf("Rendering file %s at (%d, %d)\n", file.name.c_str(), tileX, tileY);
if (file.type == F_DIRECTORY) {
renderer.drawImage(FolderIcon, tileX + iconOffsetX, tileY + iconOffsetY, FOLDERICON_WIDTH, FOLDERICON_HEIGHT);
constexpr int iconOffsetX = (TILE_W - FOLDERICON_WIDTH) / 2;
constexpr int iconOffsetY = (TILE_H - TILE_TEXT_H - FOLDERICON_HEIGHT) / 2;
renderer.drawIcon(FolderIcon, tileX + iconOffsetX, tileY + iconOffsetY, FOLDERICON_WIDTH, FOLDERICON_HEIGHT);
}
}
@ -209,19 +234,24 @@ void GridBrowserActivity::render() const {
if (bitmap.hasGreyscale()) {
hasGeyscaleBitmaps = true;
}
constexpr int thumbOffsetX = (TILE_W - THUMB_W) / 2;
constexpr int thumbOffsetY = (TILE_H - TILE_TEXT_H - THUMB_H) / 2;
renderer.drawBitmap(bitmap, tileX + thumbOffsetX, tileY + thumbOffsetY, THUMB_W, THUMB_H);
}
}
}
if (pass == 0) {
renderer.drawTextInBox(UI_FONT_ID, tileX + TILE_PADDING, tileY + TILE_H - TILE_TEXT_H, TILE_W - 2 * TILE_PADDING, TILE_TEXT_H, file.basename.c_str(), 1); // i != selectorIndex
renderer.drawTextInBox(UI_FONT_ID, tileX + TILE_PADDING, tileY + TILE_H - TILE_TEXT_H, TILE_W - 2 * TILE_PADDING, TILE_TEXT_H, file.basename.c_str(), true);
}
}
if (pass == 0) {
renderer.displayBuffer(EInkDisplay::HALF_REFRESH);
if (!hasGeyscaleBitmaps) {
update(false);
renderer.displayBuffer();
if (hasGeyscaleBitmaps) {
renderer.storeBwBuffer();
} else {
// we can skip grayscale passes if no bitmaps use it
break;
}
@ -231,7 +261,21 @@ void GridBrowserActivity::render() const {
renderer.copyGrayscaleMsbBuffers();
renderer.displayGrayBuffer();
renderer.setRenderMode(GfxRenderer::BW);
renderer.restoreBwBuffer();
}
}
}
}
void GridBrowserActivity::drawSelectionRectangle(int tileIndex, bool black) const {
renderer.drawRoundedRect(gridLeftOffset + tileIndex % 3 * TILE_W, gridTopOffset + tileIndex / 3 * TILE_H, TILE_W, TILE_H, 2, 5, black);
}
void GridBrowserActivity::update(bool render) const {
// Redraw only changed tiles
// renderer.clearScreen();
if (previousSelectorIndex >= 0) {
drawSelectionRectangle(previousSelectorIndex, false);
}
drawSelectionRectangle(selectorIndex, true);
}

7
src/activities/home/GridBrowserActivity.h
View File

@ -29,14 +29,19 @@ class GridBrowserActivity final : public Activity {
std::string basepath = "/";
std::vector<FileInfo> files;
int selectorIndex = 0;
int previousSelectorIndex = -1;
int page;
bool updateRequired = false;
bool renderRequired = false;
const std::function<void(const std::string&)> onSelect;
const std::function<void()> onGoHome;
static void taskTrampoline(void* param);
[[noreturn]] void displayTaskLoop();
void render() const;
void render(bool clear) const;
void update(bool render) const;
void loadFiles();
void drawSelectionRectangle(int tileIndex, bool black) const;
public:
explicit GridBrowserActivity(GfxRenderer& renderer, InputManager& inputManager,

71
src/activities/util/Window.cpp Normal file
View File

@ -0,0 +1,71 @@
#include "./Window.h"
#include "Battery.h"
#include "config.h"
namespace {
constexpr int windowCornerRadius = 16;
constexpr int windowBorderWidth = 2;
constexpr int fullscreenWindowMargin = 20;
constexpr int windowHeaderHeight = 50;
constexpr int statusBarHeight = 50;
constexpr int batteryWidth = 15;
constexpr int batteryHeight = 10;
} // namespace
void drawWindowFrame(GfxRenderer& renderer, int xMargin, int y, int height, bool hasShadow, const char* title) {
const int windowWidth = GfxRenderer::getScreenWidth() - 2 * xMargin;
renderer.drawRoundedRect(xMargin, y, windowWidth, height, windowBorderWidth, windowCornerRadius, true);
if (hasShadow) {
renderer.drawLine(windowWidth + xMargin, y + windowCornerRadius + 2, windowWidth + xMargin, y + height - windowCornerRadius, windowBorderWidth, true);
renderer.drawLine(xMargin + windowCornerRadius + 2, y + height, windowWidth + xMargin - windowCornerRadius, y + height, windowBorderWidth, true);
renderer.drawArc(windowCornerRadius + windowBorderWidth, windowWidth + xMargin - 1 - windowCornerRadius, y + height - 1 - windowCornerRadius, 1, 1, windowBorderWidth, true);
renderer.drawPixel(xMargin + windowCornerRadius + 1, y + height, true);
}
if (title) { // Header
const int titleWidth = renderer.getTextWidth(UI_FONT_ID, title);
const int titleX = (GfxRenderer::getScreenWidth() - titleWidth) / 2;
const int titleY = y + 10;
renderer.drawText(UI_FONT_ID, titleX, titleY, title, true, REGULAR);
renderer.drawLine(xMargin, y + windowHeaderHeight, windowWidth + xMargin, y + windowHeaderHeight, windowBorderWidth, true);
}
}
void drawFullscreenWindowFrame(GfxRenderer& renderer, const char* title) {
drawStatusBar(renderer);
drawWindowFrame(renderer, fullscreenWindowMargin, statusBarHeight, GfxRenderer::getScreenHeight() - fullscreenWindowMargin - statusBarHeight, true, title);
}
void drawStatusBar(GfxRenderer& renderer) {
constexpr auto textY = 18;
// Left aligned battery icon and percentage
const uint16_t percentage = battery.readPercentage();
const auto percentageText = std::to_string(percentage) + "%";
const auto percentageTextWidth = renderer.getTextWidth(SMALL_FONT_ID, percentageText.c_str());
renderer.drawText(SMALL_FONT_ID, fullscreenWindowMargin + batteryWidth + 5, textY, percentageText.c_str());
// 1 column on left, 2 columns on right, 5 columns of battery body
constexpr int x = fullscreenWindowMargin;
constexpr int y = textY + 5;
// Top line
renderer.drawLine(x, y, x + batteryWidth - 4, y);
// Bottom line
renderer.drawLine(x, y + batteryHeight - 1, x + batteryWidth - 4, y + batteryHeight - 1);
// Left line
renderer.drawLine(x, y, x, y + batteryHeight - 1);
// Battery end
renderer.drawLine(x + batteryWidth - 4, y, x + batteryWidth - 4, y + batteryHeight - 1);
renderer.drawLine(x + batteryWidth - 3, y + 2, x + batteryWidth - 1, y + 2);
renderer.drawLine(x + batteryWidth - 3, y + batteryHeight - 3, x + batteryWidth - 1, y + batteryHeight - 3);
renderer.drawLine(x + batteryWidth - 1, y + 2, x + batteryWidth - 1, y + batteryHeight - 3);
// The +1 is to round up, so that we always fill at least one pixel
int filledWidth = percentage * (batteryWidth - 5) / 100 + 1;
if (filledWidth > batteryWidth - 5) {
filledWidth = batteryWidth - 5; // Ensure we don't overflow
}
renderer.fillRect(x + 1, y + 1, filledWidth, batteryHeight - 2);
}

6
src/activities/util/Window.h Normal file
View File

@ -0,0 +1,6 @@
#pragma once
#include <GfxRenderer.h>
void drawWindowFrame(GfxRenderer& renderer, int xMargin, int y, int height, bool hasShadow, const char* title);
void drawFullscreenWindowFrame(GfxRenderer& renderer, const char* title);
void drawStatusBar(GfxRenderer& renderer);