じゃあ、[名前をつけて保存(S)...]メニューを「実装」するってことになるのね。[名前をつけて保存(S)...]メニューっていうとダイアログボックスを表示して、ファイル名を入力するイメージがあるけど、あんな画面作るのは大変そうだな。教えて、高橋先生！

まずは、前回保存したファイルを開きます。Turbo Delphiを起動して、画面中央の「ホームページ」で「Drawing.bdsproj」を選択。もし一覧に表示されていなければ、ツールバーの[プロジェクトを開く(Ctrl+F11)]ボタンをクリックします。「プロジェクトを開く」ダイアログボックスから「Drawing.bdsproj」を探します。

「FormDrawing」のフォームデザイナ画面を表示します。画面右下のツールパレットの「Dialogs」カテゴリで「TSavePictureDialog」コンポーネントと「TOpenPictureDialog」コンポーネントを探して、フォームの適当な位置に配置します。非ビジュアルコンポーネントなので、フォーム上のどこに配置してもかまいません。似たコポーネントに「TSaveDialog」と「TOpenDialog」がありますから、間違えないように気をつけてね、って高橋先生が言っていました。

図01 TSavePictureDialogとTOpenPictureDialogのアイコン

プロパティも設定します。SavePictureDialog1コンポーネントとOpenPictureDialog1コンポーネント、どちらにも同じプロパティ設定をします。まず、デフォルトのファイル拡張子を指定します。SavePictureDialog1を選択して、画面左下のオブジェクトインスペクタ、プロパティページで「その他」カテゴリの「DefaultExt」プロパティに「bmp」と半角英字で入力します。次に表示するファイルの種類を限定します。SavePictureDialog1を選択していることを確認して、プロパティページ「ローカライズ対象」カテゴリの「Filter」プロパティの[…](ダイアログ)ボタンをクリックします。表示されるダイアログボックスには画像ファイルの種類が記述されています。そこで「ビットマップ(*.bmp)」以外の項目の「フィルタ名」欄と「フィルタ」欄の両方をを削除して[OK]ボタンをクリックします。同様にしてOpenPictureDialog1コンポーネントのプロパティも設定します。

SavePictureDialog1、OpenPictureDialog1

Hide image

図02 「フィルタの設定」ダイアログボックス

さて、これでファイルを開いたり閉じたりできるんだわ~。テストしてみよう。

イベントハンドラにコードを追加します。画面をコードエディタに切り替えて、pbxDrawMouseDownイベントハンドラを探します。マウスの左ボタンが押されているかどうかのif文の中に[名前をつけて保存(S)...]メニューの「Enabled」プロパティをTrueに変更するコードを書きます。太字部分を追加します。

procedure TfrmMain.pbxDrawMouseDown(Sender: TObject; Button: TMouseButton;
  Shift: TShiftState; X, Y: Integer);
begin
  if GetKeyState(VK_LBUTTON) < 0 then
  begin
    pbxDrawMouseMove(Sender, Shift, X, Y);
    S1.Enabled := True;
  end;
end;

それでは、イベントハンドラを作成します。フォームデザイナでMainMenu1コンポーネントをダブルクリック、もしくはマウスの右ボタンクリックで[メニューデザイナ(Y)...]を選択します。メニューデザイナで、[名前をつけて保存(S)...]メニューを選択します。オブジェクトインスペクタ、イベントページで「入力」カテゴリの「OnClick」をダブルクリックします。画面にメニューデザイナが表示されていたら、[×](閉じる)ボタンで閉じておきます。このあともメニューにイベントハンドラを作成しますが、メニューデザイナが邪魔なときは閉じておいてもいいんですって。ダイアログボックスの場合は「if DialogBox.Execute then」ではじめるんだったわよね。if文の中に複数文はいるのでブロック化しておきます。太字部分を追加します。

procedure TfrmMain.S1Click(Sender: TObject);
begin
  if SavePictureDialog1.Execute then
  begin

  end;
end;

次に、ダイアログボックスの「FileName」プロパティを使ってファイルを保存します。それからタイトルバーにファイル名を表示して、[名前をつけて保存(S)...]メニューの表示を非表示にします。太字部分を追加します。

procedure TfrmMain.S1Click(Sender: TObject);
begin
  if SavePictureDialog1.Execute then
  begin
    bmpBuf.SaveToFile(SavePictureDialog1.FileName);
    Caption := Application.Title + ' - ' + SavePictureDialog1.FileName;
    S1.Enabled := False;
  end;
