» VL: Skia Update
This site relies heavily on Javascript. You should enable it if you want the full experience. Learn more.

VL: Skia Update

Hello,

welcome the first update to our beloved 2D graphics library.
Since this summer's release quite a few things have happened.
The main focus was on covering every single aspect of the Skia's Paint (defines how everything looks like when rendered) and cleaning it up.
We would say it is now complete.

We've also introduced some special gems like Masks, Precompositions, Ellipsis and some more examples.

Never heard of Skia before? Check Skia on Wikipedia.

Read on.

Masking

You already were able to clip layers by rectangles or paths (ClipRect, ClipPath), now you can use any layer as a mask (as you know it from Photoshop), be it an image or very complicated layer pipeline. Welcome the Mask. It comes in two flavors: one uses a layer as a mask, another one just an image. The node has useful helpers which allow you to see how the mask looks like and where it is applied.

Precomposing

While researching for the masks we've stumbled upon Skia's superpower: we call it precomposing. Layers can be precomposed (leaving canvas unchanged) and then applied (grouped) with other layers. It's like having an extra render pass that works like a layer.

So now you've got two options: you can blur every single particle alone (by setting SetMaskFilter > Blur) or prepare all of them (precompose) and then blur the whole scene at once (by setting SetImageFilter > Blur).

In the screeshot above:
Left - every single circle is blurred alone, the background comes into play.
Right - the whole precomposition is blurred.

Ellipsis

Then we have these boring Ellipsis nod... nodes. They clip your text (left, right or center) by the number of letters or the width in units. Like this:

Paint completeness & cleanup

We've cleaned up the Paint a lot and now you can set or get any of its properties. Don't forget to turn on the "Advanced" filter of the NodeBrowser (like in the screenshot or just press TAB-key) to get the full power. SetFakeBoldText anyone?

In the Paint category:

  • Processnodes (having an icon with two dots) are for setting properties (they start with Set)
  • nodes with an empty box are for getting properties
  • Processnodes without Set (like Stroke, Fill or FontAndParagraph) are convenient nodes setting several properties at once.

Examples and Demos

Don't forget to check the /examples folder of the package (your-vvvv-folder/lib/packs/VL.Skia.xxxx/).
There are also some updates to the /examples/demos, like the Slideshow.vl which let's you click through your-very-big-images asynchronously preloading them in the background.

Some more features:

  • ImageEncoder
  • ImageWriter
  • SubpixelText property is on by default
  • Pipet (Experimental)

How to Install

1. Install the latest vvvv_50beta38.1 (older versions are not supported)
2. In vvvv, middleclick > Show VL
3. In VL, go to: Dependencies > Manage Nugets > Commandline and type:

nuget install VL.Skia -prerelease

Versions

  • This latest version works best with beta38.1.
  • Using beta38 or older? make sure to install an older skia version. Type 'nuget install VL.Skia -version 0.93.26-g6c67991fa4' to get a compatible version. You'll miss some of the advertised features though.
robotanton, Friday, Nov 23rd 2018 Digg | Tweet | Delicious 0 comments  
  • 1

anonymous user login

Shoutbox

~2d ago

ravazquez: @catweasel it was late when I wrote that, it's probably not the case, will test and report

~2d ago

catweasel: @ravazquez in separate instances of vvvv? Awesome if so!

~4d ago

ravazquez: @karistouf you can use my Global S&R contribution for this purpose

~5d ago

joreg: yes, no S/R. OSC is one way to communicate btw. instnces.

~5d ago

karistouf: @joreg: between 2 differents instances of VVVV on same computer,no S and R (values) possible ? only OSC way ?

~7d ago

tonfilm: glad to share the second update on the #vl #xenko #3d library: #vvvv #visualprogramming #creativecoding vl-xenko-3d-engine-update-2

~9d ago

joreg: rather toot then tweet? follow the hype and us on mastodon: https://mastodon.xyz/@vvvv #vvvv

~9d ago

ggml: any recommendation for renting visuals-grade pcs in berlin ?

~9d ago

metrowave: Structure Sensor Core now for Windows: https://store.structure.io/buy/structure-core cool features, could be useful in vvvv