フォームとタブページの作成
2つのフォームと、Form2に作成する4つのタブページを作成します。
フォームの作成
では、最初に2つのフォームを作成します。
（1）フォーム「Form1」は、ラベルとボタンを配置するだけです。ButtonコントロールのClickイベントハンドラを作成し、ここからフォーム「Form2」をShowDialogメソッドでモーダルダイアログとして呼び出します。
Public Class Form1
Private Sub Button1_Click(sender As System.Object, _
e As System.EventArgs) Handles Button1.Click
Form2.ShowDialog()
End Sub
End Class
public partial class Form1 : Form
{
private void button1_Click(object sender, EventArgs e)
{
Form fm2 = new Form2();
fm2.ShowDialog();
}
}
（2）プロジェクトにもう一つフォーム「Form2」を追加します。このフォームにGcTabControlコントロールをドラッグアンドドロップし、DockプロパティをFillに設定します。
この時点では、通常のタブページを持ったコントロールになっており、2つのタブページがデフォルトで挿入されています。
（3）GcTabControlコントロールの「LayoutStyle」プロパティで、「Wizard」をリストから選びます。
これで、GcTabControlコントロールはタブを持たないコントロールになり、デザイン用のナビゲーションボタンが付きます。
（4）GcTabControlコントロールのスマートタグから「タグの追加」メニューを2回クリックし、合計4ページのタブページを持ったコントロールにします。
（5）続いて、プロパティウィンドウで「GradientEffect」プロパティをクリックし、次のグラデーションを作成します。
| プロパティ | 設定値 |
| Direction | Backward |
| StartColor | RoyalBlue |
| EndColor | PowderBlue |
| Style | CornerUp |
これで、GcTabControlコントロールの背景色がグラデーションで塗りつぶされます。
（6）Form2に、ImageListコントロールとFolderBrowserDialogコントロールを配置します。
ImageListコントロールには、次のイメージファイルを組み込んでおきます。
- back.png
- next.png
- openfolderHS.png
（7）最後に、Form2の「FormBorderStyle」を「FixedDialog」に設定し、Sizeプロパティを「450, 330」に設定します。
最初のタブページ「GcTabPage1」の作成
フォーム「Form2」に配置した、GcTabControlコントロールの4つのタブページを組み立てていきます。先頭のページから順番に作成していきます。
（1）タブページにGroupBoxコントロールを配置し、以下のプロパティを設定します。
| プロパティ | 設定値 |
| BackColor | Transparent |
| Text | Step 1 作成する帳票を選択してください |
| Size | 400, 200 |
| Location | 17, 30 |
SizeプロパティとLocationプロパティを設定したのは、この後のページに使用するGroupBoxコントロールもすべて同じSize/Locationプロパティの値に設定するためです。
（2）GroupBoxコントロール内に、RadioButtonコントロールを4つ、PictureBoxコントロールを1つ配置し、以下のプロパティを設定します。
| コントロール | プロパティ | 設定値 |
| RadioButton1 | Text | 出荷伝票 |
| Checked | True | |
| RadioButton2 | Text | 請求書 |
| RadioButton3 | Text | 損益計算書 |
| RadioButton4 | Text | 出張予算見積書 |
| PictureBox1 | Image | sheet1.jpg |
（3）Buttonコントロールをグループボックスの下に配置し、次のプロパティを設定します。
| プロパティ | 設定値 |
| Name | p1_next_btn |
| Text | 次へ |
| TextAlign | MiddleLeft |
| ImageList | ImageList1 |
| ImageIndex | 2 |
| ImageAlign | MiddleRight |
| Size | 50, 30 |
| Location | 362, 248 |
ボタンは、ImageListコントロールに組み込んだアイコン「next.png」を配置し、テキストとアイコンの位置を調整します。
また、このボタンもサイズと位置を設定したら、他のページの同じ［次へ］ボタンも同じ値に設定します。
（4）4つのラジオボタンのCheckedChangedイベントハンドラを作成し、ラジオボタンが選ばれたとき、PictureBoxコントロールの画像を入れ替える処理を作成します。
なお、画像ファイルは実行プログラムと同じフォルダに保存しておきます。
（5）ボタンのClickイベントハンドラを作成し、次のタブページを表示する処理を作成します。これは、GcTabControlコントロールのSelectTabメソッドを使用します。このメソッドは、引数に指定したタブページをアクティブにします。なおタブページは、1ページ目のインデックス番号が「0」から始まります。
Public Class Form2
'TabPage1 ---------------------------------------------------
Private imgpath As String = Application.StartupPath + ("\images")
Private Sub RadioButton1_CheckedChanged(sender As System.Object, _
e As System.EventArgs) Handles RadioButton1.CheckedChanged
PictureBox1.Image = Image.FromFile(imgpath + "\sheet1.jpg")
End Sub
Private Sub RadioButton2_CheckedChanged(sender As System.Object, _
e As System.EventArgs) Handles RadioButton2.CheckedChanged
PictureBox1.Image = Image.FromFile(imgpath + "\sheet2.jpg")
End Sub
Private Sub RadioButton3_CheckedChanged(sender As System.Object, _
e As System.EventArgs) Handles RadioButton3.CheckedChanged
PictureBox1.Image = Image.FromFile(imgpath + "\sheet3.jpg")
End Sub
Private Sub RadioButton4_CheckedChanged(sender As System.Object, _
e As System.EventArgs) Handles RadioButton4.CheckedChanged
PictureBox1.Image = Image.FromFile(imgpath + "\sheet4.jpg")
End Sub
Private Sub p1_next_btn_Click(sender As System.Object, _
e As System.EventArgs) Handles p1_next_btn.Click
GcTabControl1.SelectTab(1)
End Sub
End Class
public partial class Form2 : Form
{
public Form2()
{
InitializeComponent();
}
// TabPage1 ---------------------------------------------------
private String imgpath = Application.StartupPath + ("/images");
private void radioButton1_CheckedChanged(object sender, EventArgs e)
{
pictureBox1.Image = Image.FromFile(imgpath + "/sheet1.jpg");
}
private void radioButton2_CheckedChanged(object sender, EventArgs e)
{
pictureBox1.Image = Image.FromFile(imgpath + "/sheet2.jpg");
}
private void radioButton3_CheckedChanged(object sender, EventArgs e)
{
pictureBox1.Image = Image.FromFile(imgpath + "/sheet3.jpg");
}
private void radioButton4_CheckedChanged(object sender, EventArgs e)
{
pictureBox1.Image = Image.FromFile(imgpath + "/sheet4.jpg");
}
private void button1_Click(object sender, EventArgs e)
{
gcTabControl1.SelectTab(1);
}
}