end;

これで、「お絵かきソフト」でファイルを保存できます。フォームを保存して、実行してみましょう。ツールバーの[すべて保存]ボタンで保存して、[実行]ボタンで実行テストします。ペイントボックスに、何か適当に絵を描きます。メニューバーの「ファイル(F)|名前をつけて保存(S)...」を選択します。適当な場所に名前をつけて保存します。

Hide image

図03 名前をつけて保存

では、メニューバーで[プロジェクト(P)]の[オプション(O)...]メニューをクリックして、「Drawing.exeのプロジェクトオプション」ダイアログボックスを表示します。左側の項目から「アプリケーション」を選択して「タイトル(T)」に「お絵かきソフト」と入力して、[OK]ボタンをクリックします。

Hide image

図04 プロジェクトオプション

設定できたら、保存して実行してみましょう。ツールバーの[すべて保存]ボタンで保存して、[実行]ボタンで実行テストします。タスクバーのプログラム名を確認します。そして、ペイントボックスに、もう1度何か絵を描いて、メニューバーの「ファイル(F)|名前をつけて保存(S)...」をクリックします。タイトルバーに「お絵かきソフト - ファイル名.bmp」と表示されていることを確認します。

Hide image

図05 実行テスト

保存できると、今度は開いてみたくなっちゃうわね。ファイルを開くときもダイアログボックスを使うんだろうな。気をつけることはないのかな？教えて、高橋先生！

いろいろ注文があったけど、ひとつひとつやっていきましょう。イベントハンドラを作成します。フォームデザイナでMainMenu1コンポーネントをダブルクリック、もしくはマウスの右ボタンクリックで[メニューデザイナ(Y)...]を選択します。メニューデザイナで、[開く(0)...]を選択します。オブジェクトインスペクタ、イベントページで「入力」カテゴリの「OnClick」をダブルクリックします。if文の中に複数文入るのでブロック化します。太字部分を追加します。

procedure TfrmMain.O1Click(Sender: TObject);
begin
  if OpenPictureDialog1.Execute then
  begin

  end;
end;

次に、bmpBufビットマップオブジェクトがあったら、メモリ解放するようにコードを書きます。太字部分を追加します。

procedure TfrmMain.O1Click(Sender: TObject);
begin
  if OpenPictureDialog1.Execute then
  begin
    if Assigned(bmpBuf) then
      FreeAndNil(bmpBuf);
  end;
end;

空にできたら、「Create」メソッドでメモリに準備して、「LoadFromFile」メソッドでファイルを読み込みます。ファイル名はダイアログボックスの「FileName」プロパティで取得できます。次に、ビットマップオブジェクトの「PixelFormat」プロパティを設定します。pbxDrawペイントボックスコンポーネントの「Width」「Height」プロパティも設定して、「Repaint」メソッドを記述します。太字部分を追加します。

procedure TfrmMain.O1Click(Sender: TObject);
begin
  if OpenPictureDialog1.Execute then
  begin
    if Assigned(bmpBuf) then
      FreeAndNil(bmpBuf);
    bmpBuf := TBitmap.Create;
    bmpBuf.LoadFromFile(OpenPictureDialog1.FileName);
    bmpBuf.PixelFormat := pf32bit;
    pbxDraw.Width  := bmpBuf.Width;
    pbxDraw.Height := bmpBuf.Height;
    pbxDraw.Repaint;
  end;
end;

コードエディタのO1Clickイベントハンドラに続きを記述します。太字部分を追加します。

procedure TfrmMain.O1Click(Sender: TObject);
begin
  if OpenPictureDialog1.Execute then
  begin
    if Assigned(bmpBuf) then
      FreeAndNil(bmpBuf);
    bmpBuf := TBitmap.Create;
    bmpBuf.LoadFromFile(OpenPictureDialog1.FileName);
    bmpBuf.PixelFormat := pf32bit;
    pbxDraw.Width  := bmpBuf.Width;
    pbxDraw.Height := bmpBuf.Height;
    pbxDraw.Repaint;
    Caption := Application.Title + ' - ' + OpenPictureDialog1.FileName;
  end;
end;

これで、ファイルを開くことができます。保存して、実行してみましょう。ツールバーの[すべて保存]ボタンで保存して、[実行]ボタンで実行テストします。実行できたら「お絵かきソフト」の[ファイル(F)|開く(O)...]メニューをクリックします。表示したダイアログボックスで、先ほど保存したファイルを開いてみます。

