ThorVG 1.0

Noong Enero 31, pagkatapos ng isa't kalahating taon ng patuloy na pag-unlad, inilabas ang 1.0 na bersyon ng magaan at madaling dalhing cross-platform vector graphics library. ThorVG, dinisenyo para sa pagpapakita ng mga eksena at animation na vector. Sinusuportahan ang mga file sa mga sumusunod na format Lottie и SVG Tiny 1.2 (Ang listahan ng mga ipinatupad na tampok ng SVG Tiny ay makukuha sa Wiki ng proyekto.).

Nagbibigay ang library maginhawang mga API para sa pag-import, paglikha, at pagpapakita ng mga vector graphics, pati na rin ang pag-export ng mga ito sa iba't ibang format ng graphic, kaya't pangkalahatang naaangkop ito sa iba't ibang platform ng software at mga aplikasyon para sa pagpapakita ng nilalamang graphic. Kasama rin ang mga command-line utility na lottie2gif at svg2png.

Ang ThorVG ay ginagamit para sa pag-render ng vector graphics sa mga proyekto tulad ng Tizen OS, Godot Engine, LVGL at mga manlalaro dotLottie.

Ang proyekto ay nakasulat sa C++ (pamantayan ng C++14) at ipinamamahagi sa ilalim ng lisensya ng MIT.

Hindi lamang ito isang update—ito ay isang muling itinayong pundasyon para sa mataas na pagganap, nasusukat, at madaling dalhing 2D vector graphics sa lahat ng platform at device. Sa paglipas ng panahon ng pag-unlad nito, ang ThorVG ay umunlad tungo sa isang mature at handa nang gamiting graphics engine, na nagpapakita ng napatunayang kalidad at pagganap sa mga totoong aplikasyon.

Mabilis na nakakuha ng popularidad ang ThorVG at nakaakit ng lumalaking interes mula sa komunidad, na sumasalamin sa ebolusyon nito mula sa isang maagang yugto ng proyekto patungo sa isang malawakang kinikilala at malawakang ginagamit na vector graphics engine na handa na para sa totoong paggamit sa iba't ibang platform.

Listahan ng mga pagbabago:

• Mga advanced na kakayahan sa pag-render ng teksto, masaganang visual effect, at tumpak na suporta sa overlay para sa pinahusay na graphic expression
  • Ang suporta para sa pahalang at patayong pagkakahanay ay nagbibigay-daan para sa tumpak na kontrol sa paglalagay ng teksto sa iba't ibang konteksto ng UI.
  • Awtomatikong paghahati ng linya na may kakayahang pumili ng mode: ayon sa mga karakter, ayon sa mga salita, smart splitting at ellipsis truncation para sa overflow handling.
  • Ang suporta para sa mga manu-manong line break ay nagbibigay-daan sa mga developer na tahasang kontrolin ang mga line break gamit ang mga bagong karakter tulad ng \n. Nagbibigay-daan ito para sa tumpak na pag-format ng mga multi-line na text block, lalo na sa mga dynamic na layout o mga animation ng teksto.
  • Suporta para sa naaayos na espasyo ng mga karakter, na nagbibigay-daan para sa pagpino upang mapabuti ang pagbabasa o makamit ang mga partikular na istilo ng tipograpiya.
  • Ang suporta sa balangkas ng teksto ay nagbibigay-daan sa iyong lumikha ng mga epektong pang-istilo at pagbutihin ang contrast sa iba't ibang background (screenshot 1).
  • Isang mas komprehensibo at pare-parehong sistema ng blending mode ang ipinakilala, na makabuluhang nagpapabuti sa pag-uugali ng blending mode at iniayon ang mga formula at lohika ng komposisyon sa mga pamantayan ng industriya tulad ng Lottie, SVG, at ang ispesipikasyon ng W3C Compositing and Blending. Ang mga pagpapabuting ito ay nagbibigay ng mas mahusay na visual consistency at cross-platform compatibility, lalo na sa mga workflow ng web at animation.
  • Ang mga sumusunod na blending mode ay ipinatupad at sinusuportahan: Hue, Saturation, Color, at Luminosity, gamit ang HSL color space compositing. Pinahuhusay ng mga mode na ito ang pagiging tugma sa mga epekto ng Lottie layer at sa suporta sa SVG blending sa hinaharap (screenshot 2).
  • Mga makabuluhang pagpapabuti at pagpapahusay sa mga visual effect sa antas ng eksena, na ginagawang mas makahulugan at mas mayaman sa biswal ang mga vector graphics:
    • Epekto ng anino gamit ang Gaussian Blur filter (demonstrasyon sa bidyo).
    • Mga pamamaraan ng pagpapalit ng kulay na nagbabago sa hitsura ng mga grapiko sa pamamagitan ng muling pagtukoy sa paraan ng paglalapat, paghahalo, o pagtutugma ng mga kulay batay sa kulay (demonstrasyon sa bidyo).
  • May mga bagong function na pantulong na idinagdag upang mapahusay ang mga interactive na kakayahan. Kabilang dito ang suporta para sa mga query sa impormasyong pang-espasyo (pagpapakita) at pagtuklas ng hit sa mga ipinapakitang bagay (demonstrasyon sa bidyo).
