github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-04-29 05:08:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

WIP

Browse Source
This commit is contained in:
Alejandro Alonso 2023-12-20 14:08:15 +01:00
parent 69582add4b
commit 721d9ee399
2 changed files with 20 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/app/main/ui/workspace/viewport/sk.cljs
View File

@ -19,15 +19,15 @@
(mf/with-effect [objects]
(when @canvas-kit
(do
(doseq [[_ object] objects]
(.paintRect ^js @canvas-kit (clj->js object))))))
(doseq [[_ object] objects]
(.paintRect ^js @canvas-kit (clj->js object)))))
(mf/with-effect [canvas-ref]
(let [canvas (mf/ref-val canvas-ref)]
(when (some? canvas)
(set! (.-width canvas) (.-clientWidth canvas))
(set! (.-height canvas) (.-clientHeight canvas))
(println "init vbox" vbox)
(-> (.initialize impl/CanvasKit "skia-canvas" vbox)
(.then (fn [k]
(reset! canvas-kit k)))))))

35
frontend/src/app/main/ui/workspace/viewport/sk_impl.js
View File

@ -19,28 +19,27 @@ class CanvasKit {
paintRect(shape) {
const surface = this.CanvasKit.MakeCanvasSurface(this.canvasId)
// Drawing fills
if (shape.fills) {
for (const fill of shape.fills) {
const paint = new this.CanvasKit.Paint();
paint.setStyle(this.CanvasKit.PaintStyle.Fill);
const color = this.CanvasKit.parseColorString(fill["fill-color"]);
const opacity = fill["fill-opacity"]
color[3] = opacity
paint.setColor(color);
const rr = this.CanvasKit.RRectXY(this.CanvasKit.LTRBRect(shape.x, shape.y, shape.x + shape.width, shape.y + shape.height), 0, 0);
const self = this;
function draw(canvas) {
canvas.translate(- self.vbox.x, - self.vbox.y);
const self = this;
function draw(canvas) {
canvas.translate(- self.vbox.x, - self.vbox.y);
const paint = new self.CanvasKit.Paint();
// Drawing fills
if (shape.fills) {
for (const fill of shape.fills.reverse()) {
paint.setStyle(self.CanvasKit.PaintStyle.Fill);
const color = self.CanvasKit.parseColorString(fill["fill-color"]);
const opacity = fill["fill-opacity"]
color[3] = opacity
paint.setColor(color);
const rr = self.CanvasKit.RRectXY(self.CanvasKit.LTRBRect(shape.x, shape.y, shape.x + shape.width, shape.y + shape.height), 0, 0);
canvas.drawRRect(rr, paint);
paint.delete();
}
surface.drawOnce(draw);
}
paint.delete();
}
surface.drawOnce(draw);
// // Drawing another border
// const paint2 = new this.CanvasKit.Paint();
// paint2.setColor(this.CanvasKit.Color4f(0.9, 0, 1.0, 1.0));