WriteableBitmapその2
前回に引き続きWriteableBitmapで色々やってみた。
とりあえず、画像をいじるための準備をして、ラインアートとか書いて遊んでみた。
準備
WriteableBitmapの解像度と、画面上での表示サイズを合わせておく。
XAML側
Imageコントロールを配置。
拡大・縮小しないように、Noneを指定しておく。
ウインドウサイズを、↑で配置したImageコントロールと自動で合わせるように設定する。
デザイナで、ウインドウ右下のボタンを押すと、
ウインドウサイズの指定をなくして、自動サイズのルートにすることができる。
コードはこんな感じ
<Window x:Class="WriteableBitmapExTest.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" Title="MainWindow" mc:Ignorable="d" d:DesignHeight="350" d:DesignWidth="525" SizeToContent="WidthAndHeight"> <Grid> <Image Name="imgTarget" Stretch="None" /> </Grid> </Window>
コードビハインド
C#側はこんな感じ。
MainWindowのコンストラクタで、以下のことをやってるだけです。
- WriteableBitmapのインスタンス作成
- 描画内容にかかわる部分をメソッドとして切り分けておく
- 描画結果をImageコントロールのSourceプロパティに設定
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; namespace WriteableBitmapExTest { /// <summary> /// MainWindow.xaml の相互作用ロジック /// </summary> public partial class MainWindow : Window { WriteableBitmap wb; public MainWindow() { InitializeComponent(); // WriteableBitmapのインスタンス生成 wb = BitmapFactory.New(512, 512); RenderImage(); // 描画結果をコントロールに反映 imgTarget.Source = wb; } /// <summary> /// 実際の描画内容 /// </summary> private void RenderImage() { using (wb.GetBitmapContext()) { wb.Clear(Colors.Black); } } } }
点の描画
X座標、y座標に合わせて色を変えて点の描画。
全ピクセルに対して、同じ処理を行う場合には、ForEachが使える。
わざわざX方向/Y方向の二重ループを書かなくてよいので便利w
private void RenderImage() { using (wb.GetBitmapContext()) { wb.ForEach((x, y, c) => Color.FromArgb(255, (byte)(x/512.0 * 255), (byte)((512-y)/512.0*255), 127)); } }