2015年12月8日火曜日

日本語エンコーディングはややこしい

今日の目標→

日本語のEncodingについてあらためて調べているところである。とりあえず途中経過の報告を。

●各種エンコードのHTMLをブラウザで表示するテスト

まずは基本的なところで、いろいろなエンコードのHTMLファイルをWebブラウザで表示してみた。ファイルは公開スペースに置いたので、よかったらご自由にアクセスしてください。

こちら→ http://pilikala.net/yuima/encoding/

この9種類のHTMLファイルを、FireFoxとIEで表示した結果が次である。

No.ファイル名エンコードcharset備考FFIE
1.file_Shift_JIS.htmlCP932Shift_JIS-
2.file_EUC-JP.htmlCP51932EUC-JP-
3.file_ISO-2022-JP.htmlCP50221ISO-2022-JP-
4.file_UTF-8.htmlUTF-8UTF-8-
5.file_UTF-8_BOM.htmlUTF-8UTF-8BOMを付加
6.file_UTF-16LE.htmlUTF-16LEUTF-16LE-
7.file_UTF-16LE_BOM.htmlUTF-16LEUTF-16BOMを付加
8.file_UTF-16BE.htmlUTF-16BEUTF-16BE-
9.file_UTF-16BE_BOM.htmlUTF-16BEUTF-16BOMを付加×

なぜかIEがひとつ表示に失敗している。HTTPヘッダでcharsetも送信しているはずなのにおかしいな。

てな感じで調査継続中、続きは、この記事に追加していきます。

2015年12月7日月曜日

P013-URLをドラッグ&ドロップ

今日の目標→

UnicodeのBOMについて探求する前にちょっと脇道へ。 いちいちURLを入力するのが面倒になってきたので、 今回はWebブラウザからURLをドラッグ&ドロップできるようにプログラムを改造してみる。

●Webブラウザからのドラッグデータを受け取るには

最近のWebブラウザは、 画面上のリンクや画像などをドラッグ&ドロップで持ち出せるので非常に便利である。 問題は、Webブラウザのドラッグ&ドロップには標準的な手法が決まっておらず、 各陣営が好き勝手にやっているという点だ。

試しにフォームのDragDropイベントに次のようなコードを書いて実行してみるといい。

ブラウザ画面から上記のフォームにリンクか何かをドラッグ&ドロップすると、 いろいろな形式のデータが取得可能なことがわかる。 ただし種類はFireFoxとChromeとMS Edgeでバラバラだ。 唯一共通しているのは、

UniformResourceLocator

という形式のドロップデータである。 これは字面からわかる通りURLを表している。 この形式のドロップデータからURLを文字列として取り出すには次のように書く。

URL以外のデータにも便利なものがありそうで、 たとえばブラウザから画像をドラッグ&ドロップした場合、 ローカルPCのキャッシュデータなんかもとれるみたいだが、 ブラウザごとに挙動が変わるのが困るなあ。 まあURLさえわかってれば、もっかいデータを読みにいけばいいんだし…。

●プロジェクトの作成

というわけで、前々回(P011~)で作成したNetJob2を改造する。

  1. プロジェクト作成ウィンドウを開く
  2. 「Windowsフォームアプリケーション」テンプレート、名前は「NetJob3」でプロジェクトを作る
  3. Form1.csを開き、NetJob2のFomr1.csをコピペし、次のように改造する

プログラムを実行し、ブラウザからURLをドラッグ&ドロップできることを確認する。やっぱドラッグ&ドロップは便利だなあ。

2015年12月6日日曜日

P012-BOMの処理はどうするか

今日の目標→

前回のプログラムで、Unicodeのファイルを読み込むと、ときどき先頭に妙な空白が表示されるのに気がついた。これはBOMだ。何とかしないと。

●BOM(バイトオーダーマーク)について

Unicodeテキストは、その保存形式を見分けやすくするため、最初にUnicode文字の「\uFEFF」を付けることがある。これがBOM(バイトオーダーマーク)である。文字の値としては「\uFEFF」ひとつだが、ファイルへの保存形式によって次の違いが出る。

  • UTF-16BE
    -- 16ビットをビッグエンディアンで保存するため、BOMは(fe, ff)となる。
  • UTF-16
    -- リトルエンディアンで保存するため、BOMは(ff, fe)の順になる。
  • UTF-8
    -- 可変長データに変換するため、BOMは(ef, bb, bf)の3バイトになる。

UTF-16BEとUTF-16は、データ内容からどちらなのか判別するのが原理的に難しいため、BOMの付加が強く推奨されている。いっぽうUTF-8の場合はBOMがなくても判定は容易だし、プログラムによっては未対応だし、あまりBOMを付けるメリットはない。

●いろいろな形式のUnicodeファイルを作る

