diff --git a/examples/common.nim b/examples/common.nim index c1eb738..3ded1b7 100644 --- a/examples/common.nim +++ b/examples/common.nim @@ -126,11 +126,12 @@ proc cpToUtf8*(code: int): string = return res -let Colors: tuple[Red, Green, Blue, Yellow, Orange, Purple, White, Grey, Black: Color] = +let Colors: tuple[Red, Green, Blue, LightBlue, Yellow, Orange, Purple, White, Grey, Black: Color] = ( Red: rgb(231, 64, 74), Green: rgb(40, 184, 115), - Blue: rgb(43, 183, 209), + Blue: rgb(29, 100, 210), + LightBlue: rgb(43, 183, 209), Yellow: rgb(243, 203, 57), Orange: rgb(255, 130, 76), Purple: rgb(97, 18, 204), @@ -150,10 +151,11 @@ proc defaultButtonStyle(fillColor: Color): StyleConfig {.inline.} = paddingTop: 5.0, paddingBottom: 5.0, iconFont: "fa", + icon: some(Icon.Bacteria), fontBlur: 0.0, font: "sans-bold", fontSize: 20.0, - fontColor: rgba(255, 255, 255, 160), + fontColor: rgb(200, 200, 200), hasFontShadow: true, fontShadowColor: rgba(0, 0, 0, 160), fontShadowXOffset: 0.0, @@ -164,16 +166,18 @@ proc defaultButtonStyle(fillColor: Color): StyleConfig {.inline.} = shadowColor: rgba(0, 0, 0, 90), shadowXOffset: 3.0, shadowYOffset: 3.0, + fillColor: fillColor, gradientStartColor: rgba(255, 255, 255, if fillColor.isBlack: 16 else: 32), gradientEndColor: rgba(0, 0, 0, if fillColor.isBlack: 16 else: 32), textAlignments: @[Alignment.Center, Alignment.Middle] ) -let DefaultButtonStyles: tuple[Red, Green, Blue, Yellow, Orange, Purple, White, Grey, Black: StyleConfig] = +let DefaultButtonStyles: tuple[Red, Green, Blue, LightBlue, Yellow, Orange, Purple, White, Grey, Black: StyleConfig] = ( Red: defaultButtonStyle(Colors.Red), Green: defaultButtonStyle(Colors.Green), Blue: defaultButtonStyle(Colors.Blue), + LightBlue: defaultButtonStyle(Colors.LightBlue), Yellow: defaultButtonStyle(Colors.Yellow), Orange: defaultButtonStyle(Colors.Orange), Purple: defaultButtonStyle(Colors.Purple), @@ -226,13 +230,17 @@ proc drawButton*(vg: Context, text: string, x, y: float, style: StyleConfig = De let textWidth = textBounds.horizontalAdvance let height = (textBounds.bounds.ymax - textBounds.bounds.ymin) + style.paddingTop + style.paddingBottom - vg.setFontSize(height * 0.5) + vg.setFontSize((style.fontSize*2) / 3) vg.setFont(style.iconFont) - let iconBounds = vg.textBounds($style.icon, 0, 0) - var iconWidth = iconBounds.horizontalAdvance - # iconWidth += height*0.15 + var iconBounds: TextBounds + var iconWidth = 0.0 + var width = style.paddingLeft + style.paddingRight + textWidth + if style.icon.isSome: + iconBounds = vg.textBounds($style.icon.get, 0, 0) + iconWidth = iconBounds.horizontalAdvance + iconWidth += height * 0.15 - let width = textWidth + iconWidth + style.paddingLeft + style.paddingRight + width += iconWidth let bg = vg.linearGradient( x, y, x, y+height, @@ -240,8 +248,6 @@ proc drawButton*(vg: Context, text: string, x, y: float, style: StyleConfig = De style.gradientEndColor ) - let color = style.fillColor - let shadowColor = style.shadowColor let lightWidth = style.highlightWidth if style.hasShadow: @@ -262,8 +268,10 @@ proc drawButton*(vg: Context, text: string, x, y: float, style: StyleConfig = De style.cornerRadiusTopLeft, style.cornerRadiusTopRight, style.cornerRadiusBottomRight, style.cornerRadiusBottomLeft ) - vg.setFillColor(style.fillColor) - vg.pathFill() + + if not isBlack(style.fillColor): + vg.setFillColor(style.fillColor) + vg.pathFill() vg.setFillPaint(bg) vg.pathFill() @@ -275,10 +283,24 @@ proc drawButton*(vg: Context, text: string, x, y: float, style: StyleConfig = De vg.pathLineTo(x+width-(style.cornerRadiusBottomLeft), y+lightWidth+1) vg.pathStroke() + if style.icon.isSome: + vg.setFontSize((style.fontSize*2) / 3) + vg.setFont(style.iconFont) + vg.textAlign(style.textAlignments) + if style.hasFontShadow: + vg.setFillColor(style.fontShadowColor) + vg.text($style.icon.get, x + width/2 - textWidth/2, y + height/2 + 1) + vg.setFillColor(style.fontColor) + vg.text($style.icon.get, x + width/2 - textWidth/2, y + height/2) + + vg.setFontSize(style.fontSize) vg.setFont(style.font) vg.textAlign(style.textAlignments) + if style.hasFontShadow: + vg.setFillColor(style.fontShadowColor) + vg.text(text, x + width/2 + iconWidth/2, y + height/2 + 1) vg.setFillColor(style.fontColor) - vg.text(text, x + width, y + height - 1) + vg.text(text, x + width/2 + iconWidth/2, y + height/2) proc drawButton*(vg: Context, preicon: Icon, text: string, x, y, w, h: float, color: Color) = diff --git a/examples/resources/fa.ttf b/examples/resources/fa.ttf old mode 100755 new mode 100644 index c6c3dd4..7c59512 Binary files a/examples/resources/fa.ttf and b/examples/resources/fa.ttf differ diff --git a/nanovg.nimble b/nanovg.nimble index 358b60b..5bab257 100644 --- a/nanovg.nimble +++ b/nanovg.nimble @@ -13,7 +13,8 @@ requires "nim >= 1.0.6", "opengl >= 1.2.6", "sdl2#head", "https://github.com/jyapayne/nim-glew#head", - "https://github.com/jyapayne/nim-glfw#head" + "https://github.com/jyapayne/nim-glfw#head", + "zip#0.3.1" import os