アプリ開発コース 1
◆お絵かきアプリ
Step 1. LineString を使って線を描く
code:cpp
# include <Siv3D.hpp>
void Main()
{
LineString lines;
while (System::Update())
{
// 左クリックされたら
if (MouseL.down())
{
// 現在のマウスカーソルの座標を LineString に追加
lines << Cursor::Pos();
}
// LineString を描く
lines.draw(3);
}
}
Step 2. Image への書き込みを使う
code:cpp
# include <Siv3D.hpp>
void Main()
{
// プログラムで編集可能な、サイズ 480x480 の画像データ(白でぬりつぶす)
Image image(480, 480, Palette::White);
// 中身を更新できる Texture を Image から作る
DynamicTexture texture(image);
while (System::Update())
{
// マスの左ボタンが押されていたらされたら
if (MouseL.pressed())
{
// 画像の、現在のマウスカーソルの位置に円を書き込む
Circle(Cursor::Pos(), 5).overwrite(image, Palette::Orange);
// 画像が更新されたので、texture も更新する
texture.fill(image);
}
// texture を描く
texture.draw();
}
}
Step 3. Line を書き込む
code:cpp
# include <Siv3D.hpp>
void Main()
{
Image image(480, 480, Palette::White);
DynamicTexture texture(image);
while (System::Update())
{
if (MouseL.pressed())
{
// 1 つ前のフレームのマウスカーソルの座標と現在のマウスカーソルの座標を結ぶ
// 太さ 3 の線を画像に書き込む
Line(Cursor::PreviousPos(), Cursor::Pos()).overwrite(image, 3, Palette::Orange);
texture.fill(image);
}
texture.draw();
}
}
Step 4. 画像クリアボタンを作る
code:cpp
# include <Siv3D.hpp>
void Main()
{
Image image(480, 480, Palette::White);
DynamicTexture texture(image);
while (System::Update())
{
if (MouseL.pressed())
{
Line(Cursor::PreviousPos(), Cursor::Pos()).overwrite(image, 3, Palette::Orange);
texture.fill(image);
}
texture.draw();
// ボタンを描画
SimpleGUI::Button(U"クリア", Vec2(500, 20), 120);
}
}
Step 5. ボタンを押すと画像をクリア
code:cpp
# include <Siv3D.hpp>
void Main()
{
Image image(480, 480, Palette::White);
DynamicTexture texture(image);
while (System::Update())
{
if (MouseL.pressed())
{
Line(Cursor::PreviousPos(), Cursor::Pos()).overwrite(image, 3, Palette::Orange);
texture.fill(image);
}
texture.draw();
// ボタンが押されたら
if (SimpleGUI::Button(U"クリア", Vec2(500, 20), 120))
{
// 画像を白でぬりつぶす
image.fill(Palette::White);
// 画像が更新されたので、texture も更新する
texture.fill(image);
}
}
}
Step 6. 応用
太さや色の変更
image.saveWithDialog(); で保存
image.gaussianBlur(5); でガウシアンブラーなど