実際に各種の形式のUnicodeファイルに触れてみるとわかりやすい。せっかくだからC#でいろいろなファイルを作ってみよう。コードは下記。今回はコンソールアプリケーションにしてみた。

  1. 「ファイル(F)」→「新しいプロジェクト(P)」で、プロジェクト作成ウィンドウを開く
  2. カテゴリ「Visual C#」で、テンプレート「コンソールアプリケーション」を選ぶ
  3. 名前を「EncodeFiles」と入力してプロジェクトを作成する
  4. Program.csを開き、次のコードを入力する

実行すると、PCのデスクトップに「WorkFolder」というフォルダができ、さらにその中にいろいろなエンコードのHTMLファイルが作られる。

●次回の予告

BOMの処理の続き。

2015年12月5日土曜日

P011-ネットのテキストを読み込む

今日の目標→

ネットから画像が読み込めたら、次はテキストの読み込みだろう。

●MyLibの拡張

ネット上の日本語テキストって、ほぼUTF-8に統一されたのかな? でもやっぱり、今でも文字コードの判別は避けて通れないだろうなあ。 昔作った文字コード判定クラスがあるので、これを流用しよう。

というわけで、次のクラスをMyLibライブラリに追加する。

おそらく世の中にはもっと優秀なライブラリがあるだろうが、まあ自作のコードは愛着があるよね。 コードを入力し終えたらコンパイルして、「MyLibV03.dll」というファイル名で保存する。

●プログラム本体

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

プログラムを起動し、テキストファイルのURLを入力して「テキストを読み込む」ボタンを押すと、上部のテキストボックスに内容が表示される。

テキストとは言うけどプレーンテキストだけじゃなくて、HTMLファイルも、RSSフィードも、中身は文字だけなのでこのプログラムで表示できる。

●要点の解説

WebClientクラスを利用してネットからデータを読み出すのは、画像の場合と同じだ。

ちょっと違うのは、前回はReadOpen()メソッドを利用しネットデータをストリーム形式でオープンしたが、今回はDownloadData()メソッドを利用して全データを一気にbyte配列に取得したことだ。メモリが少なかった昔はこういう大名プログラムは書かなかったが、時代は変わったのだ。

っていうか今考えたら、画像データもこのDownloadData()メソッドで取得すればよかったじゃない。そうすればストリームを閉じるの閉じないので、エラーが起きることもなかった…かもしれない。

取得した生のデータは、先ほどのMyLibライブラリのEncodingCheckerで文字コードを調べる。ちなみに使い方は、

Encoding enc = EncodingChecker.GetEncoding(バイト配列);

とすれば指定したバイト配列のエンコードを推測し、Encoding型の結果をencに入れる。あとは通常のEncoding.GetString()メソッドにより、適切な方法でstring型に変換可能だ。

2015年12月4日金曜日

バグ修正

今日の目標→

今日はバグの修正だけ。

●修正箇所

前回のForm1.csで、ReadNetImage()メソッドの次の部分に問題があった。

return Image.FromStream(stream);

これは次の3行のコードに差し替える。

MemoryStream mem = new MemoryStream();
stream.CopyTo(mem);
return Image.FromStream(mem);

そもそもWebClient.OpenRead()の説明で、「ストリームはすぐ閉じろ」的なことが書いてあるから、即クローズしていたのである。しかも、確実にストリームをクローズできるように、わざわざtry~catch~finally構文とか使ってた。

ところが、Image.FromStream()の説明を見たら、「読み込んだ画像の使用中はストリームを閉じちゃダメ」だって。なんだよそれ。

結局、ネットデータのストリームはメモリにコピーして接続を切る。そしてメモリストリームはクローズせず後始末をガベコレにまかせる、という折衷案にたどり着いたのであった。

バグ修正後のForm1.csが下記である。

旧版のプログラムはアニメーションGIFを読み込ませると不正終了した。今度は大丈夫だろう…たぶん…。

2015年12月3日木曜日

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

今日の目標→

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

●MyLibの修正

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

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

●プログラム本体

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

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

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

●要点の解説

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

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

2015年12月2日水曜日

P009-DLLライブラリを使う

今日の目標→

自作のDLLライブラリを呼び出して使う。

●プロジェクトの作成

通常の「Windowsフォームアプリケーション」テンプレートで、「TextWork5」プロジェクトを作る。前回の作業のせいで、デフォルトは「クラスライブラリ」のテンプレートになってると思うので注意。

●「参照」の追加

プロジェクトが作られたら、自作DLLファイルの参照を追加する。

  1. ソリューションエクスプローラの「参照」を右クリック→「参照の追加(R)」
  2. 標準リストの中にないDLLは、下の「参照(B)」ボタンを押して自力で探す
  3. 前回作った「MyLib.dll」が見つかったら、「追加」ボタンを押す

これで「参照」にMyLibが追加された。

●MyLibを呼び出すコードを入力

Form1.csの最初に、

using MarugeProject

と書けば、MyLibで定義した公開メソッドが呼び出せるようになる。