• Pinahusay na kakayahan sa animation ng Lottie para sa cross-platform playback, kabilang ang mga modular na preset ng Web Player na na-optimize para sa laki, performance, at rendering mode (CPU/GPU)
  • Ang mga makabuluhang pagpapabuti sa suporta sa animation ng Lottie ay nagpabuti sa compatibility, flexibility, at interactivity sa lahat ng platform. Hindi lamang pinalawak ang hanay ng mga sinusuportahang function at expression ng Lottie, kundi ibinigay din ang mga tool ng developer upang dynamic na kontrolin ang pag-uugali ng animation sa runtime, na ginagawang isa ang ThorVG sa pinakamalakas na library ng playback ng Lottie na magagamit. Ang listahan ng mga ipinatupad na tampok ay makukuha sa Wiki ng proyekto..
  • Sa ngayon, ang .lot file extension ang bagong opisyal na pamantayan ng IANA para sa mga Lottie file. Opisyal na ngayong sinusuportahan ng ThorVG ang .lot bilang karaniwang format ng Lottie file, bilang karagdagan sa tradisyonal na .json extension.
  • Twining
    • Idinagdag ang suporta para sa interpolasyon sa pagitan ng mga nonlinearly adjacent keyframe, na nagbibigay-daan sa mas maayos na mga transition at mas tumpak na kontrol sa timing. Ang pagpapabuting ito ay partikular na epektibo kapag ginamit sa state-based animation playback (kilala rin bilang marker-based playback) sa Lottie. Sa maraming pagkakataon, ang mga animation ay idinisenyo upang lumipat sa pagitan ng mga estado sa mga kumplikado at nonlinear na paraan. Ang tradisyonal na Lottie, na may mahigpit na sequential timing structure nito, ay nahihirapang pangasiwaan ang mga ganitong senaryo, na kadalasang nagreresulta sa biglaang pagbaba o awkward jumps kapag lumilipat sa pagitan ng mga non-sequential keyframe: demonstrasyon sa bidyo 1, demonstrasyon sa bidyo 2.
    • Gamit ang tweening, maaari nang direktang mag-interpolate ang mga developer sa pagitan ng dalawang indibidwal na keyframe, kahit na hindi sila linearly adjacent sa timeline. Nagbibigay-daan ito para sa mas natural at maayos na visual effect sa panahon ng mga state transition, na lubos na nagpapataas ng flexibility at realism ng mga interactive animation: demonstrasyon sa bidyo 1, demonstrasyon sa bidyo 2.
  • Ngayon (bilang isang eksperimental na tampok), sinusuportahan na ang runtime rewriting ng mga expression variable, na nagpapahintulot sa script logic na pabago-bagong maisagawa batay sa input ng user. Ginagawa nitong isang partikular na makapangyarihang tool para sa paglikha ng mga interactive na animation gamit ang mga Lottie asset, na nagbibigay-daan para sa mga custom na variation na higit pa sa orihinal na disenyo.demonstrasyon sa bidyo).
  • Idinagdag ang isang napapasadyang Asset Resolver, na nagbibigay ng higit na kakayahang umangkop kapag naglo-load ng mga panlabas na asset (tulad ng mga imahe) na isinangguni ng mga animation ng Lottie.
  • Pinalawak na suporta para sa Lottie LayerEffect, na nagbibigay-daan sa iyong direktang maglapat ng mga mayayamang visual na pagpapahusay sa mga animation layer gamit ang mga epektong inilarawan sa itaas.
  • Dahil ang ilang mga epekto ay maaaring magastos nang malaki sa resources, mayroong opsyon para isaayos ang kalidad at performance ng effect rendering, na mainam para sa pag-optimize sa mga platform na may CPU constrained. Nagbibigay-daan ito sa mga developer na kontrolin ang rendering fidelity at i-optimize ang performance depende sa target na platform.
  • Pinalawak ang suporta sa ekspresyon gamit ang pagdaragdag ng mga sumusunod na pangunahing tungkulin at katangian:
    • kislot, temporalKislot: Maglapat ng random na paggalaw batay sa oras.
    • pointOnPath: Kinakalkula ang posisyon sa isang landas.
    • propertyIndex, groupIndex: Isang reperensya sa indeks ng isang ari-arian o grupo.
    • halaga, ari-arian, epekto: pag-access sa mga halaga ng ari-arian at mga panlabas na epekto.
  • Mas tumpak na pagsunod sa mga detalye:
    • Ang TextFollowPath ay isang bagong ispesipikasyon na nagpapahintulot sa teksto na sumunod sa mga arbitraryong vector path (demonstrasyon sa bidyo).
    • Mga Opsyon sa Pag-align ng Teksto – Mas tumpak na pagpapakita ng mga layer ng teksto batay sa kanilang mga setting ng pahalang at patayong pag-align (demonstrasyon sa bidyo).
    • Ang Mask Expansion ay isang bagong tampok na nagbibigay-daan sa iyong mas tumpak na kontrolin kung paano nakakaapekto ang hugis ng isang maskara sa iyong biswal na komposisyon (demonstrasyon sa bidyo).
