P010-ネットの画像を読み込む

今日の目標→

いまどきのプログラムは、やはりネットに接続できないと話にならない。今回はその最も簡単な例として、ネットから画像を取得してピクチャボックスに表示するプログラムを作ってみる。

●MyLibの修正

その前に、前回発見したMyLibライブラリの不具合（namespaceに全角文字を発見！）を修正しておく。コードを直すついでに、行数上限を変えるSetMaxLines()メソッドも追加した。

// プロジェクト：MyLib // ファイル名：RichReporter.cs using System.Drawing; using System.Windows.Forms; namespace MarugeProject { /// <summary> /// リッチテキストボックスに文字表示するクラス /// </summary> public class RichReporter { // 出力先のリッチテキストボックス private RichTextBox MyTextBox; // 行数の上限 private int MyMaxLines; /// <summary> /// コンストラクタ：引数で出力先を指定する /// </summary> public RichReporter(RichTextBox target) { MyTextBox = target; MyMaxLines = 20; } /// <summary> /// 行数の上限を設定する /// </summary> public void SetMaxLines(int maxLines) { if (maxLines < 2) { MessageBox.Show( "行数上限は2以上を指定してください", "RichReporter.SetMaxLines()"); } else { MyMaxLines = maxLines; } } /// <summary> /// 色なしのテキスト表示 /// </summary> public void Print(string text) { // デフォルトの文字色で表示する ColorPrint(MyTextBox.ForeColor, text); } /// <summary> /// 色付きのテキスト表示 /// </summary> public void ColorPrint(Color textColor, string text) { // テキストを末尾に追加する AddText(textColor, text); // 行数がMyMaxLinesを超えたら先頭行から削除する CheckLines(MyMaxLines); // もし必要なら末尾までスクロールする ScrollToEnd(); } // リッチテキストボックスの末尾に色付きのテキストを追加する private void AddText(Color textColor, string text) { // 文書データの末尾を選択する MyTextBox.Select(MyTextBox.TextLength, 0); // 文字の色を指定する if (MyTextBox.SelectionColor != textColor) { MyTextBox.SelectionColor = textColor; } // テキストを追加する MyTextBox.AppendText(text); } // リッチテキストボックスの行数がmaxLinesを超えないようチェックする private void CheckLines(int maxLines) { // 全体の行数を得る int nLines = MyTextBox.GetLineFromCharIndex(MyTextBox.TextLength); if (nLines > maxLines) { // 余分な行数を得る int delLines = nLines - maxLines; // 余分な文字数を得る int delChars = MyTextBox.GetFirstCharIndexFromLine(delLines); // 余分な文字を先頭から削除する MyTextBox.Select(0, delChars); MyTextBox.SelectedText = ""; } } // 末尾の文字が見える位置まで、リッチテキストボックスをスクロールする private void ScrollToEnd() { // 文書データの末尾を選択する MyTextBox.Select(MyTextBox.TextLength, 0); // 選択位置までスクロールする MyTextBox.ScrollToCaret(); } } }

修正したライブラリをコンパイルしたら、「MyLibV02.dll」というファイル名で保存する。今後ライブラリの修正や機能強化のたびに、「V」の後ろの番号を増やしていく予定である。

●プログラム本体

1. NetJobという名前で、プロジェクトを作成する
2. ソリューションエクスプローラの「参照」で、MyLibV02.dllの参照を追加する
3. Form1.csを開き、次のコードを入力する