なんだったら完全修飾名で「MarugeProject.RichReporter()」みたいに書いてもよい。

●実は重大なミスが

前回、MyLibのRichReporter.csのコードを書いたとき、

namespace MarugeProject

の「M」が全角でした…。なんか変だと思ったんだよ。しょうがないので、今回のTextWork5のコードでも全角「M」を使ってます。次回までにMyLibのほうを修正しなくては…。

2015年12月1日火曜日

P008-DLLライブラリの作成

今日の目標→

自作クラスをDLL形式のライブラリにする手順を述べる。 やたら長くなったけど、このライブラリは後でいろいろ機能を追加して育てていく土台になるので頑張る。

●ライブラリ用のプロジェクトを作成

DLLライブラリを作るには、いつもの「Windowsフォームアプリケーション」ではなく、次のように「クラスライブラリ」のテンプレートを選ぶ。

  1. メニューバーから「ファイル(F)」→「新しいプロジェクト(P)」で、プロジェクト作成ウィンドウを開く
  2. 左のカテゴリで「Visual C#」、右のアイコンで「クラスライブラリ」を選ぶ
  3. 名前を「MyLib」と入力して「OK」ボタンをクリックする

●「参照」の追加

プロジェクトができたら、ウィンドウ右上のソリューションエクスプローラで、「参照」をダブルクリックすると、このプロジェクトで使える外部ライブラリの一覧が表示される。このままだと足りない感じなので、次の手順でライブラリを追加しておく。

  1. ソリューションエクスプローラの「参照」を右クリック→「参照の追加(R)」
  2. 左のカテゴリで「アセンブリ」、サブカテゴリ「フレームワーク」を選ぶ
  3. 右のリストで「System.Drawing」を探してチェックマーク
  4. 同じく右のリストで「System.Windows.Forms」を探してチェックマーク
  5. 「OK」ボタンを押す

これで「参照」にSystem.DrawingとSystem.Windows.Formsが追加された。今はこれで十分だ。後で足りないものがあったら、そのときにまた追加すればよろしい。

●不要なコードを削除

デフォルトで存在する「Class1.cs」は不要なので、ソリューションエクスプローラで消しておく。

Class1.csを右クリック→「削除(V)」

●自作クラスのコードを追加

ライブラリに自作クラスのコードを追加する。手で入力しても良いし、すでに存在するなら次のようにファイルから読み込んでも、どっちでも良い。

  1. メニューバーから「プロジェクト(P)」→「既存の項目の追加(G)」でファイルダイアログを開く
  2. "TextWork3"プロジェクトのフォルダを探す
  3. ファイル"RichReporter.cs"を選択する
  4. 「追加」ボタンを押す

●コードのnamespaceを変更

前回も書いたとおり、ライブラリのnamespaceは自分好みに変えて良い、というか変更すべきである。本当は中二病的なカッコいい名前が好きなんだけど、まあ妙にこだわると後で恥ずかしいからな…。というわけで好きなピザにちなんで、

namespace MarugeProject

に決定。読み方は「マルゲプロジェクト」ね。変更後のコードを下記に示す。

namespace以外に変更した箇所はない。

●プロジェクトをコンパイルしてDLLファイルを作る

クラスライブラリの作成プロジェクトは、いつものように「開始」ボタンで実行はできない。その代わり次の方法でコンパイルする。

メニューバーから「ビルド」→「ソリューションのビルド」を選択

コンパイルが終わると、プロジェクトのフォルダの下、bin\Debugサブフォルダに「MyLib.dll」というファイルが作られる。これがDLL形式のライブラリである。

なお、bin\Debugサブフォルダは一時的な保管場所で、たとえば「ビルド(B)」→「ソリューションのクリーン(C)」メニューを実行すると削除されてしまう。なので完成したDLLファイルは適当な別フォルダにコピーしておくとよいかも。

●次回の予告

うわー記事が長くなりすぎた。今日はここまでといたします。作成したDLLライブラリを呼び出して利用する手順は、次回で書くことにします。

あと、本ブログの記事で作ってるプログラムをアーカイブして、ダウンロードできる方法を考えています。どこにファイルを置くかが問題だ。

2015年11月30日月曜日

P007-自作ライブラリを使ってみる

今日の目標→

プログラムコードを使い回せたら楽じゃね? そんなプログラマの永遠の夢を実現するのがライブラリだ。今回はライブラリ自作の基礎を説明する。

●プロジェクトの準備

まずは「TextWork4」という名前で、新規プロジェクトを作る。

●前回作ったクラスを現プロジェクトに組み込んでみる

  1. メニューバーから「プロジェクト」→「既存の項目の追加」で、ファイルダイアログを開く
  2. 前回の"TextWork3"プロジェクトのフォルダを探す
  3. ファイル"RichReporter.cs"を選択する
  4. 「追加」ボタンの右にある「▼」記号をクリックし、「リンクとして追加」を選択する