• SVG
  • Pinapayagan ka na ngayon ng ThorVG na ma-access at baguhin ang mga indibidwal na elemento ng SVG gamit ang mga natatanging id attribute na tinukoy sa SVG source file. Ang feature na ito ay nagbibigay-daan sa mga developer na direktang pumili at manipulahin ang mga partikular na hugis ng vector sa isang na-import na eksena ng SVG, na mainam para sa mga interactive o dynamic na paggamit (hal., theming, highlighting).
  • Suporta Epekto ng malabong Gaussian.
• Matalinong pag-render
  • Sinusuportahan na ngayon ng ThorVG software engine ang intelligent partial rendering, na nagbibigay-daan sa mas mahusay na mga daloy ng trabaho sa pag-render sa pamamagitan ng pag-update lamang ng mga bahagi ng isang vector scene na nagbago. Sa pamamagitan ng panloob na pagsubaybay sa mga nabagong rehiyon, binabawasan nito ang mga hindi kinakailangang redraw at ino-optimize ang pangkalahatang pagganap. Ang feature na ito ay nagbibigay ng mga makabuluhang benepisyo sa mga sitwasyon tulad ng UI rendering, mga tool sa disenyo, o mga application kung saan ang karamihan sa eksena ay nananatiling static at maliliit na elemento lamang ang ina-update sa pagitan ng mga frame. Sa ganitong mga kaso, ang pag-iwas sa full scene rendering ay maaaring makabuluhang bawasan ang computational load at mapabuti ang kahusayan ng kuryente, na lalong mahalaga para sa mga mobile at embedded system.
  • Upang makamit ang layuning ito, ginagamit ng ThorVG 1.0 ang kombinasyon ng mga pamamaraang algoritmo na partikular na idinisenyo para sa bahagyang pag-render. Ang mga pangunahing estratehiya na pinagbabatayan ng sistemang ito ay ang mga sumusunod:
    • Algoritmo ng Linear Pass: Ang mga hugis ay inayos ayon sa mga x-coordinate at isang estratehiya ng linear pass ang ginagamit upang mabawasan ang mga hindi kinakailangang pagsusuri ng mga maruruming rehiyon. Binabawasan nito ang pagiging kumplikado mula O(N × M) patungong O(N + M + K + N log N), kung saan ang N ay ang bilang ng mga hugis, ang M ay ang bilang ng mga maruruming rehiyon, at ang K ay ang bilang ng mga aktwal na overlap.
    • Paghahati at kondisyonal na pagsasama: ang pinong paghahati ng sub-region ay binabalanse sa pamamagitan ng matalinong pagsasama upang maiwasan ang pagkapira-piraso. Ang pahalang na pagsasama ay inuuna para sa mas mahusay na paggamit ng memory cache.
    • Spatial Subdivision (default na 4x4 grid): Ang rendering surface ay nahahati sa 16 na rehiyon, na nagpapahintulot lamang sa pagsuri sa mga kaukulang "maruruming" bahagi ng mga hugis, na makabuluhang binabawasan ang overhead sa panahon ng mga kumplikadong pag-update ng UI.
  • Kung pagsasama-samahin, ang mga pamamaraang ito ay nagbibigay ng mas maayos at mas mabilis na pag-render, lalo na sa mga naka-embed o real-time na sistema kung saan madalas ang mga bahagyang pag-update. Mas maraming detalye ang ilalathala sa isang hiwalay na post. post ng blog.
  • Pakitandaan na para sa mga nilalamang lubos na dynamic, tulad ng mga mabilisang laro o mga full-screen animation kung saan halos lahat ng bagay ay nagbabago sa bawat frame, ang bahagyang pag-render ay nagbibigay ng kaunti o walang benepisyo sa pagganap at maaaring magdulot pa ng kaunting gastos. Sa ganitong mga kaso, ang buong pag-render ng eksena ay karaniwang isang mas mahusay na pagpipilian. Dahil dito, sinusuportahan ng ThorVG ang parehong bahagyang at buong mga configuration ng pag-render, na nagbibigay-daan sa iyong pumili ng pinakamainam na diskarte para sa iyong paggamit. Maaari mong suriin ang pagganap ng iyong produkto at gumawa ng matalinong desisyon gamit ang opsyong Meson -Dpartial=[true/false] at ang opsyong EngineOption::Smart ng klaseng SwCanvas:

  awtomatikong canvas = SwCanvas::gen(EngineOption::Smart);

