VS2022 実装 VC# 前編1 入門
システム開発シリーズ№30-1
Windows11｜Visual Studio Community 2022
フォームアプリ VC# 前編1
執筆 2022/06/16
公開 2022/07/02
改訂 2022/07/27
エンジニア 安 藤 哲 郎
このドキュメントの目的
システム開発において、工数削減の名目で、マニュアルが運用されなくなっており、開発環境構築直後からエラーが発生することがあります。しかし、開発ツール自体も改善されないまま、機能縮小されるケースもあります。システム開発でトラブルが発生すると、通常、インターネット検索して、先人の知見を参考にすることが多くなっています。システム開発を解説するユーチューブ動画においても同様の傾向があります。このシステム開発のドキュメント体系においては、見過ごしそうな操作画面を連続的にキャプチャーしています。システム開発に取り組む者にとって、一つのケアレスミスで数日を費やすことがあります。費用対効果の観点で開発ツールの既知の問題に悩む工数を削減するのが、システム開発シリーズを執筆した理由です。ソフトウェアの動作確認の裏付けとして操作画面をキャプチャーしております。公開時、優れたドキュメントであっても経年劣化は避けられず、信頼が低下することを留意して頂きたいと思います。また、システム開発シリーズの組み合わせで利用することで、ケアレスミスが防ぎ、作業工数を大幅に削減される可能性があります。
下記の条件のノートパソコンで、このドキュメントは取り纏められています。
・エディションWindows11 Home Inside Preview
・バージョン22H2
・Visual Studio 2022 Communityがインストール
・Chromeブラウザがインストール
・「VS2022 開発環境構築 入門」の適用
・「VS2022 フォームアプリ VC#入門」の適用
Form1／生成と画面サイズ設定
000_Windows11 起動
Windows11を起動すると、下記の画面が表示されます。
001_Visual Studio 2022 起動
タスクバーに登録した「Visual Studio 2022」をクリックすると、Visual Studio 2022が起動します。
002_Visual Studio 2022 開始する
下記の画面が表示されます。「新しいプロジェクトの作成」をクリックします。
003_新しいプロジェクトの作成
「新しいプロジェクトの作成」ダイアログボックスが表示されます。「Windows フォーム アプリケーション(.NET Framework)」と「C#」で検索します。「次へ」をクリックします。
004_新しいプロジェクトを構成します
プロジェクト名の既定値は、「WindowsFormsApp1」です。
005_MyHouseKeepingBook／作成
「MyHouseKeepingBook」をプロジェクト名に設定します。「作成」をクリックします。
006_Form1.cs[デザイン]
Form1.cs[デザイン]が構成され、プログラム作成画面が表示されます。
007_Form1／Size=(400, 300)
Form1.cs[デザイン]の「Form1」をクリックします。
「400, 300」を「Form1」オブジェクトの「Size」プロパティに設定します。
008_Form1.cs[デザイン]
下記の画面が表示されます。
Form2／生成と画面サイズ設定
009_ソリューションエクスプローラー
ソリューションエクスプローラーを右クリックして、「追加」、「新しい項目」の順にクリックします。
010_新しい項目の追加／C# 個の項目
「新しい項目の追加」ダイアログボックスが表示されます。
011_フォーム（Windows フォーム）
・ダイアログボックス左側の「Windows Forms」をクリックします。
・ダイアログボックス右側の「フォーム(Windowsフォーム)」をクリックします。
・「追加」をクリックします。
012_Form2.cs[デザイン]
Form2.cs[デザイン]が構成され、表示されます。
013_Form2／Size=(400, 300)
Form2.cs[デザイン]の「Form2」をクリックします。
「400, 300」を「Form2」オブジェクトの「Size」プロパティに設定します。
014_Form2.cs[デザイン]
Form2の画面Sizeが変更され、表示されます。
Form1／コントロール配置と設定
015_Form1.cs[デザイン]
Form1.cs[デザイン]タブをクリックすると、下記の画面が表示されます。
016_ツールボックス／選択
左端の「ツールボックス」インデックスをクリックして、ツールボックスを表示させます。
017_メニューとツールバー／選択
ツールボックスの「メニューとツールバー」をクリックして、コントロール項目を表示させます。
018_MenuStrip配置
ツールボックスの「MenuStrip」をドラッグして、「Form1」にドロップすると、「menuStrip1」が配置されます。
019_データ／選択
ツールボックスの「データ」をクリックします。コントロール項目を表示させます。
020_dataGridView1／配置
ツールボックスの「DataGridView」をドラッグして、「Form1」にドロップすると、「dataGridView1」が配置されます。
021_コモンコントロール
ツールボックスの「コモン コントロール」をクリックして、コントロール項目を表示させます。
022_button1～4／配置
ツールボックスの「Button」をドラッグして、「Form1」にドロップします。合計4回繰り返し、「button1」、「button2」、「button3」、「button4」を配置します。
023_Form1／Text=簡易家計簿
Form1.cs[デザイン]の「Form1」をクリックします。
「簡易家計簿」を「Form1」オブジェクトの「Text」プロパティに設定します。
024_menuStrip1→mainMenu
Form1.cs[デザイン]の「menuStrip1」をクリックします。
「mainMenu」を「menuStrip1」オブジェクトの「Name」プロパティに設定します。
025_dataGridView1→dgv
Form1.cs[デザイン]の「dataGridView1」をクリックします。
「dgv」を「dataGridView1」オブジェクトの「Name」プロパティに設定します。
026_dgv／Location=(13, 27)
「13, 27」を「dgv」オブジェクトの「Location」プロパティに設定します。
027_dgv／Size=(359, 193)
「359, 193」を「dgv」オブジェクトの「Size」プロパティに設定します。
028_button1→buttonAdd
Form1.cs[デザイン]の「button1」をクリックします。
「buttonAdd」を「button1」オブジェクトの「Name」プロパティに設定します。
029_buttonAdd／Text=追加
「追加」を「buttonAdd」オブジェクトの「Text」プロパティに設定します。
030_button2→buttonChange
Form1.cs[デザイン]の「button2」をクリックします。
「buttonChange」を「button2」オブジェクトの「Name」プロパティに設定します。
031_buttonChange／Text=変更
「変更」を「buttonChange」オブジェクトを「Text」プロパティに設定します。
032_button3→buttonDelete
Form1.cs[デザイン]の「button3」をクリックします。
「ButtonDelete」を「button3」オブジェクトの「Name」プロパティに設定します。
033_buttonDelete／Text=削除
「削除」を「buttomDelete」オブジェクトの「Text」プロパティに設定します。
034_button4→buttonEnd
Form1.cs[デザイン]の「button4」をクリックします。
「buttonEnd」を「button4」オブジェクトの「Name」プロパティに設定します。
035_buttonEnd／Text=終了
「終了」を「buttonEnd」オブジェクトの「Text」プロパティに設定します。
036_Form1.cs[デザイン]
下記の画面が表示されます。
037_Form1.cs[デザイン]（拡大）
下記の画面が表示されます。
Form2／コントロール配置と設定
038_Form2.cs[デザイン]
Form2.cs[デザイン]タブをクリックすると、下記の画面が表示されます。
039_コモンコントロール／選択
「ツールボックス」をクリックして、ツールボックスを表示させます。
ツールボックスの「コモン コントロール」の項目が表示されていなければ、「コモン コントロール」をクリックして、コントロール項目を表示させます。
040_monthCalendar1／配置
ツールボックスの「MonthCalendar」をドラッグして、「Form2」にドロップします。「monthCalendar1」が配置されます。
041_label1～4／配置
ツールボックスの「Label」をドラッグして、「Form2」にドロップします。合計4回繰り返します。すると、「label1」、「label2」、「label3」、「label4」が配置されます。
042_comboBox1／配置
ツールボックスの「ComboBox」をドラッグして、「Form2」にドロップします。「comboBox1」が配置されます。
043_textBox1／配置
ツールボックスの「TextBox」をドラッグして、「Form2」にドロップします。「textBox1」が配置されます。
044_maskedTextBox1／配置
ツールボックスの「MaskedTextBox」をドラッグして、「Form2」にドロップします。「maskedTextBox1」が配置されます。
045_TextBox／配置
ツールボックスの「TextBox」をドラッグして、「Form2」にドロップします。「textBox2」が配置されます。
046_button1～2／配置
ツールボックスの「Button」をドラッグして、「Form2」にドロップします。合計2回繰り返すと、「button1」、「button2」が配置されます。
047_Form2／Text=登録
Form2.cs[デザイン]の「Form2」をクリックします。
「登録」を「Form2」オブジェクトの「Text」プロパティに設定します。
048_monthCalendar1→monCalendar
Form2.cs[デザイン]の「monthCalendar1」をクリックします。
「monCalendar」を「monthCalenda1」オブジェクトの「Name」プロパティに設定します。
049_label1／Text=分類
Form2.cs[デザイン]の「label1」をクリックします。
「分類」を「label1」オブジェクトの「Text」プロパティに設定します。
この記事が気に入ったらサポートをしてみませんか？