これで前回のRichReporterのソースコードにリンクが張られ、このプロジェクトから利用できるようになった。なお、「リンクとして追加」じゃなく、ただの「追加」でも良いのだが、その場合はファイルがまるっとコピーされる。

●RichReporerクラスを利用するコードを書く

  1. Form1.csを開く
  2. 次のコードを入力する

こうやって前回書いたコードを読み込んで使えると、コピペとか駆使するよりずっと楽ですね。

さてここで、Print()やColorPrint()などメソッドの呼び出し方は前と同じだが、RichRepoterクラスのクラス名を、

TextWork3.RichRepoter

と長い名前で指定しているのに注目してほしい。

なぜならば、今回のプログラムは「namespace TextWork4」の中で作られているのに対し、前回のプログラムは「namespace TextWork3」で作られていたからだ。このように所属が異なるクラスを指定するには、相手のnamespaceを含む長い名前、すなわち「完全修飾名」を使わなくてはならない。

もし、いちいち完全修飾名を書くのが面倒なら、ファイル先頭で次のように宣言してもよい。

using TextWork3;

このusing宣言があれば、以後クラス名の頭の「TextWork3.」は省略できる。

●なんでnamespaceなんかがあるの

namespaceがあるのは、名前の衝突をできるだけ回避するためだ。コンパイラ内部では常に完全修飾名でクラスが区別されるので、短いクラス名が同じでもnamespaceが違えば異なるクラス名となり、名前がぶつからない。

だから実はnamespaceには、「世界の誰とも一致しない独自の単語」を採用するのが理想だったりする。デフォルトはプロジェクト名と同じnamespaceがついているが、自作ライブラリを作る場合などは、独自のかっこいいnamespaceに書き換えたうえでコードを記述していくとよい。

あ、せっかくだからこれは次回のネタに回します。

●次回の予告

ライブラリの作り方後編。自作クラスをDLL化して、それを呼び出します。

2015年11月29日日曜日

P006-色付き表示をライブラリ化

今日の目標→

前回は、「色付き文字を出力するメソッド」を作った。使ってみたら結構便利なので、他のプログラムからでも利用できるように、これをライブラリ化してみる。

●プロジェクトの作成

とりあえず「TextWork3」という名前で、新規プロジェクトを作る

●色付き文字表示用クラスRichReporterの作成

  1. メニューバーから「プロジェクト」→「クラスの追加」を選ぶとクラス追加ウィンドウが開く
  2. 左のカテゴリで「コード」を選び、右のアイコンから「クラス」を選ぶ
  3. 名前を「RichReporter.cs」として「追加」を押すと、新しいコードウィンドウが開く
  4. 次のコードを入力する

メソッドの中身は、前回(TextWork2)のForm1.csとまったく変わらないので、ほとんどコピペでいけるはず。ただしPrint()とColorPrint()は公開メソッドにするので、private宣言をpublicに修正してちょ。

●フォームからRichReporterクラスを利用する

  1. Form1.csを開く
  2. 次のコードを入力する

RichReporterクラスの使い方は、まず

MyReporter = new RichReporter(MyTextBox);

のように、出力先を指定してRichReporterのオブジェクトを作る。そして、

MyReporter.ColorPrint(Color.Red, "ほげほげ");

みたいな形でメソッドを呼び出せば、指定した出力先にテキストが表示されるという寸法だ。ね、簡単でしょう?(反語表現)

●次回の予告

次回はこのRichRepoterライブラリを、ソースコードのままリンクして利用する方法と、DLL化して利用する方法について説明する。

2015年11月28日土曜日

P005-文字を色付きで表示

今日の目標→

文字に色を付けたり、行をスクロールさせるなど、RichTextBoxを使ったテキスト表示のテクニックを探る。

●プロジェクトの作成

  1. 「TextWork2」という名前で、新規プロジェクトを作る
  2. Form1.csのコードを開き、前回(TextWork)のForm1.csのコードをコピペする
  3. コードを次のように修正する。

これも「開始(S)」ボタンで表示が始まり、「停止(E)」ボタンで止まる。見どころは次の3つ。

  • 開始と停止メッセージに色がついている
  • 文字表示が最下部に達するとスクロールする
  • 行数が20行を超えると先頭行から順に消えていく

(実行画面が入る予定)

●文字に色

RichTextBoxで、文字に色を付ける方法は2つある。

(A) すでに表示されている文字の色を変えるには

  1. Select()メソッドで、色を変えたい文字範囲を選択
  2. SelectionColorプロパティで、その範囲の色を設定

(B) これから表示する文字の色を変えるには

  1. Select()メソッドで、テキスト末尾の「長さ0の範囲」を選択
  2. SelectionColorプロパティで、文字色を設定
  3. この状態でAppendText()メソッドを実行すると文字に色がつく

今回はAddText()の定義の中で(B)の方法を使っているので見てみてね。

●余分な行を削除

