From c52de289ea3be7fa77ad8edc95242f9077ed253c Mon Sep 17 00:00:00 2001 From: Leonard Ritter Date: Mon, 14 Jul 2014 13:41:12 +0200 Subject: [PATCH] blendish: support for beveled panels --- blendish.h | 37 ++++++++++++++++++++++++++++++++++--- example.cpp | 17 +++++++++++++++-- 2 files changed, 49 insertions(+), 5 deletions(-) diff --git a/blendish.h b/blendish.h index ede6e12..6cb7dce 100644 --- a/blendish.h +++ b/blendish.h @@ -389,7 +389,11 @@ void bndRoundedBox(NVGcontext *ctx, float x, float y, float w, float h, // Draw a flat panel without any decorations at position (x,y) with size (w,h) // and fills it with backgroundColor void bndBackground(NVGcontext *ctx, float x, float y, float w, float h); - + +// Draw a beveled border at position (x,y) with size (w,h) shaded with +// lighter and darker versions of backgroundColor +void bndBevel(NVGcontext *ctx, float x, float y, float w, float h); + // Draw a lower inset for a rounded box at position (x,y) with size (w,h) // that gives the impression the surface has been pushed in. // cr2 and cr3 contain the radiuses of the bottom right and bottom left @@ -495,8 +499,10 @@ void bndUpDownArrow(NVGcontext *ctx, float x, float y, float s, NVGcolor color); // alpha intensity of transparent items (0xa4) #define BND_TRANSPARENT_ALPHA 0.643 -// shade intensity of beveled insets +// shade intensity of beveled panels #define BND_BEVEL_SHADE 30 +// shade intensity of beveled insets +#define BND_INSET_BEVEL_SHADE 30 // shade intensity of hovered inner boxes #define BND_HOVER_SHADE 15 @@ -1014,6 +1020,31 @@ NVGcolor bndOffsetColor(NVGcolor color, int delta) { ):color; } +void bndBevel(NVGcontext *ctx, float x, float y, float w, float h) { + nvgStrokeWidth(ctx, 1); + + x += 0.5f; + y += 0.5f; + w -= 1; + h -= 1; + + nvgBeginPath(ctx); + nvgMoveTo(ctx, x, y+h); + nvgLineTo(ctx, x+w, y+h); + nvgLineTo(ctx, x+w, y); + nvgStrokeColor(ctx, bndTransparent( + bndOffsetColor(bnd_theme.backgroundColor, -BND_BEVEL_SHADE))); + nvgStroke(ctx); + + nvgBeginPath(ctx); + nvgMoveTo(ctx, x, y+h); + nvgLineTo(ctx, x, y); + nvgLineTo(ctx, x+w, y); + nvgStrokeColor(ctx, bndTransparent( + bndOffsetColor(bnd_theme.backgroundColor, BND_BEVEL_SHADE))); + nvgStroke(ctx); +} + void bndBevelInset(NVGcontext *ctx, float x, float y, float w, float h, float cr2, float cr3) { float d; @@ -1029,7 +1060,7 @@ void bndBevelInset(NVGcontext *ctx, float x, float y, float w, float h, nvgArcTo(ctx, x,y+h, x,y, cr3); NVGcolor bevelColor = bndOffsetColor(bnd_theme.backgroundColor, - BND_BEVEL_SHADE); + BND_INSET_BEVEL_SHADE); nvgStrokeWidth(ctx, 1); nvgStrokePaint(ctx, diff --git a/example.cpp b/example.cpp index 0b34ac4..69f1e10 100644 --- a/example.cpp +++ b/example.cpp @@ -36,6 +36,8 @@ typedef enum { ST_ROW = 5, // check button ST_CHECK = 6, + // panel + ST_PANEL = 7, } SubType; typedef struct { @@ -124,6 +126,9 @@ void drawUI(NVGcontext *vg, int item, int x, int y) { default: { testrect(vg,rect); } break; + case ST_PANEL: { + bndBevel(vg,rect.x,rect.y,rect.w,rect.h); + } break; case ST_LABEL: { assert(head); const UIButtonData *data = (UIButtonData*)head; @@ -321,6 +326,13 @@ void columnhandler(int parent, UIevent event) { uiSetMargins(item, 0, (last < 0)?0:1, 0, 0); } +int panel() { + int item = uiItem(); + UIData *data = (UIData *)uiAllocData(item, sizeof(UIData)); + data->subtype = ST_PANEL; + return item; +} + int column(int parent) { int item = uiItem(); uiSetHandler(item, columnhandler, UI_APPEND); @@ -582,13 +594,14 @@ void draw(NVGcontext *vg, float w, float h) { uiClear(); - int root = uiItem(); + int root = panel(); // position root element uiSetLayout(0,UI_LEFT|UI_TOP); uiSetMargins(0,600,10,0,0); uiSetSize(0,250,400); - int col = column(0); + int col = column(root); + uiSetMargins(col, 10, 10, 10, 10); uiSetLayout(col, UI_TOP|UI_HFILL); button(col, 1, BND_ICONID(6,3), "Item 1", demohandler);