• Isang bagong panahon ng integrasyon ng web gamit ang WebGL, WebGPU, at ang magaan na WebCanvas para sa tuluy-tuloy na pag-render sa browser
  • Opisyal nang handa na para sa produksyon ang mga backend ng WebGL at WebGPU. Ang mga GPU-based renderer na ito ay nag-aalok na ngayon ng ganap na interoperability sa tradisyonal na CPU backend, na sumusuporta sa lahat ng feature ng ThorVG Canvas na may parehong kalidad at stability ng imahe. Kung ikukumpara sa bersyon 0.15, ang performance ng GPU rendering ay tumaas ng mahigit 150%, na naghahatid ng malaking pagpapabuti sa real-time web vector graphics rendering.
• Mga makabuluhang pagpapabuti sa pagganap sa mga kapaligirang may limitasyon at naka-embed na CPU/GPU
  • Nag-aalok ang ThorVG 1.0 ng pinahusay na pagganap kumpara sa bersyon 0.15, na may kapansin-pansing mga pagbuti para sa parehong CPU at GPU.
  • Mga pangunahing pag-optimize:
    • Pinahusay na kahusayan ng pipeline ng pag-render.
    • Nabawasang overhead sa paglalaan ng frame buffer.
    • Na-optimize na pagsusuri ng komposisyon ng Lottie.
    • Pinahusay na batch rendering at GPU caching.
  • Ang ThorVG ay na-optimize para sa CPU-based rasterization, na nakatuon sa vector rendering sa mga kapaligiran kung saan limitado, hindi magagamit, o sadyang hindi gaanong nagagamit ang mga resources ng GPU. Sa mga karaniwang benchmark ng CPU, ang ThorVG ay nagpapakita ng average na 1.8x na mas mabilis na performance kaysa sa malawakang ginagamit na Skia vector graphics engine kapag nagsasagawa ng mga karaniwang gawain sa vector rendering. Ang bentaheng ito ay partikular na kitang-kita sa mga senaryo na masinsinang gumagamit ng geometry tulad ng pag-render ng mga parihaba, stroke, rotation, at bilog (screenshot 3).
