東京工芸大学 工学部  電子機械学科 2年 後期 

応用プログラミング 第7回

 2017.11.7
藤木 文彦


http:fujiki.tv/t-kougei/ouyouprog/

fujiki.kougei@gmail.com

 

 ■ 1

  ■ 2

  ■ 3

  ■ 4

 ■5

   

  

  

  ■  9

  ■ 10

   11

  12 

   13

   14

   15

   00

   00

   00

インデックスに戻る



 1.画像ファイルの表示
this.pictureBox1.Image = Image.FromFile()


 プロジェクト名: Project701
 csファイル名:  ShowPicture1

 先週の画像表示プログラムでは、画像の一部しか表示されないなどの不都合がありましたので、それを改善したものを作ります。
 先週の問題をやり終えた人も改めて、画像表示プログラムを作ってみてください。



出来上がりイメージは次のようなものです。
(使用する画像は、別の物でも構いません。)

説明: Z:\Documents\www\ouyouprog\image87.jpg

まず、この編集後の画面だけではわかりませんが、

ファイル名入力のダイアログを設定しておく必要があります。

次に、


PictureBox
 のプロパティ設定で、
下記のように、

SizeMode  を
Zoom または StretchImage

 に設定しておくようにしてください。
 これを設定しないと、画像の一部しか表示されないことがあります。


 ただし、Zoom では、縦横比が保存されて表示の大きさが自動調整されますが、その分、空きスペースができます。StretchImage では、PictureBox を変形すると、画像もそれに合わせて変形されるので注意が必要です。(縦横の日が変わってしまいます。)
 余裕があったら、このモードをいろいろ変更して、試してみるとよいでしょう。

 この課題も、画像が表示された画面をプリントして提出してください。

説明: Z:\Documents\www\ouyouprog\image86.jpg

  private void button1_Click(object sender, EventArgs e)
{


DialogResult ret;

this.openFileDialog1.Title = "
ファイル選択";
this.openFileDialog1.CheckFileExists = true;
this.openFileDialog1.RestoreDirectory = true;
ret = this.openFileDialog1.ShowDialog();

if (ret == DialogResult.OK)
{
this.label3.Text = this.openFileDialog1.FileName;
this.label5.Text = this.openFileDialog1.SafeFileName;
this.pictureBox1.Image = Image.FromFile(this.openFileDialog1.FileName);

}
else
{
this.label3.Text = "No File";
this.label5.Text = "No File";
}
}



 【演習問題1】 


 授業の説明に従って、"Project701"を作成し、画面プリントと、メールを提出しなさい。


【提出物1】 上記のような画像ファイルを表示した画面のスクリーンショットをプリントして提出物1としなさい。



 2.ウインドウ上部のメニュー表示と年月日時刻表示
MenuStrip

( Strip は、「帯状につながったもの」という意味。ストライプと共通の語源か?)

 プロジェクト名: Project702
 csファイル名:  MenuStrip1


 Windows アプリの多くで、ウインドウの上部に「ファイル」「編集」などのメニューがありますよね。ここでは、そうしたメニューを作る方法を解説します。


 まず、デザインウインドウに、1つだけ、TextBox を配置します。
 今回は、ボタンは1つ、終了ボタンだけ作っておきましょう。



説明: Z:\Documents\www\ouyouprog\image68.jpg

TextBox
に、あらかじめ文字を入れておくには、いつものように、プロパティから入れてもいいのですが、次のように、プログラム中に入れておくことで、表示させることもできます。「終了」ボタンのセットと同時に、次の部分に1行入れておくようにしましょう。
 いつもと入れるところが少し違います。自分で入れるのは、真ん中の1行だけです。

