Commit graph

30 commits

Author SHA1 Message Date
Hermet Park
afd780bfa9 wg_engine: set default file permissions 644 for consistency 2025-03-27 22:19:36 +09:00
Sergii Liebodkin
9a2d1136de wg_engine: Introduce fill effect for webgpu renderer
Issue: https://github.com/thorvg/thorvg/issues/3054
2025-02-27 12:15:42 +09:00
Sergii Liebodkin
64ed756c2c wg_engine: Introduce drop shadow effect for webgpu renderer
Issue: https://github.com/thorvg/thorvg/issues/3054
Supported color, angle, distance, sigma, quality params
2025-02-25 11:54:04 +09:00
Sergii Liebodkin
37992b52c9 webgpu_gaussian_optimization
wg_engine: optimize gaussian blur effect for webgpu renderer

Issue: https://github.com/thorvg/thorvg/issues/3054
2025-02-13 12:52:40 +09:00
Sergii Liebodkin
857f1404e1 wg_engine: gaussian blur basic implementation
Introduce blur effect for webgpu renderer
Issue: https://github.com/thorvg/thorvg/issues/3054
2025-02-06 14:44:08 +09:00
Hermet Park
a12accbc93 updated copyright 2025-01-03 14:32:31 +09:00
Sergii Liebodkin
0815366763 wg_engine: clippath optimization
Full review of clipping workflow.