もうひとつ、[クリア]メニューも作るんですよね。消すだけだから簡単かな。

簡単かなーと思ったんだけどな。フォームデザイナでMainMenu1コンポーネントをダブルクリック、もしくはマウスの右ボタンクリックで[メニューデザイナ(Y)...]を選択します。メニューデザイナで、[編集(E)|クリア(C)]を選択します。オブジェクトインスペクタ、イベントページで「入力」カテゴリの「OnClick」をダブルクリックします。「r」変数を「TRect」型で用意しておきます。「r」変数がペイントボックスと重なるように、「Top」と「Left」のプロパティは「0」にします。「Right」プロパティはペイントボックスの幅の「Width」プロパティ、「Bottom」プロパティはペイントボックスの高さ「Height」プロパティに合わせます。ペイントボックスのほうは「Brush」プロパティに白色を設定します。それから、四角く塗りつぶすので「FillRect」メソッドを使います。パラメータにはサイズを設定した「r」変数が必要です。太字部分を追加します。

procedure TfrmMain.C1Click(Sender: TObject);
var
  r: TRect;
begin
  r.Left   := 0;
  r.Top    := 0;
  r.Right  := bmpBuf.Width;
  r.Bottom := bmpBuf.Height;
  bmpBuf.Canvas.Brush.Color := clWhite;
  bmpBuf.Canvas.FillRect(r);
end;

ビットマップオブジェクトが完成したら、「Repaint」メソッドでビットマップオブジェクトからペイントボックスへ画像を写します。最後に、[名前をつけて保存]メニューの「Enabled」プロパティを「True」にします。太字部分を追加します。

unit FormDrawing;

interface

uses
  Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, 
  Forms,  Dialogs, ExtCtrls, XPMan, Buttons, Menus, ComCtrls, ExtDlgs;

type
  TfrmMain = class(TForm)
    sbxDraw: TScrollBox;
    XPManifest1: TXPManifest;
    Panel1: TPanel;
    pbxDraw: TPaintBox;
    sbtnHoso: TSpeedButton;
    sbtnFuto: TSpeedButton;
    shpColor: TShape;
    ColorDialog1: TColorDialog;
    stbMain: TStatusBar;
    MainMenu1: TMainMenu;
    F1: TMenuItem;
    O1: TMenuItem;
    S1: TMenuItem;
    X1: TMenuItem;
    E1: TMenuItem;
    C1: TMenuItem;
    S2: TMenuItem;
    H1: TMenuItem;
    A1: TMenuItem;
    OpenPictureDialog1: TOpenPictureDialog;
    SavePictureDialog1: TSavePictureDialog;
    procedure pbxDrawMouseMove(Sender: TObject; Shift: TShiftState; X,
      Y: Integer);
    procedure pbxDrawMouseDown(Sender: TObject; Button: TMouseButton;
      Shift: TShiftState; X, Y: Integer);
    procedure FormCreate(Sender: TObject);
    procedure pbxDrawPaint(Sender: TObject);
    procedure FormDestroy(Sender: TObject);
    procedure shpColorMouseUp(Sender: TObject; Button: TMouseButton;
      Shift: TShiftState; X, Y: Integer);
    procedure X1Click(Sender: TObject);
    procedure FormCloseQuery(Sender: TObject; var CanClose: Boolean);
    procedure pbxDrawMouseLeave(Sender: TObject);
    procedure O1Click(Sender: TObject);
    procedure S1Click(Sender: TObject);
    procedure C1Click(Sender: TObject);
  private
    { Private 宣言 }
    preX: Integer;
    preY: Integer;
    bmpBuf: TBitmap;
  public
    { Public 宣言 }
  end;

var
  frmMain: TfrmMain;

implementation

{$R *.dfm}

procedure TfrmMain.C1Click(Sender: TObject);
var
  r: TRect;
begin
  r.Left   := 0;
  r.Top    := 0;
  r.Right  := bmpBuf.Width;
  r.Bottom := bmpBuf.Height;
  bmpBuf.Canvas.Brush.Color := clWhite;
  bmpBuf.Canvas.FillRect(r);
  pbxDraw.Repaint;
  S1.Enabled := True;
end;