説明: Z:\Documents\www\ouyouprog\image75.jpg
public Form1()
{
InitializeComponent();
this.textBox1.Text = "**********";
}


 とりあえず、ここで実行してみます。
 テキストボックスには、上記のように "********" が表示されていますが、自分で書き直すこともできます。(今のところ書き直しても何も面白くありませんが。)

 終了するのを忘れずに。

 次に、今までとは少し違ったことをします。

 ツールボックスから、" MenuStrip " を選び、画面上の適当な場所に置いてやると、画面下に、先週のファイルメニューと同じように、別の形で表示が出ます。

 それと同時に、ウインドウの上部に 「ここへ入力」 という表示が出ますので、そこに、「表示」などと、適当な文字を入れます。(通常の場合は、「ファイル」とすることが多いのですが、あえて違うものとしてみました。

説明: Z:\Documents\www\ouyouprog\image76.jpg

その下にも「ここへ入力」がありますので、
「こんにちは」
「時刻表示」

 などと入れてみましょう。


説明: Z:\Documents\www\ouyouprog\image77.jpg


 ここで入れたものが、一般的に、ファイルメニューとして出てくるリストになるだろうことは、想像できますよね。

 そのメニューを選択したらなんか動作してほしいわけですから、いつものボタンの動作を記述するときと同じように、デザインウインドウで、「こんにちは」の場所を、クリックして、 cs ファイル編集画面に移行するのですが、ちょっと、コツがいるようです。

 下図のように表示されているときは、プログラム編集画面に移行できません
説明: Z:\Documents\www\ouyouprog\image93.jpg


 下図のような表示にしてから、ダブルクリックすると、編集画面に移行できますが、少し画面が移るのに時間がかかるようなので、焦って何回もクリックしないで、ちょっと様子を待ちましょう。
 この状態でも、プログラム画面への移行には、ちょっとクリックのタイミングにコツがいるようです。
説明: Z:\Documents\www\ouyouprog\image94.jpg 
(上の画面と似ていても、右に「ここへ入力」が出ていないときや、 右向きの▲が出ていないときは、うまく移行できないようです。なんかうまいことがあるのかどうかよくわかりませんので、何度か試してみてください。)

 別の場所に入れてしまわないように、以下の
こんにちはToolStripMenuItem_Click
 の場所であることをよく確認してください。

説明: Z:\Documents\www\ouyouprog\image95.jpg
private void
こんにちはToolStripMenuItem_Click(object sender, EventArgs e)
{
this.textBox1.Text = "
こんにちは!!";
}

 できたら実行してみましょう。
 次のように最初は、 " ******** " が表示されていますが、選択すると文字列が表示されるはずです。
 
説明: Z:\Documents\www\ouyouprog\image88.jpg

 ボタンを押して、こんな表示になれば、成功です。

説明: Z:\Documents\www\ouyouprog\image90.jpg


 「時刻表示」なんてメニューも作ってしまいましたので、時刻も表示できるようにしましょう。

 上記と同様にして、時刻表示部分に、次のようなプログラムを入力します。


説明: Z:\Documents\www\ouyouprog\image98.jpg

説明: Z:\Documents\www\ouyouprog\image96.jpg


日付も表示できるようにしたいですね。
日付は、次のようにして、獲得することができます。

jikan.ToLongTimeString()
 の代わりに、
jikan.ToLongDateString()
 とします。

 これを使って、次のような表示になるように、何箇所かプログラムを改良しましょう。

説明: Z:\Documents\www\ouyouprog\image99.jpg



 【演習問題2】 

 授業の説明に従って、"Project702"を作成し、画面プリントと、メールを提出しなさい。

【提出物2】 上記のような出力が出たら、それをプリントして提出物2とします。

 ヒント:   = " ---" + jikan.---- + " " + ----- ;

 3.メニュー表示とファイル読み込み、編集画面
System.IO.StreamReader(fileName,System.Text.Encoding.Default)


 プロジェクト名: Project703
 csファイル名:  EditFile1

 次は、テキストファイルから入力した文章を、編集して出力するプログラムを作ってみましょう。
 要するに、「自作エディタ」です。
 なんか、大変そうに思えますが、実は何のことはありません。

 ファイル入力を行う。
 テキストボックスに表示して、編集する。
 テキストボックスの結果を保存する。

 という3つのことを行うだけです。

 ファイルの入力法は、もう、やりましたよね。

 テキストボックスに表示させた後、その内容を編集する部分は、何もしなくても、実は、エディタと同様に文字を挿入、訂正、コピー、貼り付けなどができるようになっているので、この辺は何も自分で作る必要はありません。

 ファイルの出力の部分だけが、今回の新しいところですね。

 では、順を追って作成していきましょう。

 まず、実行すると次のように表示されるように、画面をデザインしてください。
 メニューの作り方は今日の初めに解説してあります。
 真ん中の大きい枠は、 TextBox です。大きな枠の作り方は下に解説してあります。

 下のようなメニューを作るために必要な "menuStrip"  と、
 ファイルをオープンする選択画面を表示するためのダイアログ"openFileDialog"
を、ツールボックスから選んで画面下に貼り付けてから始めてください。

説明: Z:\Documents\www\ouyouprog\image105.jpg

 「ファイル」メニューからの選択肢は、次の図のようにします。

 次の課題では、ファイルへの出力も行いますので、ここで、ファイル出力メニューも一緒に作っておきます。


説明: Z:\Documents\www\ouyouprog\image103.jpg


 複数行表示できる大きなテキストボックスを作るには、テキストボックスを配置後、右上の▲をクリックして、 □MultiLine にチェックを入れてから、大きさを広げます。

説明: Z:\Documents\www\ouyouprog\image106.jpg

 この画面には、「終了」ボタンが配置してありませんが、お気づきのように、「ファイル」メニューの3つ目に、「終了」がありますね。
 普通のアプリケーションもこのようになっている場合が多いので、ここでも、そういうやり方をしてみます。

 まず、この「終了」ボタンを押したときの動作を記述します。
 今までのボタンを押したときと、変わりありませんが、メニューからの起動ですから、メニューの「終了」ボタンをうまく押して、プログラム画面に移行し、次のように入力します。

説明: Z:\Documents\www\ouyouprog\image104.jpg


次に、入力ファイルを開く部分です。
前回やりましたが、前回は、 listBox に1行ずつデータを表示しました。実は、そのデータを後で、グラフ表示用データにできるようにするためには、そのほう都合いいのですが、データ表示用に使うための方法は、後日改めて行いますので、今回は、textBox を使用します。そのため、プログラムが一部異なりますので、プログラム例を掲げます。
(コピペではなく、自分で入力してほしいので、コピペできるプログラムは掲げません。)

説明: Z:\Documents\www\ouyouprog\image109.jpg

 実行して、ファイル名選択画面が開いているところは、次のような感じになります。
 前回保存した、 cdata フォルダの、 text.txt ファイルを開くと、背後に見えているような画面が表示されるはずです。
 
説明: Z:\Documents\www\ouyouprog\image108.jpg



 【演習問題3】 

 授業の説明に従って、"Project703"を作成し、画面プリントと、メールを提出しなさい。


【提出物3】 上記のように、ファイルを開いて表示した画面と、再度ファイルを読み込むように、ファイル入力画面を開いたウインドウが重なっている画面をプリントスクリーンで保存し、それをプリントして提出物3とします。

 4.ファイルへの出力
System.IO.StreamWriter(fileName2,false,System.Text.Encoding.Default)



 次に、ファイルを出力します。

 新しくプロジェクトを作るのではなく、前のプロジェクトに続けて行います。

 プロジェクト名: 前のプロジェクトに続けて行いますので、Project703 のままで構いません.
 csファイル名:  EditFile2  (CSファイル名だけ変更して、一回保存しておきます。)


 出力ファイルを指定するボックスを開くために、ツールボックスから、
saveFileDialog  を選んで、画面上に加えておきます。(下記参照)

説明: Z:\Documents\www\ouyouprog\image113.jpg

 「ファイル出力」を選択したときの動作を次のように記述します。

説明: Z:\Documents\www\ouyouprog\image110.jpg
注:次の行の、 false を true に変更すると、ファイルの出力の際に、前のファイルの最後に継ぎ足される形で出力されます。
 textFile2 = new System.IO.StreamWriter(fileName2,false, System.Text.Encoding.Default);


 実行して、まず、 text.txt ファイルを読み込みます。
 読み込んだファイルが表示されたら、一部を書き直します。
 文書の内容は、適当でよいのですが、最後に、自分の名前が入るようにします。

説明: Z:\Documents\www\ouyouprog\image111.jpg


 次にファイルを出力します。
 「ファイル出力」を選び、適当なファイル名(下の例では、「出力ファイル1」)を指定して保存してみます。

 一度保存してから、編集画面に戻り、ちょっと何か数文字書き換えて、再度保存すると、下記のように、「上書きしてよいか」という確認が出ます。

説明: Z:\Documents\www\ouyouprog\image112.jpg


 【演習問題4】 

 授業の説明に従って、"Project704"を作成し、画面プリントと、メールを提出しなさい。

【提出物4】 上記のように、書き直したファイルの内容が見えるウインドウと、再度保存しようとしたときに、上書きの確認がされるウインドウの両方が画面に映っている状態を、プリントスクリーンで保存し、それをプリントして提出物4とします。



 補足:
 ファイルが長くなったときに、右に、「スクロールバー」が出るようにするには、テキストボックスのプロパティ で、 「 ScrollBars 」に「Vertical」を指定します。
 下は、そのように指定した例。ファイルを、「末尾に追加モード」(上記で説明した、false -> true にしたとき)にすると、1度書き出すたびに同じ内容が継ぎ足されて増えていきます。間違って前のファイルを消してしまう危険が無い代わりに、同じことが何度も書かれて無駄になるかもしれません。どちらにするかは、場合によって判断してください。

説明: Z:\Documents\www\ouyouprog\image114.jpg





--

ファイル入力
private void
ファイル入力ToolStripMenuItem_Click(object sender, EventArgs e)
{
DialogResult ret;

ret = openFileDialog1.ShowDialog();
if (ret == DialogResult.OK)
{
string fileName;
fileName = this.openFileDialog1.FileName;

System.IO.StreamReader textFile;
textFile = new System.IO.StreamReader(fileName,System.Text.Encoding.Default);
this.textBox1.Clear();
textBox1.Text = textFile.ReadToEnd();
}
}


--
ファイル出力
private void
ファイル出力ToolStripMenuItem_Click(object sender, EventArgs e)
{
DialogResult ret2;

ret2 = saveFileDialog1.ShowDialog();
if (ret2 == DialogResult.OK)
{
string fileName2;
fileName2 = this.saveFileDialog1.FileName;

System.IO.StreamWriter textFile2;
textFile2 = new System.IO.StreamWriter(fileName2,false, System.Text.Encoding.Default);
textFile2.Write(this.textBox1.Text);
textFile2.Close();
}
}


----------