行の削除にはコツがある。というのも、RichTextBoxの操作は基本的にキャラクタ単位で行うため、行単位の操作は面倒なのだ。そこで次の2つのメソッドの出番となる。

  • GetLineFromCharIndex() -- 文字の位置から行番号を得る
  • GetFirstCharIndexFromLine() -- 行番号からその行の先頭の文字位置を返す

今回はCheckLines()の定義の中でこれらを使っている。

●最下行までスクロール

RichTextBoxにはScrollToCaret()メソッドというものがあって、キャレットが見える位置までウィンドウをスクロールできる。キャレットというのは、文字入力の位置でチカチカ点滅している線のことだ。文字カーソルともいう。

キャレットを移動するには、Select()メソッドで、任意の文字位置に「長さ0の範囲」を指定すればよい。

今回はScrollToEnd()の定義の中でこの方法を使っている。

以上、とても駆け足の説明でした。まあ、詳しいことはコードを読んでください。

●今日から投稿は丑三つ時に

今後の投稿ペースですが、できれば毎日1記事を目指します。 もちろん全部プログラムネタは無理っぽいので、ただの独り言の場合もあります。

投稿時刻はブログの設定で毎回午前2:00に統一しようと思います。あまりバラバラな投稿時刻だと、どんな生活リズムだと思われそうで恥ずかしいから…。

2015年11月27日金曜日

P004-テキスト表示プログラム

今日の目標→

ここまで画像表示ばっかり続いたので、テキスト表示にも挑戦する。

●プロジェクトの作成

  1. 「TextWork」という名前で、新規プロジェクトを作る
  2. Form1.csのコードを開き、次のプログラムを入力する

プログラムを実行し、「開始(S)」ボタンを押すと、現在時刻を1秒ごとに繰り返して表示する。「終了(E)」ボタンを押すと停止する。

●要点の解説

文字出力には各種の方法がある。たとえばConsole.Write()によるコンソール出力とか、Labelコントロールにテキストを表示するとか。しかしいろいろ試した結果、いちばん便利だと思ったのは、テキストボックスを1個配置して、そこにテキスト出力を垂れ流していく方法だ。

このときただのTextBoxクラスではなくRichTextBoxクラスを使えば、文字に色をつけたりできて面白い。次の記事からしばらくは、RichTextBoxを利用したテキスト出力や文字列処理についてみていきたい。

あと今回使ったタイマー(Windows.Forms.Timerクラス)についても、いつか説明したいところ。

(実行画面が入る予定)

2015年11月25日水曜日

P003-クリップボードから画像をペースト

今日の目標→

前回のプログラム(ImageView2)に手を加え、クリップボードから画像を貼り付けられるようにする。

●プロジェクトの作成

  1. 「ImageView3」という名前で、新規プロジェクトを作る
  2. Form1.csのコードを開き、ImageView2のForm1.csからコードをコピペする
  3. コードを次のように修正する。

コードを書き終えたらさっそく実行してみよう。他のソフト上で画像の「コピー」を実行し、このプログラムの「貼り付け」メニューを選択すると、ピクチャボックスに画像が表示されるはずだ。

●要点の解説

クリップボードとの画像データのやりとりは単純だ。次の2つのメソッドを使えばいい。

  • Clipboard.SetImage() → クリップボードに画像を保存する
  • Clipboard.GetImage() → クリップボードから画像を取得する

まあ実際は、このお手軽なメソッドにも弱点があって、透過GIFや透過PNGをクリップボード経由でやりとりすると透明色が消えてしまったりする。この問題は、昔なんかして解決した記憶があるので、あとで思い出したら解決法を書いてみる。

しかし今回の追加コードのほとんどがメニュー関連の処理になってしまった。ここでは標準のMenuStripクラスじゃなくて、古くからあるMainMenuクラスを使っている。古いプログラムから取ってきたコードだけど問題なく動いてよかった。

またメニューの設定データにXMLを利用している。こういうメニューみたいな階層構造のデータは、XMLで記述するのが楽である。XMLの使い方はそのうちちゃんと説明するので、しばらくお待ちくだされ。

(実行画面が入る予定)

2015年11月24日火曜日

P002-ファイルをドラッグ&ドロップで開く

今日の目標→

前回のプログラム(ImageView)に手を加え、ドラッグ&ドロップで画像ファイルを開けるようにする。

●プロジェクトの作成

  1. 「ImageView2」という名前で、新規プロジェクトを作る
  2. Form1.csのコードを開き、前回のForm1.csのコードをコピペする
  3. コードを次のように修正する。

しかしこれ<textarea>タグでコードを表示してるんだけど読みにくいな。別の表示法にしたほうがいいかな。まあ、おいおい考えよう。

●要点の解説

フォームに対してドラッグ&ドロップを行うには、少なくとも次の3つが必要だ。

  • DragEnterイベントの処理ルーチンを追加する
  • DragDropイベントの処理ルーチンを追加する
  • AllowDropフラグをtrueに設定する