// プロジェクト：NetJob // ファイル名：Form1.cs using System; using System.Net; using System.Drawing; using System.IO; using System.Windows.Forms; using MarugeProject; namespace NetJob { public partial class Form1 : Form { // コントロールなど private SplitContainer MySplitBox; private RichTextBox MyRichTextBox; private PictureBox MyPictBox; private TextBox MyInputBox; private Button MyGetButton; private RichReporter MyReporter; // フォームのコンストラクタ public Form1() { InitializeComponent(); // タイトルバーにプログラム名を表示する this.Text = Application.ProductName; // ウィンドウサイズを400x400にする this.Width = 400; this.Height = 400; // 上下分割コンテナを作る MySplitBox = new SplitContainer(); MySplitBox.Name = "MySplitBox"; MySplitBox.Anchor = AnchorStyles.Left | AnchorStyles.Right | AnchorStyles.Top | AnchorStyles.Bottom; MySplitBox.Left = 8; MySplitBox.Top = 8; MySplitBox.Width = this.ClientSize.Width - 16; MySplitBox.Height = this.ClientSize.Height - 40; MySplitBox.BorderStyle = BorderStyle.FixedSingle; MySplitBox.Orientation = Orientation.Horizontal; MySplitBox.SplitterDistance = 200; // 分割コンテナの上側にピクチャボックスを配置する MyPictBox = new PictureBox(); MyPictBox.Name = "MyPictBox"; MyPictBox.BorderStyle = BorderStyle.None; MyPictBox.Dock = DockStyle.Fill; MySplitBox.Panel1.Controls.Add(MyPictBox); // 分割コンテナの下側にリッチテキストボックスを配置する MyRichTextBox = new RichTextBox(); MyRichTextBox.Name = "MyRichTextBox"; MyRichTextBox.BorderStyle = BorderStyle.None; MyRichTextBox.Dock = DockStyle.Fill; MySplitBox.Panel2.Controls.Add(MyRichTextBox); // 「画像を読み込む」ボタンを作る MyGetButton = new Button(); MyGetButton.Name = "MyGetButton"; MyGetButton.Anchor = AnchorStyles.Right | AnchorStyles.Bottom; MyGetButton.Left = this.ClientSize.Width - 128; MyGetButton.Top = this.ClientSize.Height - 30; MyGetButton.Width = 120; MyGetButton.Text = "画像を読み込む(&R)"; MyGetButton.Click += MyGetButton_Click; // テキスト入力ボックスを作る MyInputBox = new TextBox(); MyInputBox.Name = "MyInputBox"; MyInputBox.Anchor = AnchorStyles.Left | AnchorStyles.Right | AnchorStyles.Bottom; MyInputBox.Left = 8; MyInputBox.Top = MyGetButton.Top + 2; MyInputBox.Width = this.ClientSize.Width - MyGetButton.Width - 18; MyInputBox.Text = "http://"; // 各コントロールをフォームに配置する this.SuspendLayout(); this.Controls.Add(MySplitBox); this.Controls.Add(MyGetButton); this.Controls.Add(MyInputBox); this.ResumeLayout(); // テキスト出力の準備 MyRichTextBox.DetectUrls = false; MyRichTextBox.Font = new Font("MS UI Gothic", 12); MyReporter = new RichReporter(MyRichTextBox); // 初期メッセージを出力 MyReporter.Print("使用方法：\n"); MyReporter.Print("URLを入力 → 「画像を読み込む」をクリック\n\n"); } // 「画像を読み込む」ボタンをクリック private void MyGetButton_Click(object sender, EventArgs e) { MyRichTextBox.Clear(); MyReporter.Print("接続します\n"); Image image = ReadNetImage(MyInputBox.Text); if (image != null) { MyReporter.Print("成功しました\n"); MyPictBox.Image = image; } else { MyReporter.ColorPrint(Color.Red, "失敗しました\n"); } } // ネットにアクセスして画像を読み込む private Image ReadNetImage(string URL) { Stream stream = null; try { // ネットから画像を読み込み、Image型で返す WebClient client = new WebClient(); stream = client.OpenRead(URL.Trim()); return Image.FromStream(stream); } catch { // 読み込み失敗ならnullを返す return null; } finally { // 成功でも失敗でも、戻る前に必ずストリームを閉じる if (stream != null) { stream.Close(); } } } } }

プログラムを起動し、左下の入力欄に画像ファイルのURLを入力して「画像を読み込む」ボタンを押すと、ピクチャボックスに表示されるはずなのでお試しを。

今回から始まる「ネット接続」シリーズの土台となるプログラムなので、ウィンドウ構成もちょっと凝ってみた。基本は上下に分割されたウィンドウがあって、上部にデータ表示ウィンドウ（今回はピクチャボックス）、下部にレポート出力用のテキストボックスを配置している。

●要点の解説

ネット接続の中心になるのはWebClientクラスだ。このクラスは指定されたURLに接続し、そこからデータを読み出すという縁の下の作業を受け持つ。そのデータをどのように処理するかは、個々のプログラムの仕事である。

今回は画像の取得なので、Image.FromStream()メソッドでストリームからデータを読み出すだけでImage型の画像が作られる。