procedure TfrmMain.FormCloseQuery(Sender: TObject; var CanClose: Boolean);
begin
  if MessageDlg('終了しますか？', mtConfirmation, [mbOK, mbCancel], 0) = mrOk then
    CanClose := True
  else
    CanClose := False;
end;

procedure TfrmMain.FormCreate(Sender: TObject);
begin
  preX := -1;
  preY := -1;
  bmpBuf := TBitmap.Create;
  bmpBuf.PixelFormat := pf32bit;
  bmpBuf.SetSize(640, 480);
end;

procedure TfrmMain.FormDestroy(Sender: TObject);
begin
//  ReportMemoryLeaksOnShutdown := True;

  if Assigned(bmpBuf) then
    FreeAndNil(bmpBuf);
end;

procedure TfrmMain.O1Click(Sender: TObject);
begin
  if OpenPictureDialog1.Execute then
  begin
    if Assigned(bmpBuf) then
      FreeAndNil(bmpBuf);
    bmpBuf := TBitmap.Create;
    bmpBuf.LoadFromFile(OpenPictureDialog1.FileName);
    bmpBuf.PixelFormat := pf32bit;
    pbxDraw.Width  := bmpBuf.Width;
    pbxDraw.Height := bmpBuf.Height;
    pbxDraw.Repaint;
    Caption := Application.Title + ' - ' + OpenPictureDialog1.FileName;
  end;
end;

procedure TfrmMain.pbxDrawMouseDown(Sender: TObject; Button: TMouseButton;
  Shift: TShiftState; X, Y: Integer);
begin
  if GetKeyState(VK_LBUTTON) < 0 then
  begin
    pbxDrawMouseMove(Sender, Shift, X, Y);
    S1.Enabled := True;
  end;
end;

procedure TfrmMain.pbxDrawMouseLeave(Sender: TObject);
begin
  stbMain.Panels[0].Text := '';
  stbMain.Panels[1].Text := '';
end;

procedure TfrmMain.pbxDrawMouseMove(Sender: TObject; Shift: TShiftState; X,
  Y: Integer);
var
  w: Integer;
  c: TColor;
begin
  stbMain.Panels[0].Text := 'X = ' + IntToStr(X);
  stbMain.Panels[1].Text := 'Y = ' + IntToStr(Y);

  if GetKeyState(VK_LBUTTON) < 0 then
  begin
    if sbtnHoso.Down then
      w := 5
    else
      w := 20;

    c := shpColor.Brush.Color;

    pbxDraw.Canvas.Pen.Mode  := pmCopy;
    pbxDraw.Canvas.Pen.Width := w;
    pbxDraw.Canvas.Pen.Color := c;
    pbxDraw.Canvas.MoveTo(preX, preY);
    pbxDraw.Canvas.LineTo(X, Y);

    bmpBuf.Canvas.Pen.Mode  := pmCopy;
    bmpBuf.Canvas.Pen.Width := w;
    bmpBuf.Canvas.Pen.Color := c;
    bmpBuf.Canvas.MoveTo(preX, preY);
    bmpBuf.Canvas.LineTo(X, Y);
  end;

  preX := X;
  preY := Y;

end;

procedure TfrmMain.pbxDrawPaint(Sender: TObject);
begin
  pbxDraw.Canvas.CopyMode := cmSrcCopy;
  pbxDraw.Canvas.Draw(0, 0, bmpBuf);
end;

procedure TfrmMain.S1Click(Sender: TObject);
begin
  if SavePictureDialog1.Execute then
  begin
    bmpBuf.SaveToFile(SavePictureDialog1.FileName);
    Caption := Application.Title + ' - ' + SavePictureDialog1.FileName;
    S1.Enabled := False;
  end;
end;

procedure TfrmMain.shpColorMouseUp(Sender: TObject; Button: TMouseButton;
  Shift: TShiftState; X, Y: Integer);
begin
  if ColorDialog1.Execute then
    shpColor.Brush.Color := ColorDialog1.Color;
end;

procedure TfrmMain.X1Click(Sender: TObject);
begin
  Close;
end;

end.

[クリア(C)]メニューができたら、保存して実行します。ツールバーの[すべて保存]ボタンで保存して、[実行]ボタンで実行テストします。実行できたら「お絵かきソフト」の[ファイル(F)|開く(O)...]メニューをクリックして、練習で作った画像ファイルを開きます。そのまま[編集(E)|クリア(C)]をクリックして画面が白くなることを確認します。