イベント処理ルーチンの入力はVisual Studioが助けてくれるので楽ちんである。たとえばDragEnter処理を書く場合は次のようになる。

  1. まず「this.DragEnter +=」まで手で入力する
  2. TABキーを押すと、自動的にイベントハンドラの枠組みのコードが挿入される
  3. Enterキーを押すと確定する。Enterキーを押す前にハンドラ名の変更もできるが、まあ必要ないと思う
  4. イベントハンドラの枠組みができたら、あとは中身を自分でコーディングする

DragEnterハンドラとDragDropハンドラの中身は、定型の処理なので説明は省略する。わからない部分があればコメント欄ででも質問してください。できる範囲で答えます。

コードを書き終えたらさっそく実行してみよう。Windowsのフォルダから適当な画像ファイルをドラッグして、このプログラムのフォームにドロップすれば、画像が表示されるはずだ。

(実行画面が入る予定)

P001-画像表示プログラム

最近ではC#もいろいろ進化してるようだけど、まあその辺はいずれ学ぶとして、とりあえず昔の知識でできるところから始めよう。「画像をピクチャボックスに表示するプログラム」なんか簡単でいいかな。

●プロジェクトの作成

  1. メインメニューから[ファイル]→[新しいプロジェクト]を選ぶく
  2. 開いたウィンドウで、左上のツリーから[Visual C#]を選ぶ
  3. 右のテンプレート一覧から[Windowsフォームアプリケーション]を選ぶ
  4. 下の名前欄にプログラムの名前を入力(ここではImageViewとした)
  5. [OK]ボタンを押すと、プロジェクトが新規作成される

ここでツールバーの[開始]ボタンをクリックすると、プログラムがコンパイルされ、起動し、何もないウィンドウが表示された。よしよし昔と変わってないね。

(画像が入る予定)

●コードの入力

さてそれじゃコードを書いていくよ。ソリューションエクスプローラで、

Form1.csの名前を右クリック→[コードの表示]を選択

すると、コードウィンドウが開くから、次のようにコード入力する。

ボタン等の配置は、Visual Studioのデザイナー上でマウスで置くこともできるが、個人的には上記のようにぜんぶコードで書くほうが好きだ。そのほうが早いし。

コード入力が終わったら、ツールバーの[開始]ボタンを押すとプログラムが起動する。[ファイル参照]ボタンで適当な画像ファイルが読み込めることを確認すべし。

(画像が入る予定)

2015年11月23日月曜日

Windowsのユーザー環境設定(その4)

新規アカウント作成時にやっとくべき定番の環境設定。これでラストのはず。

●ファイル名拡張子を見えるようにする

  1. タスクバーからエクスプローラーを起動する
  2. [表示]メニューを選ぶ
  3. [ファイル名拡張子]にチェックマークをつける

プログラム開発時にファイル名拡張子が見えないのは、何かと不便なので、見えるようにしておく。これは[表示]→[オプション]で開くウィンドウで設定することもできるが、チェックボックスのほうがお手軽。

●コンソールウィンドウのフォント等をお好みで設定

コンソールウィンドウとは、キャラクタベースのプログラムを実行するとき表示されるウィンドウだ。デフォルトのフォントやサイズをここで設定できる。

  1. スタートメニューを右クリック→[コマンドプロンプト]を開く
  2. タイトルバー左端のメニューをクリック→[規定値]を選ぶと、[コンソールウィンドウのプロパティ]ウィンドウが開く
  3. [フォント]タブで、フォントを設定できる
  4. [レイアウト]タブで、ウィンドウの位置とサイズを指定できる

ちなみにタイトルバー左端のメニューの[プロパティ]では、コマンドプロンプト自体の設定ができ、それは規定値を上書きする。[規定値]は全キャラクタベースプログラムの基本設定である。

●Microsoft IMEが外部サーバと通信するのを停止

  1. スタートメニューからコントロールパネルを開く
  2. 右上の検索ボックスに「IME」と入力する
  3. 検索結果に出てきた[Microsoft IMEの設定(日本語)]を開く
  4. 設定ウィンドウが開くので[詳細設定]をクリック
  5. [クラウド候補を使用する]のチェックをはずす

変換時にいちいちBing(Microsoftの検索エンジン)と通信するのはウザい。まあ予測入力自体もちょっとウザいので、[予測入力を使用する]自体のチェックをはずしてもいい。

2015年11月22日日曜日

Windowsのユーザー環境設定(その3)

Windows10のユーザー環境設定、あとちょっと。

●プライバシー関連の設定

  1. スタート画面から「設定」を開く
  2. [プライバシー]を選ぶ
  3. 左メニューで[全般]が選択されている。[プライバシーオプションの変更]を全部オフにする。
  4. 左メニューで[位置情報]を選ぶ。
    • [位置情報]をオフにする。
    • [場所の履歴]にある[クリア]ボタンを押して、位置情報を消去しておく。
    • [位置情報を使えるようにするアプリを選ぶ]は、全部オフになっている。
    • [ジオフェンス]も、何かあれば全部オフに。
  5. 左メニューで[カメラ]を選ぶ。
    • [アプリがカメラを使うことを許可する]は、オフにしておけば安心だが、まあテレビ電話の利用などを考慮して、ここはオンにする。
    • [カメラを使用できるアプリの選択]は、必要なものだけオンにして残りをオフにする。
  6. 左メニューで[マイク]を選び、音声入力が必須なアプリだけオンにして、残りはオフにする。
  7. 左メニューで[音声認識、手描き入力、入力の設定]を選び、[自分の情報を知らせない]→[オフにする]を実行する。
  8. 左メニューで[アカウント情報]を選び、右の[アカウント情報]をオフにする
  9. 左メニューで[連絡先]を選び、とりあえず全部オフにする。なにか問題が生じたら、個別のアプリに対して連絡先をオンにする。
  10. 左メニューで[カレンダー]を選び全部オフ。問題が生じたら、個別のアプリに対してカレンダーの公開をオンにする。
  11. 左メニューで[通話履歴]を選び、全部オフで。
  12. 左メニューで[メール]を選び、全部オフで。
  13. 左メニューで[メッセージング]を選び、全部オフで。
  14. 左メニューで[無線]を選び、全部オフで。
  15. 左メニューで[他のデバイス]を選び、全部オフで。
  16. 左メニューで[フィードバックと診断]を選び、お好みで設定する。
  17. 左メニューで[バックグラウンドアプリ]を選び、使うものだけオン、残りをオフにする。

Windowsのユーザー環境設定(その2)

Windows10のユーザー環境設定の続き。

●デスクトップの色などを設定する

  1. スタート画面から、コントロールパネルを開く
  2. [デスクトップのカスタマイズ]を開く
  3. [個人設定]を開く
  4. [デスクトップの背景]を開き、背景を[単色]にして背景色を選ぶ。
  5. 左のメニューから[色]を選ぶ
    • [背景から自動的にアクセントカラーを選ぶ]はオフ。自分で色を選ぶ。
    • [スタート、タスクバー、アクションセンター、タイトルバーに色を付ける]はオンにするのが良い。オフにするとウィンドウのタイトルバーや枠線が白くなり、重なったウィンドウの境界がわかりにくい。
    • [スタート、タスクバー、アクションセンターを透明にする]はオンにするほうがかっこいいが、お好みでオフにする選択もアリ。
  6. 左のメニューから[ロック画面]を選ぶ
    • [背景]は、画像でもスライドショーでも、お好みで。
    • [ロック画面にトリビアやヒントなどの情報を表示する]は、オンにするとロック画面がうざいのでオフにする。
    • [状態の詳細を表示するアプリを選ぶ]も、うざいので[なし]にする。
    • [簡易ステータスを表示するアプリを選ぶ]も、すべて[なし]にする
    • [サインイン画面にWindowsの背景画像を表示する]は、オンにする。こうするとマルチユーザー環境では、サインインの名前を選んだときに各人の選んだ背景が表示されるのでわかりやすい。
    • [スクリーンタイムアウト設定]はデフォルトで良いため変更しない。
    • [スクリーンセーバー設定]もデフォルトで良いため変更しない。
  7. 左のメニューから[テーマ]を選ぶ
    • [テーマの設定]は、コントロールパネルに戻るだけなのでいじらなくていい
    • [サウンドの詳細設定]は、デフォルトで良いので何もしない。
    • [デスクトップのアイコンの設定]もデフォルト(ゴミ箱だけ表示)で良い。
    • [マウスポインターの設定]もデフォルトで良い。
  8. 左のメニューから[スタート]を選び、お好みでオンオフを設定する。おすすめは「全部オフ」である。

Windowsのユーザー環境設定(その1)

新しいアカウントでWindows10にログインしたら、さっそくユーザー環境を設定する。以下はプログラミングに関係ない部分もあるが、メモ代わりに手順を最初から詳しく書いてみる。

●スタート画面の整理

まずはスタートボタンで「スタート画面」を開くと、初期設定でいろいろなアプリのアイコンが並んでいる。どれもいらないので消す。アイコンを消すには、

アイコンを右クリック→[スタート画面からピンをはずす」

を実行すれば良い。

画面がさっぱりしたら必要なアイコンを追加していく。スタート画面の「すべてのアプリ」を開くと、いろいろなアプリが出てくるので、必要なものだけスタート画面にピン留めする。ピン留めは、

アプリ名を右クリック→[スタート画面にピン留めする」

で可能である。ここでは以下のアプリをピン留めする。

  • [Windowsアクセサリ]→[Snipping Tool]
  • [Windowsアクセサリ]→[ペイント]
  • [Windowsアクセサリ]→[メモ帳]
  • [Windowsシステムツール]→[コントロールパネル]
  • [せ]→[設定]

特に[コントロールパネル]と[設定]は、以後の作業で使うので、忘れずにピン留めしておくべし。

●タスクバーの整理

アプリのアイコンはタスクバーに表示することもできる。スタート画面で次の手順を実行すればよい。

アイコンを右クリック→[その他]→[タスクバーにピン留め]

またタスクバー自体を右クリックすると、タスクバーの機能が設定できる。ほとんどデフォルトのままで良いが、「検索ボックス」は邪魔なので消しておく。

タスクバー右クリック→[検索]→[表示しない]

なお、ナビゲータソフトの「Cortana」を一度も起動していないと、検索ボックスの代わりにCortana起動ボタンがあるので、起動して話を聞いてやる。

プログラミング用アカウントの作成

自作プログラムを管理者権限でデバッグしていると、システムの大事なファイルを壊してしまわないか心配になる。

そこで今後のプログラミングは、すべて一般アカウントで作業する。Windows10で一般アカウントを作る手順を次に示す。

  1. スタートメニューを右クリック→[コントロールパネル]を開く
  2. [ユーザーアカウント]カテゴリの[アカウントの種類の変更]を選ぶ
  3. [PC設定で新しいユーザーを追加]を選ぶ
  4. [そのほかのユーザーをこのPCに追加]をクリックすると、ユーザー追加ウィンドウが開く
  5. [このユーザーのサインイン情報がありません]を選ぶ
  6. [Microsoftアカウントを持たないユーザーを追加する]を選ぶ
  7. [このPCを使うのはだれですか?]に、適当な名前を入力する。
  8. パスワードは記入しなくてよし。一般ユーザだから、あまり悪さできないし。
  9. [次へ]ボタンをクリックすれば、ユーザ登録完了。
  10. いったんログアウトし、新しくつくったアカウントでWindowsにログインできることを確認する。

以後はこのアカウントでWindowsにログインした状態でプログラミングを行う。

2015年11月19日木曜日

Visual Studio(無償版)のインストール

無償版のVisual Studioにはいくつか種類がある。2015年時点で利用できる代表的なものを以下にあげる。

  • Visual Studio Express 2012 for Windows Desktop
  • Visual Studio Express 2013 for Windows Desktop
  • Visual Studio Community 2013
  • Visual Studio Express 2015 for Windows Desktop
  • Visual Studio Community 2015

各バージョンの数字部分は発表年度で、基本的に新しいものほど機能が充実している。特にこだわりがなければ最新版を使えばよい。

次に「Express」と「Community」の違いだが、Expressは動作環境ごとの開発ツールだ。たとえば、

  • PCプログラム用 →    Express for Windows Desktop
  • Webプログラム用 →    Express for Web

というように、ターゲットごとに別パッケージが用意されている。

これに対してCommunityは、複数の動作環境に対応した開発ツールだ。こちらはオールインワンで便利だが、規模が大きいため扱いが難しいところもある。

本ブログでは、基本的にPC用のプログラムしか扱わないので、「Visual Studio Express 2015 for Windows Desktop」を利用して話を進めることにする。

インストール手順は次のとおりである(2015年11月現在)。

(1) Microsoft本家のダウンロード用サイトを開く

https://www.visualstudio.com/downloads/download-visual-studio-vs

(2) 中央の左側にバージョン選択メニューがあるので「2015」を選ぶ。

(画像準備中)

(3) メニューから目的の「Visual Studio Express 2015 for Windows Desktop」を選ぶと、画面の右側にダウンロード用ボタンが現れる。

(画像準備中)

(4) 「ダウンロード」ボタンをクリックすると"wdexpress_full.exe"のダウンロードが始まる。これは単なるインストーラであり、ファイルサイズも3MB程度なので、ダウンロードはすぐに完了する。

(5) ダウンロードフォルダを開き、wdexpress_full.exeを実行すると、Visual Studio本体のダウンロードとインストールが始まる。データ量は2GB近くあり、インストールが完了するまで数十分から数時間はかかると覚悟したほうがよい。

インストールが完了したら、 Windowsのスタートメニューに"Visual Studio 2015"というグループが作られているはずだ。その中の"VS 2015 Express for Desktop"というアイコンをクリックすると、いよいよVisual Studioが起動する。

(画像準備中)

趣味のプログラミング熱が高まるの巻

我が家にもWindows10マシンがやってきた。せっかくなのでVisual Studioの一番新しいやつ(無料版)をインストールしていじっていたら、久しぶりにWindowsプログラミング熱が高まってきた。なんかいっちょ面白いプログラムでも作ってみるか。

というわけで本ブログでは、いろんなWindowsプログラミングに挑戦する私の姿をライブでお伝えしていこうと思う。同好の士にとって少しでも参考になることがあれば幸いである。