そもそもSkiaって?
「Skia」は、Googleが中心となって開発しているオープンソースの2Dグラフィックスライブラリで、ChromeやAndroid、Flutterといった大規模なプロジェクトの描画基盤として広く採用されています。
GPUアクセラレーションを活用した高い描画性能を持ち、ベクターやテキスト、画像処理など、モダンなUIを構築するための基本的な描画機能が揃っているのが特徴です。
このSkiaを .NET環境から利用できるようにしたバインディングライブラリが「SkiaSharp」です。
C#やF#といった言語からSkiaの高性能な描画機能を直接呼び出すことができ、更に、Xamarinや.NET MAUIなどと組み合わせれば、iOS、Android、Windows、macOSでそのまま動かすことのできる、クロスプラットフォーム開発が容易になります。
ここでは、SkiaSharpを用いて、Skiaで効率的かつ実践的にグラフィックスを扱うための基本から実践までの知識や、応用例としてのTipsを紹介していきます。
この記事では、SkiaSharpのバージョン3.119.1(Skia milestone 119)を対象としています。Skiaは頻繁に互換性の悪い変更が加えられるため、他のバージョンを使用している場合は注意してください。
筆者のモチベーション依存で、逐次追加・更新される予定です。よろしければご支援お願いいたします!
SkiaSharpの始め方
- Windows FormsアプリでSkiaSharpを使う方法
- WinUI 3アプリでSkiaSharpを使う方法
- .NET MAUIアプリでSkiaSharpを使う方法
Skiaの基本
- SkiaSharpの基本となるオブジェクトについて
- ペイント(
SKPaint)の基本
- 基本的な図形の描画
- キャンバス(
SKCanvas)の基本的な操作
- 描画におけるピクセルの位置などの細部について
- テキスト描画の基本
- イメージフィルタの基本
- シェーダーの基本
- 画面に直接表示されないオフスクリーン描画の基本
Skiaの実践
- 折れ線や曲線の描画
-
SKPathEffectを使った線の装飾
- クリッピングの基本と複雑な例
- 主なブレンドモードと使いどころ
- テキスト描画を極める
- 変化するシェーダーの実装方法
Skia Tips
- 流れる点線を実装する方法
- 水が流れるパイプを実装する方法
- 図形に縁取り(光彩)エフェクトを付ける方法
- リアルな摺りガラスエフェクトの実装
- ぼやけた輪郭で画像を切り抜いて描画する方法
- よれてもつれあう線を描画する方法
- 岩でできたような立体感のある文字を描画する方法
- 多くのスタイルを持つフォントの扱い方
- グラフを重ね合わせてヒートマップ風に表示する方法