Before we are used separate render target for each clip path and compute shader to find clip path intersections with AND logic.
Now we are using depth buffer and transactions from depth to stencil and back to get AND logic intersections,
Compute shaders, layouts and pipelines was removed
2024-10-24 17:49:17 +09:00
Sergii Liebodkin
81cb7da9f3 wg_engine: MSAA support, part 1 - move blending to fragment shaders
Apply custom blending using fragment shaders instead of compute shaders.
2024-10-17 18:00:15 +09:00
Sergii Liebodkin
732a2be7e8 wg_engine: scene blending optimization
- used hardware blending stage for scene blending
- used AABB for scene blending
- reduced number of offfscreen buffers coping
- reduced number of render pass switching
- used render pipelines abilities to convert offscreen pixel format to screen pixel format
- removed unused shaders
2024-08-28 18:33:07 +09:00
Sergii Liebodkin
0787e46635 wg_engine: aabb based masking optimization
* used fragment shaders for mask applience instead of compute shaders
* less render targets swithing
* shape aabb based on transformed shape bbox
2024-08-20 16:23:31 +09:00
Sergii Liebodkin
88b4f75e4f webgpu: shaders refactoring
Deep shader refactoring for the following purposes:
* used pre-calculated gradient texture instead of per-pixel gradient map computation
* used HW wrap samples for fill spread setting
* unified gradient shader types
* used single shader module for composition instead of signle module per composition type
* used single shader module for blending for each of fill type (solid, gradient, image) instaed of signle module per blend type
* much easier add new composition and blend equations
* get rided std::string uasge
* shaders code is more readable
2024-08-13 11:52:45 +03:00
Sergii Liebodkin
132b22cb47 webgpu: light/dark mask mode support
[issues 2608: light/dark mask](#2608)

* CompositeMethod::LightMask
* CompositeMethod::DarkMask
2024-08-10 13:19:30 +09:00
Sergii Liebodkin
a4bbf14371 wg_engine: composition and blend optimization
* bind groups creation in real time removed - performance boost
* blend and composition shaders decomposed - performance boost
* shader modules and pipeline layouts generalized - less memory usage
* shared single stencil buffer used - less memory usage
* bind groups usage simplified
* general context API simplified and generalized
* all rendering logic moved into new composition class
* ready for hardware MSAA (in next steps)
* ready for direct mask applience (in next steps)
2024-08-09 14:30:17 +09:00
Sergii Liebodkin
6cd745dd2e wg_engine: emscripten and browser support
[issues 2410: emscripten support](https://github.com/thorvg/thorvg/issues/2410)
- Research and prototype the Emscripten build with WebGPU.

meson setup script:
   meson setup builddir -Ddefault_library=static -Dloaders=all -Dsavers="all" -Dbindings="wasm_beta" -Dengines="wg_beta" --cross-file ./cross/wasm_webgpu.txt
2024-08-01 14:20:08 +09:00
Sergii Liebodkin
2c948a33d3 wg_engine: ClipPath support
[issues 1479: ClipPath](#1479)

Supports ClipPath composition.
Clip path composition is an only composition type who doesn't ignore blend method.
Clip path is a combination of composition approach and blend approach using compute shader
2024-07-16 00:01:47 +09:00
Sergii Liebodkin
8c4102362f wg_engine: fix masking methods support
See Masking, InvMasking, LumaMasking, InvLumaMasking, MaskingMethods examples

sw/webgpu
2024-07-09 22:02:30 +09:00
Sergii Liebodkin
e7e6839571
wg_engine: fix blend methods support
Full review of blending support.
Support Solid color, Gradient fill and Image blending workflows

See Blending, SceneBlending, Opacity examples
2024-07-04 16:19:50 +09:00
Sergii Liebodkin
a532ac3eb2 wg_engine: blending and composition optimization
[issues 1479: Masking, InvMasking, LumaMasking, InvLumaMasking](#1479)

Computes composition and blending using simgle pass istead of two full screen passes
2024-04-29 16:36:00 +09:00
Sergii Liebodkin
1794ec0924 wg_engine: antialiasing
[issues 1479: antialiasing](#1479)

Anti-aliasing implementation
Implements antialiasing as a post process on cimpute shaders and original render target with scale of 2x.
Can be modified as an external settings
2024-03-04 19:33:34 +09:00
Sergii Liebodkin
e1f6572bde wg_engine: clenup shader sources
Remove unused composition/blending shader sources
2024-02-05 10:46:01 +09:00
Sergii Liebodkin
6b6947f679 wg_engine: introduced blending
[issues 1479: blending](#1479)

Supported blend settings:

    Normal
    Add
    Screen
    Multiply
    Overlay
    Difference
    Exclusion
    SrcOver
    Darken
    Lighten
    ColorDodge
    ColorBurn
    HardLight
    SoftLight
2024-01-30 11:49:20 +09:00
Sergii Liebodkin
4f528d45f5
wg_engine: introduced compute pipeline entities
introduces posibility to create compute pipelines
does not affect functionality
2024-01-23 18:08:26 +09:00
Sergii Liebodkin
45368c319e wg_engine: introduced composition ability
[issues 1479: Masking](#1479)

Supported composition methods:

    AlphaMask
    InvAlphaMask
    LumaMask
    InvLumaMask
    AddMask
    SubtractMask
    IntersectMask
    DifferenceMask

Usage example:

    //Solid Rectangle
    auto shape = tvg::Shape::gen();
    shape->appendRect(0, 0, 400, 400);
    shape->fill(0, 0, 255);

    //Mask
    auto mask = tvg::Shape::gen();
    mask->appendCircle(200, 200, 125, 125);
    mask->fill(255, 255, 255);        //AlphaMask RGB channels are unused.

    //Nested Mask
    auto nMask = tvg::Shape::gen();
    nMask->appendCircle(220, 220, 125, 125);
    nMask->fill(255, 255, 255);       //AlphaMask RGB channels are unused.

    mask->composite(std::move(nMask), tvg::CompositeMethod::AlphaMask);
    shape->composite(std::move(mask), tvg::CompositeMethod::AlphaMask);
    canvas->push(std::move(shape));

    //Star
    auto star = tvg::Shape::gen();
    star->fill(80, 80, 80);
    star->moveTo(599, 34);
    star->lineTo(653, 143);
    star->lineTo(774, 160);
    star->lineTo(687, 244);
    star->lineTo(707, 365);
    star->lineTo(599, 309);
    star->lineTo(497, 365);
    star->lineTo(512, 245);
    star->lineTo(426, 161);
    star->lineTo(546, 143);
    star->close();
    star->strokeWidth(30);
    star->strokeJoin(tvg::StrokeJoin::Miter);
    star->strokeFill(255, 255, 255);

    //Mask3
    auto mask3 = tvg::Shape::gen();
    mask3->appendCircle(600, 200, 125, 125);
    mask3->fill(255, 255, 255);       //AlphaMask RGB channels are unused.
    mask3->opacity(200);
    star->composite(std::move(mask3), tvg::CompositeMethod::AlphaMask);
    if (canvas->push(std::move(star)) != tvg::Result::Success) return;
2024-01-15 17:33:59 +09:00
Jinny You
2c6c8d3b21
updated copyright date (#1866) 2023-12-28 10:43:25 +09:00
Sergii Liebodkin
323b615f0d wg_engine: Added shape opacity value usage
[issues 1479: Opacity](#1479)

Usage example:

    // prepare a shape (Rectangle + Rectangle + Circle + Circle) with opacity
    auto shape1 = tvg::Shape::gen();
    shape1->appendRect(0, 0, 200, 200);                //x, y, w, h
    shape1->appendRect(100, 100, 300, 300, 100, 100);  //x, y, w, h, rx, ry
    shape1->appendCircle(400, 400, 100, 100);          //cx, cy, radiusW, radiusH
    shape1->appendCircle(400, 500, 170, 100);          //cx, cy, radiusW, radiusH
    shape1->fill(255, 255, 0);                         //r, g, b
    shape1->opacity(128)                               //opacity
    canvas->push(std::move(shape1));
2023-12-21 09:43:33 +09:00
Sergii Liebodkin
e2458570f8 wg_engine: pipelines and bind groups refactoring
- shader and system types synchronized
- pipelens and bind groups description separated
- pipelines description simplified
2023-12-18 22:45:13 +09:00
Sergii Liebodkin
25513b591a wg_engine: introduced images drawing support
[issues 1479: pictures](https://github.com/thorvg/thorvg/issues/1479)

    auto picture = tvg::Picture::gen();
    picture->load("images/test.png");
    picture->translate(0, 0);
    picture->size(100, 100);
    picture->opacity(255);
    canvas->push(std::move(picture));
2023-11-17 19:34:32 +09:00
SergeyLebedkin
8200bc5fc3
wg_engine: Added a feature to draw multiple radial gradient filled shapes 2023-10-24 18:24:16 +09:00
Sergii Liebodkin
94eabc609c wg_engine: Added ability to draw multiple linear gradient filled shapes
[issues 1479: LinearGradient](thorvg#1479)

In order to build you need third party libraries. Before you start please read this: [LearnWebGPU](https://eliemichel.github.io/LearnWebGPU/getting-started/hello-webgpu.html)

Usage example:

    // init glfw
    glfwInit();

    // create a windowed mode window and its opengl context
    glfwWindowHint(GLFW_CLIENT_API, GLFW_NO_API);
    GLFWwindow* window = glfwCreateWindow(800, 800, "WebGPU base app", nullptr, nullptr);

    // get window size
    int width{}, height{};
    glfwGetWindowSize(window, &width, &height);

    // init engine webgpu
    tvg::Initializer::init(tvg::CanvasEngine::Wg, 0);

    // create wg canvas
    auto canvasWg = tvg::WgCanvas::gen();
    canvas_wg->target(glfwGetWin32Window(window), width, height);

    // gradient color stops
    tvg::Fill::ColorStop colorStops[2];
    colorStops[0] = {0, 0, 0, 0, 255};
    colorStops[1] = {1, 255, 255, 255, 255};
    // linear gradient
    auto fill = tvg::LinearGradient::gen();
    fill->linear(0, 0, 400, 400);
    fill->colorStops(colorStops, 2);
    // prepare rectangle
    auto shape1 = tvg::Shape::gen();
    shape1->appendRect(0, 0, 400, 400); //x, y, w, h
    shape1->fill(std::move(fill));
    canvas_wg->push(std::move(shape1));

    // gradient color stops
    tvg::Fill::ColorStop colorStops2[3];
    colorStops2[0] = { 0, 255, 0, 0, 255 };
    colorStops2[1] = { 0.5, 255, 255, 0, 255 };
    colorStops2[2] = { 1, 255, 255, 255, 255 };
    // linear gradient
    auto fill2 = tvg::LinearGradient::gen();
    fill2->linear(400, 200, 400, 600);
    fill2->colorStops(colorStops2, 3);
    // prepare circle
    auto shape2 = tvg::Shape::gen();
    shape2->appendCircle(400, 400, 200, 200); //cx, cy, radiusW, radiusH
    shape2->fill(std::move(fill2));
    canvas_wg->push(std::move(shape2));

    // gradient color stops
    tvg::Fill::ColorStop colorStops3[4];
    colorStops3[0] = { 0, 0, 127, 0, 127 };
    colorStops3[1] = { 0.25, 0, 170, 170, 170 };
    colorStops3[2] = { 0.5, 200, 0, 200, 200 };
    colorStops3[3] = { 1, 255, 255, 255, 255 };
    // linear gradient
    auto fill3 = tvg::LinearGradient::gen();
    fill3->linear(450, 600, 750, 600);
    fill3->colorStops(colorStops3, 4);
    // prepare ellipse
    auto shape3 = tvg::Shape::gen();
    shape3->appendCircle(600, 600, 150, 100); //cx, cy, radiusW, radiusH
    shape3->fill(std::move(fill3));
    canvas_wg->push(std::move(shape3));

    while (!glfwWindowShouldClose(window)) {
        // webgpu
        canvas_wg->draw();
        canvas_wg->sync();

        // pull events
        glfwPollEvents();
    }

    // terminate engine and window
    tvg::Initializer::term(tvg::CanvasEngine::Wg);
    glfwDestroyWindow(window);
    glfwTerminate();
2023-10-23 18:05:56 +09:00
Sergii Liebodkin
14b2508cd1 wg_engine: Added ability to draw multiple solid color filled shapes
[issues 1479: Shape](https://github.com/thorvg/thorvg/issues/1479)

In order to build you need third party libraries. Before you start please read this: [LearnWebGPU](https://eliemichel.github.io/LearnWebGPU/getting-started/hello-webgpu.html)

Usage example:

    // init glfw
    glfwInit();

    // create a windowed mode window and its opengl context
    glfwWindowHint(GLFW_CLIENT_API, GLFW_NO_API);
    GLFWwindow* window = glfwCreateWindow(800, 800, "WebGPU base app", nullptr, nullptr);

    // get window size
    int width{}, height{};
    glfwGetWindowSize(window, &width, &height);

    // init engine webgpu
    tvg::Initializer::init(tvg::CanvasEngine::Wg, 0);

    // create wg canvas
    auto canvasWg = tvg::WgCanvas::gen();
    canvas_wg->target(glfwGetWin32Window(window), width, height);

    // prepare a shape (Rectangle + Rectangle + Circle + Circle)
    auto shape1 = tvg::Shape::gen();
    shape1->appendRect(0, 0, 200, 200);                //x, y, w, h
    shape1->appendRect(100, 100, 300, 300, 100, 100);  //x, y, w, h, rx, ry
    shape1->appendCircle(400, 400, 100, 100);          //cx, cy, radiusW, radiusH
    shape1->appendCircle(400, 500, 170, 100);          //cx, cy, radiusW, radiusH
    shape1->fill(255, 255, 0);                         //r, g, b

    canvas_wg->push(std::move(shape1));

    while (!glfwWindowShouldClose(window)) {
        // webgpu
        canvas_wg->draw();
        canvas_wg->sync();

        // pull events
        glfwPollEvents();
    }

    // terminate engine and window
    tvg::Initializer::term(tvg::CanvasEngine::Wg);
    glfwDestroyWindow(window);
    glfwTerminate();
2023-10-20 18:37:52 +09:00