• Tagalinis ng ThorVG
  • Makikita sa proyekto ang isang totoong demonstrasyon ng pagganap ng ThorVG sa pag-render. Tagalinis ng ThorVG – isang interactive na laro na idinisenyo upang ipakita ang pagganap ng processor sa ilalim ng mabibigat na graphics. Kasama sa eksena ang daan-daang mga kalaban na nilikha gamit ang mga particle-based graphics, mga background na may maraming layer na mabituing kalangitan na may full-size na bitmap, mga real-time na visual effect tulad ng DropShadow at Blur, at hanggang 25000 na bagay na sabay-sabay na nire-render. Kahit na sa peak load sa 2K resolution (2048×1152), ipinapakita ng proyekto ang matatag na pagganap na higit sa 120 FPS, na nagtatampok sa kahusayan at pagiging angkop ng ThorVG para sa mga kumplikado at mabibigat na kapaligiran.demonstrasyon sa bidyo, screenshot).
• Iba pang mahahalagang pagbabago
  • Isang halimbawa ng integrasyon ng ThorVG sa Godot. Sa demonstrasyong ito sa bidyo Ang ThorVG ay isinama sa Godot sa isang web environment upang mag-render ng daan-daang Lottie animation objects sa mahigit 120 frames per second. Ipinapakita ng demo na ito ang potensyal ng ThorVG sa isang web environment para sa maayos at mataas na kalidad na animation habang tumatakbo.
  • Idinagdag halimbawa ng pagtuturo gamit ang ThorVG WebCanvas.
  • Nagdagdag ng interactive Palaruan ng ThorVG.
  • Idinagdag ang ThorVG wrapper para sa Swift: https://github.com/thorvg/thorvg.swift.
  • Ang mga halimbawa ng paggamit ng ThorVG ay inilipat sa isang hiwalay na repositoryo https://github.com/thorvg/thorvg.example.
  • Na-publish na ang extension thorvg.vscode para sa VSCode na lumikha, mag-edit, at mag-preview ng mga mapagkukunan ng ThorVG nang direkta sa loob ng Visual Studio Code.
  • Kasama sa Bersyon 1.0 ang isang makabuluhang muling pagbubuo ng API na naglalayong mapabuti ang pagganap, kakayahang magamit, pagkakapare-pareho, at pagiging tugma sa C.
  • Inalis na ang suporta para sa format na TVG Picture (TVG). Ang desisyong ito ay ginawa upang maghanda para sa bagong format na ThorVG Picture, na dinisenyo gamit ang animation bilang pangunahing konsepto.
  • Maraming pag-aayos ng bug at mga pagpapabuti sa katatagan para sa paggamit sa produksyon.

Pinagmulan: linux.org.ru