Sergii Liebodkin
bad02c7de0
Added ability to draw solid strokes with dashes
...
[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);
//Test for Stroke Dash for Arc, Circle, Rect
auto shape = tvg::Shape::gen();
shape->appendArc(70, 600, 160, 10, 30, true);
shape->appendCircle(70, 700, 20, 60);
shape->appendRect(130, 710, 100, 40);
shape->strokeFill(255, 0, 0);
shape->strokeWidth(5);
shape->strokeJoin(tvg::StrokeJoin::Round);
shape->strokeCap(tvg::StrokeCap::Round);
float dashPattern[2] = {20, 10};
shape->strokeDash(dashPattern, 2);
if (canvas_wg->push(std::move(shape)) != tvg::Result::Success) return;
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-12-26 18:18:48 +09:00
Sergii Liebodkin
41ea198a5e
Added ability to draw solid strokes
...
[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);
//Test for Stroke Dash for Arc, Circle, Rect
auto shape = tvg::Shape::gen();
shape->appendArc(70, 600, 160, 10, 30, true);
shape->appendCircle(70, 700, 20, 60);
shape->appendRect(130, 710, 100, 40);
shape->strokeFill(255, 0, 0);
shape->strokeWidth(5);
shape->strokeJoin(tvg::StrokeJoin::Round);
shape->strokeCap(tvg::StrokeCap::Round);
if (canvas_wg->push(std::move(shape)) != tvg::Result::Success) return;
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-12-26 18:18:42 +09:00
Sergii Liebodkin
db1f171d2a
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-12-26 17:51:39 +09:00
Sergii Liebodkin
938b69688d
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-12-26 17:51:17 +09:00
