ゲームエフェクトデザイナーのブログ (新)

レポート記事とかUE4のマテリアルとか。C#とかも触ったり。

C# コントロールの表示をボタンで切り替える

Formアプリで2つのDataGridViewをタブで切り替えるようなことをしたいのですが、TabControlは標準のプロパティでは外観をほとんど変えられないので、単純にボタンと表示/非表示の切り替えだけでやってみました。

まずフォームデザイナで下図のような感じでボタンとDataGridViewを2つずつ配置します。

f:id:moko_03_25:20180919220720j:plain

ボタンクリックイベントを追加してこちらのように記述します。
ボタンを押したら片方のDataGridViewを表示、もう片方を非表示にするだけ。

private void button1_Click(object sender, EventArgs e)
{
    if (dataGridView1.Visible == true)
    {
        return;
    }
    else
    {
        dataGridView1.Visible = true;
        dataGridView2.Visible = false;
    }
}

private void button2_Click(object sender, EventArgs e)
{
    if (dataGridView2.Visible == true)
    {
        return;
    }
    else
    {
        dataGridView1.Visible = false;
        dataGridView2.Visible = true;
    }
}


するとこのような感じで正常に動作しました。

f:id:moko_03_25:20180919220716g:plain

ただし、最初から片方のDataGridViewを非表示にしておかないと、どちらのボタンを押しても何も反応しないという状態になってしまいました。なぜ。。

お次は、2つのDataGridViewを同じ位置にピッタリと重ねて、ボタンもタブのように隣接させてみました。すると、まるでタブで切り替えているようになりました。

f:id:moko_03_25:20180919220711g:plain

アクティブなボタンの輪郭が太くなるのは不細工なので、ボタン初期化時に border = 0 で枠線を消してしまうと良いです。こちらの記事で解説しています。

また、タブっぽい画像を背景にするというのも良さそうです。