khchen / wNim

Nim's Windows GUI Framework
MIT License
327 stars 17 forks source link

How to set transparency #55

Closed BugFix closed 4 years ago

BugFix commented 4 years ago

I want to have an statictext on a bitmap, but transparent. How can I do this? I've tried:

let staticbitmap = StaticBitmap(panel, bitmap=Bitmap(myImage)) let staticText = StaticText(staticbitmap, label="Hello, World!", style=wTransparentWindow) # doesn't work # create staticText with default style and sets the transparency fails too: staticText.setTransparent(120)

Any ideas?

khchen commented 4 years ago

You can deal with wEvent_Paint event and try to paint what you want. For example:

import wNim/[wApp, wFrame, wPanel, wBitmap, wPaintDC, wFont]

var
  app = App()
  frame = Frame(title = "Demo")
  panel = Panel(frame)
  bitmap = Bitmap(r"release\examples\images\logo.png")

panel.wEvent_Paint do ():
  var
    dc = PaintDC(panel)
    rect = (0, 0, bitmap.size.width, bitmap.size.height)

  dc.backgroundTransparent = true
  dc.font = Font(18)
  dc.drawBitmap(bitmap)
  dc.drawLabel("Hello, World", rect, wRight or wBottom)

frame.center()
frame.show()
app.mainLoop()
BugFix commented 4 years ago

Thank you. That helps a lot. btw: I love wNim, an impressive work.

EDIT: OK, that was a very good hint. But I want to have the full functionality of an StaticText (resizable, assign a cursor, detect a click/doubleclick). With your solution, I was able to implement resizing and transparency for the StaticText, cursor assignment and click detection works too.

import wNim/[wApp, wFrame, wPanel, wBitmap, wStaticBitmap, wStaticText, wImage, 
             wPaintDC, wFont, wCursor, wTextEntryDialog]

var
  app = App()
  frame = Frame(title = "Demo")
  panel = Panel(frame)
  mybitmap = Bitmap(r"release\examples\images\logo.png")

let staticbitmap = StaticBitmap(panel, bitmap=mybitmap)

let staticText = StaticText(staticbitmap, label="Hello, World!")
staticText.font = Font(14, family=wFontFamilySwiss, weight=wFontWeightBold)
staticText.cursor = wHandCursor
staticText.fit()

proc layout() =
  panel.layout:
    staticText:
      centerX = panel.centerX
      centerY = panel.centerY 

staticText.wEvent_Paint do ():
  var
    dc = PaintDC(staticText)
    rect = (0, 0, staticText.getBestSize().width, staticText.getBestSize().height)

  dc.backgroundTransparent = true
  dc.font = staticText.getFont()
  dc.drawLabel(staticText.label, rect, wCenter)

staticText.wEvent_CommandLeftClick do ():
  echo "LEFT CLICKED"

panel.wEvent_Size do ():
  layout()

layout()
frame.center()
frame.show()
app.mainLoop()

Thanks again.