How to draw bitmap buffer?

[meouwu]

I need to draw bitmap from memory/stream on LCUI gui. On Windows, I can draw it after LCUI's painting via GDI device context, but I need draw them in order.

• e.g LCUI gui -> my drawing -> LCUI popup/widget

LCUI_Widget root, button;

int main()
{
    ...
    LCUI_Init();
    ...
}
             // bitmap format
void onPaint(const void *buffer, int width, int height ...
{
    drawBitmap(buffer, width, height ...
    setOntop(button ...
}

• I found many functions.
• Are they right, how to use them?

https://github.com/lc-soft/LCUI/blob/0ba3e1e70d310672e1ddbff3d45fcf07eb43d19e/include/LCUI/draw/background.h#L42-L44

https://github.com/lc-soft/LCUI/blob/0ba3e1e70d310672e1ddbff3d45fcf07eb43d19e/include/LCUI/painter.h#L33-L37

https://github.com/lc-soft/LCUI/blob/0ba3e1e70d310672e1ddbff3d45fcf07eb43d19e/include/LCUI/surface.h#L79-L88

[lc-soft]

You want draw a bitmap on the button widget?

• The Surface_BeginPaint() and Surface_EndPaint() functions are used for framebuffer operations. After an region is rendered, they are called to fill the bitmap into the framebuffer.
• LCUIPainter_Begin() is used to create a region reference in the framebuffer, Let the rendered content only output to this region.

These are the underlying drawing operations, and I think you should draw bitmap in the widget layer.

Maybe you can refer to these code snippets:

• Widget drawing process https://github.com/lc-soft/LCUI/blob/0ba3e1e70d310672e1ddbff3d45fcf07eb43d19e/src/gui/widget_paint.c#L263-L274
• Custom drawing content of the textview widget https://github.com/lc-soft/LCUI/blob/0ba3e1e70d310672e1ddbff3d45fcf07eb43d19e/src/gui/widget/textview.c#L425-L450
• Drawing method, support partial region drawing, bitmap data is filled to paint->canvas.bytes https://github.com/lc-soft/LCUI/blob/0ba3e1e70d310672e1ddbff3d45fcf07eb43d19e/src/draw/background.c#L35-L97
• paint->canvas.bytes can be set to value of HBITMAP object by SetBitmapBits() https://github.com/lc-soft/LCUI/blob/0ba3e1e70d310672e1ddbff3d45fcf07eb43d19e/src/platform/windows/windows_display.c#L365-L388

[meouwu]

I don't wanna change this source. Can you give me many APIs to draw bitmap on the button widget?

[lc-soft]

@linhuyen

I don't wanna change this source.

I did not ask you to modify the code. I just use code snippets to describe the rendering process. you can use these code snippets as documents and add your own code.

Can you give me many APIs to draw bitmap on the button widget?

No many APIs. You need to manually write code to operate the pixel data of bitmap.

This is a sample code and it doesn't work, you can evaluate the need to continue to develop.

LCUI_WidgetPrototype my_button_proto;

void DrawYourBitmap(unsigned char *buffer, int x, int y, int width, int height,
            ...)
{
    // Call your graphic API
}

void MyButton_OnPaint(LCUI_Widget w, LCUI_PaintContext paint,
              LCUI_WidgetActualStyle style)
{
    int x, y;
    LCUI_Graph canvas;
    LCUI_Rect content_rect, rect;

    // Calculate content rectangle
    content_rect.width = style->content_box.width;
    content_rect.height = style->content_box.height;
    content_rect.x = style->content_box.x - style->canvas_box.x;
    content_rect.y = style->content_box.y - style->canvas_box.y;
    // Check if content rectangle is in the redraw rectangle
    if (!LCUIRect_GetOverlayRect(&content_rect, &paint->rect, &rect)) {
        return;
    }
    // The position of your bitmap relative to the redraw rectangle
    x = content_rect.x - rect.x;
    y = content_rect.y - rect.y;
    DrawYourBitmap(paint->canvas.argb,
               x, y,
               style->content_box.width,
               style->content_box.height,
               content_rect.x, content_rect.y,
               content_rect.width, content_rect.height,
               paint->rect.x, paint->rect.y,
               paint->rect.width, paint->rect.height);
}

void InstallMyButton()
{
    my_button_proto = LCUIWidget_NewPrototype("mybutton", NULL);
    my_button_proto->paint = MyButton_OnPaint;
}

[lc-soft]

I don't want to take the time to introduce how to use LCUI. If you feel that it is difficult to use, I suggest you use other mature GUI libraries.

[meouwu]

I hope canvas widget will be supported, in next version. Thanks, LCUI is awesome!

[lc-soft]

I hope canvas widget will be supported, in next version.

This is a feature request, you can open a new issue and describe in detail what you need, including the following:

• What do you want to draw?
• What problems did you encounter when drawing these content?
• What API do you want to have? Please give sample code to show how they are used

[lc-soft]

The current drawing method is to use a dirty rectangle to mark the redraw region, All widget drawing methods need to support partial redrawing, The calculation of the redraw region is troublesome, I will consider adding a flag to turn this feature off for a specific widget.