Drawing things with transparency (widgets and fl_draw.H functions)

[Gonzalo Garramuño]

I am interested in drawing things with transparency in FLTK, ideally on
all platforms.  I would like to draw both widgets and shapes.

Besides OpenGL (which I would like to avoid as I need to draw FLTK
widgets with resizing too) and Cairo (which is Linux only), what are my
current fltk1.4 alternatives?


--
Gonzalo Garramuño
ggar...@gmail.com

[holm.h...@gmail.com]

Hi,

I think FLTK is a little limited on this. If transparent colors was implemented, I think that would make it easier to make more modern-looking applications.

Best regards
Håvard

[Evan Laforge]

I wanted a transparent rectangle for a selection box, and wound up implementing as creating a colored Fl_RGB_Image and blitting in the desired place. I thought it would be slow, and maybe it would be if used more extensively, but it's worked ok for me.

Otherwise to do a selection in fltk I guess you must use a opaque one and draw at the right layer. 

--
You received this message because you are subscribed to the Google Groups "fltk.general" group.
To unsubscribe from this group and stop receiving emails from it, send an email to fltkgeneral...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/fltkgeneral/8bb9ef73-398a-4ca1-ae1d-e248952b6277n%40googlegroups.com.

[Greg Ercolano]

On 7/15/24 07:34, Gonzalo Garramuño wrote:

I am interested in drawing things with transparency in FLTK, ideally on all platforms.  I would like to draw both widgets and shapes.

    Hmm, I missed this entire thread because for some reason all of it was caught by gmail's spam catcher.

    Since PNG and SVG supports alpha channels, I've played around with using Fl_PNG_Image and Fl_SVG_Image to render graphics/widgets to get smooth antialiased overlays.. some examples:

    [1] Alpha Blending with PNG files
    https://www.seriss.com/people/erco/fltk/#AlphaBlend

    [2] A multicolored bargraph widget
    https://www.seriss.com/people/erco/fltk/#MultiColorBarGraph

    [3] A commercial aircraft altimeter FLTK widget
    https://www.seriss.com/people/erco/fltk/#Altimeter

    [4] A working analog Simplex clock using nanoSVG
    https://www.seriss.com/people/erco/fltk/#FLTK-Simplex-Clock

    What's demonstrated above:

    [1] PNG files with alpha channel (transparency) lines drawn in GIMP are loaded and overlaid, showing how the alpha channels allow simple smooth compositing.

    [2] shows how to make a widget that takes advantage of transparency to render antialiased bar graphs by drawing small PNG images to combine into graphs, similar to the techniques one might use with HTML or with sprites.

    [3] shows an attempt at realism to render an analog mechanical altimeter, again using PNGs with transparency to handle shadows and compositing.

    [4] uses SVG to render antialiased lines for an analog clock. Since SVG files are basically ASCII commands kinda/sorta similar to PostScript (but without the procedural programming features), the SVG data can be regenerated easily using sprintf() to replace floating point variable values, such as floating point rotation degrees, offsets, opacities, etc.

    If I had time, I'd probably explore more with abusing SVG to render antialiased geometry, as it seems to be both fast and flexible in the same way PostScript is.

    Perahps someday fl_draw_image()'s depth argument can be set to 4 to allow for an alpha channel for pixel rendering, but my read of the 1.4.x docs seems to indicate a depth of 4 or above, the "extra" bytes have to be zero, so apparently alpha is not yet supported in fl_draw_image().

    Still, SVG seems the best bet, since it supports antialiased line drawing and shape drawing with rotations and scaling and such, which brings a whole bunch of features to simple FLTK rendering (non-openGL, non-cairo dependent).

[Manolo]

Le samedi 3 août 2024 à 03:29:30 UTC+2, er...@seriss.com a écrit :

    Perhaps someday fl_draw_image()'s depth argument can be set to 4 to allow for an alpha channel for pixel rendering, but my read of the 1.4.x docs seems to indicate a depth of 4 or above, the "extra" bytes have to be zero, so apparently alpha is not yet supported in fl_draw_image().

Some more information on this subject: fl_draw_image() in general doesn't take into account transparency information present

in the data, but not always: the macOS platform does draw with transparency. Whatever the platform, it's simple to create a

depth-4 Fl_RGB_Image object from a byte array containing an alpha channel and to draw that object. This draws with transparency.