ツールバー

ツールバーはWindowの上方、メニューバーの下に位置するボタン群である。メニューバーでよく使う操作をボタンで分かりやすく表し、PCプログラムの顔である。それだけにアイコンのデザインはユーザの印象に大きな影響を与える。MSDNに詳しく書いてあるらしいが、ポチにはMSDNは呪文としか思えず、チンプンカンプンである（機械翻訳のせいか、元々の英文の特徴か、絵・図・サンプルが少ない。リンクを辿ると、ループするとか）。そのため例によって、邪道なので賢明な諸氏は他のサイトを参考にした方が良い

 　　　・VMPlayer
 　　　・Windows 8 Release Preview Build 8400
 　　　・MS VS2010 評価版
 　　　・VS2010のウィザードでSDIプロジェクトを作成し、デフォルトのツールバーある状態

無料版でまとめた環境・・・

アイコン

アイコンで検索すると様々なアイコンが出てくる。ただ、主要用途はWebページ用が多い。ツールバーのアイコンはツールバーエディタで16×16、16色で作るのが常道みたい。でもどうみても物足りない！？
下記に分かりやすいサイトを見つけたので、参考にさせていただいた。ポチはSDIベースのPJで活用したが、そのまま流用することが出来た。

ダイアログにビットマップ付きボタンを実装する(24bitカラー編)

最初の課題はフリーでカッコイイ、アイコンを探すことである。往々にして英語サイトだったりする

通常bitmap(SetImageList)

非活性化bitmap(SetDisabledImageList)

ここでアイコンは拡張子icoではなく普通のbmp(bitmap)で作る
老眼なので24×24のアイコンにした。アイコンとアイコンの間７pixels以上開ける必要がある（Assertionエラーになる）。24　pixelsのアイコンの場合、もっと開けた方がバランスが良いと思う
　

void CToolBar::SetSizes(SIZE sizeButton, SIZE sizeImage)

// button must be big enough to hold image
//   + 7 pixels on x
//   + 6 pixels on y
ASSERT(sizeButton.cx >= sizeImage.cx + 7);
ASSERT(sizeButton.cy >= sizeImage.cy + 6);

　
　
理由はよく分からないがbitmap右にはアイコン数個分の余白を開けておかないと、右端のアイコンが欠けてしまう

CMainFrame.cpp

// MainFrm.cpp : CMainFrame クラスの実装
//

#include "stdafx.h"
#include "ketsuatsu.h"
#include "StarData.h"
#include "ketsuatsuDoc.h"

#include "MainFrm.h"

#ifdef _DEBUG
#define new DEBUG_NEW
#endif

#pragma data_seg( _T(".TestData") )
int		m_TS;
int		m_auth	= 0;
int		m_stage;
CTime	m_time;
CketsuatsuDoc* ppDoc;
int		m_X;
int     m_scroll=0;				// 未使用
int		m_stage2;
int		Vrate = 100;
int		pindex=0;
int		m_mode=0;
#pragma

POINT pt1 = {0,0};

// CMainFrame

IMPLEMENT_DYNCREATE(CMainFrame, CFrameWnd)

BEGIN_MESSAGE_MAP(CMainFrame, CFrameWnd)
	ON_WM_CREATE()
	ON_BN_CLICKED(IDC_TODAY,   OnButtonToday)
	ON_BN_CLICKED(IDC_BUTTON2, OnButtonBday)
	ON_BN_CLICKED(IDC_BUTTON3, OnButtonFday)
	ON_BN_CLICKED(IDC_BUTTON4, OnButtonBweek)
	ON_BN_CLICKED(IDC_BUTTON5, OnButtonFweek)
	ON_BN_CLICKED(IDC_BUTTON6, OnButtonBmonth)
	ON_BN_CLICKED(IDC_BUTTON7, OnButtonFmonth)
	ON_BN_CLICKED(IDC_RELOAD,  OnButtonReload)

ON_WM_HSCROLL()

ON_COMMAND(ID_VIEW_CURSOR, OnAppCursor)

//  ON_COMMAND(IDC_TODAY, &CMainFrame::OnToday)
	ON_COMMAND(IDC_PAUSE, &CMainFrame::OnPause)
	ON_COMMAND(IDC_PLAY,  &CMainFrame::OnPlay)
	ON_COMMAND(IDC_DELETE, &CMainFrame::OnDelete)
	ON_UPDATE_COMMAND_UI(IDC_PAUSE, &CMainFrame::OnUpdatePause)
	ON_UPDATE_COMMAND_UI(IDC_PLAY,  &CMainFrame::OnUpdatePlay)
END_MESSAGE_MAP()

static UINT indicators[] =
{
	ID_SEPARATOR,           // ステータス ライン インジケータ
	ID_INDICATOR_DATA,
	ID_INDICATOR_TIME,
	ID_INDICATOR_NUM,
//	ID_INDICATOR_SCRL,
	ID_INDICATOR_STAGE,
	ID_INDICATOR_SPACE
//	ID_INDICATOR_KANA,
//	ID_INDICATOR_CAPS,
};

// CMainFrame コンストラクション/デストラクション

CMainFrame::CMainFrame()
{
	// TODO: メンバ初期化コードをここに追加してください。

}

CMainFrame::~CMainFrame()
{

}

int CMainFrame::OnCreate(LPCREATESTRUCT lpCreateStruct)
{
	if (CFrameWnd::OnCreate(lpCreateStruct) == -1)
		return -1;
	
	if (!m_wndToolBar.CreateEx(this) ||
		!m_wndToolBar.LoadToolBar(IDR_MAINFRAME))
	{
		TRACE0("ツール バーの作成に失敗しました。\n");
		return -1;      // 作成できませんでした。
	}

if (!m_wndDlgBar.Create(this, IDR_MAINFRAME, 
		CBRS_ALIGN_TOP, AFX_IDW_DIALOGBAR))
	{
		TRACE0("ダイアログバーの作成に失敗しました。\n");
		return -1;		// 作成できませんでした。
	}
	
	if (!m_wndReBar.Create(this) ||
		!m_wndReBar.AddBar(&m_wndToolBar) ||
		!m_wndReBar.AddBar(&m_wndDlgBar))
	{
		TRACE0("rebar の作成に失敗しました。\n");
		return -1;      // 作成できませんでした。
	}

if (!m_wndStatusBar.Create(this) ||
		!m_wndStatusBar.SetIndicators(indicators,
		  sizeof(indicators)/sizeof(UINT)))
	{
		TRACE0("ステータス バーの作成に失敗しました。\n");
		return -1;      // 作成できませんでした。
	}
	// TODO: ツール ヒントを表示しない場合は、削除してください。
	m_wndToolBar.SetBarStyle(m_wndToolBar.GetBarStyle() |
//		CBRS_TOOLTIPS | CBRS_FLYBY);
		CBRS_TOOLTIPS | CBRS_FLYBY | CBRS_ALIGN_ANY | CBRS_SIZE_DYNAMIC);

CToolBarCtrl& toolBarCtrl = m_wndToolBar.GetToolBarCtrl();
   
    // ボタン1個のサイズ指定
    // 1番目の引数のCSizeには、イメージに対して幅+7以上、高さ+6以上を指定する
    m_wndToolBar.SetSizes(CSize(  38, 23+6), CSize(24, 23));

// リソースからビットマップの読み込み
    CBitmap bitmap;
    CBitmap bitmapGray;
    bitmap.LoadBitmap(IDR_TOOLBAR2);
    bitmapGray.LoadBitmap(IDR_TOOLBAR_GRAY);

// イメージリストの作成
    // 3番目の引数にて、bit数を指定する
    imageList.Create(38, 25, ILC_COLOR24|ILC_MASK, 0, 0);             // アイコンの下にゴミ出るので29→25に変更
    imageListGray.Create(38, 25, ILC_COLOR24|ILC_MASK, 0, 0);         // アイコンの下にゴミ出るので29→25に変更

// イメージリストにビットマップを登録
    // 2個目の引数にて、背景色(透明化する箇所)を指定
    imageList.Add(&bitmap, RGB(0xFF, 0xFF, 0xFf));
    imageListGray.Add(&bitmapGray, RGB(240, 248, 255));

// ツールバーにイメージリストを登録
    toolBarCtrl.SetImageList(&imageList);
    toolBarCtrl.SetDisabledImageList(&imageListGray);

m_wndToolBar.SetButtonStyle(13, TBBS_CHECKGROUP|TBBS_CHECKBOX);
    m_wndToolBar.SetButtonStyle(14, TBBS_CHECKGROUP|TBBS_CHECKBOX);

return 0;
}

BOOL CMainFrame::PreCreateWindow(CREATESTRUCT& cs)
{
	if( !CFrameWnd::PreCreateWindow(cs) )
		return FALSE;
	// TODO: この位置で CREATESTRUCT cs を修正して Window クラスまたはスタイルを
	//  修正してください。
	cs.style &= ~FWS_ADDTOTITLE;

return TRUE;
}

void CMainFrame::OnButtonReload()
{

SendMessage(WM_COMMAND, ID_EDIT_RELOAD);

}

void CMainFrame::OnButtonToday()
{

SendMessage(WM_COMMAND, ID_EDIT_UNDO);

}

void CMainFrame::OnButtonBday()
{

SendMessage(WM_COMMAND, ID_EDIT_BD);

}

void CMainFrame::OnButtonFday()
{

SendMessage(WM_COMMAND, ID_EDIT_FD);

}

void CMainFrame::OnButtonBweek()
{
	SendMessage(WM_COMMAND, ID_EDIT_BW);

}

void CMainFrame::OnButtonFweek()
{
	SendMessage(WM_COMMAND, ID_EDIT_FW);

}

void CMainFrame::OnButtonBmonth()
{
	SendMessage(WM_COMMAND, ID_EDIT_BM);

}

void CMainFrame::OnButtonFmonth()
{
	SendMessage(WM_COMMAND, ID_EDIT_FM);

}

// CMainFrame 診断

#ifdef _DEBUG
void CMainFrame::AssertValid() const
{
	CFrameWnd::AssertValid();
}

void CMainFrame::Dump(CDumpContext& dc) const
{
	CFrameWnd::Dump(dc);
}

#endif //_DEBUG

void CMainFrame::OnAppCursor()
{

// Get the popup menu which contains the "Test" menu item.
   CMenu* mmenu = GetMenu();
   CMenu* submenu = mmenu->GetSubMenu( 2 );          // menu bar "表示"

// Check the state of the "Test" menu item. Check the menu item
   // if it is currently unchecked. Otherwise, uncheck the menu item
   // if it is not currently checked.
   UINT state = submenu->GetMenuState( ID_VIEW_CURSOR, MF_BYCOMMAND );
   ASSERT(state != 0xFFFFFFFF);

if (state & MF_CHECKED)
      submenu->CheckMenuItem( ID_VIEW_CURSOR, MF_UNCHECKED | MF_BYCOMMAND );
   else
      submenu->CheckMenuItem( ID_VIEW_CURSOR, MF_CHECKED | MF_BYCOMMAND );

}

void CMainFrame::OnToday()
{
	// TODO: ここにコマンド ハンドラー コードを追加します。
}

void CMainFrame::OnPause()
{
	// TODO: ここにコマンド ハンドラー コードを追加します。
	m_mode = 1;
}

void CMainFrame::OnPlay()
{
	// TODO: ここにコマンド ハンドラー コードを追加します。
	m_mode = 0;
}

void CMainFrame::OnDelete()
{
	// TODO: ここにコマンド ハンドラー コードを追加します。
	
	SendMessage(WM_COMMAND, ID_S_CANCEL);

}

void CMainFrame::OnUpdatePause(CCmdUI *pCmdUI)
{
	// TODO: ここにコマンド更新 UI ハンドラー コードを追加します。

CToolBarCtrl& toolBarCtrl = m_wndToolBar.GetToolBarCtrl();
	if ( m_mode == 0 )
	{
		pCmdUI->Enable( TRUE );
		pCmdUI->SetRadio( FALSE );
	}
	else 
	{
		pCmdUI->Enable( FALSE );
		pCmdUI->SetRadio( FALSE );
	}

}

void CMainFrame::OnUpdatePlay(CCmdUI *pCmdUI)
{
	// TODO: ここにコマンド更新 UI ハンドラー コードを追加します。

CToolBarCtrl& toolBarCtrl = m_wndToolBar.GetToolBarCtrl();

if ( m_mode == 1 )
	{
		pCmdUI->Enable( TRUE );
		pCmdUI->SetRadio( FALSE );
	}
	else 
	{
		pCmdUI->Enable( FALSE );
		pCmdUI->SetRadio( FALSE );
	}

}

ボタンとアクションの括り付け

さて、いよいよ怪しいお呪い！
ツールバーエディタで適当にボタンを作る。（ボタンの左からの順番は実際に使うボタンと合わせる）ただ、ボタンの絵は適当で構わない。
ボタンを追加するとツールバーエディタが適当な番号を割り当てる。「ID_BUTTON32812」みたいな適当な名前が付く。
（追加の仕方は右端の空白ボタンに「鉛筆ツール」で何か書けば、さらに右側に空白のボタンが追加される）

このIDをメニューバーで同じ処理を行うIDに置き換えれば、ボタンが表示される。IDに対応する処理が定義されていない場合は、ボタンは表示されない。余談だけどボタンだけでしか起動できない操作は作らない方が良いと思う。世の中にはマウスを嫌い、キーボードだけで処理したい人たちが居る

ツールバーエディタが適当に割り当てたIDはResouce.hで定義されるので、削除しておいた方がよい

上のbitmapをアイコンに直接コピペ出来れば素直なのだけど、デフォフトの16×16Pixels 4bitカラーの変更の仕方が分からなかった・・・

　　
　　
　　

表示サンプル

バルーン　ツールチップ　ScreenTip

正式には何と言うのでしょうか？
本来のやり方とは違うと思いますが、ketsuatsu.rcのSTRINGTABLEでボタンIDの￥nの後ろの文字が表示されるみたいです
標準ボタンで表示されるバルーンの文字列をVS上で検索してみたら、ここに有りました

ツールバー　ボタン　非活性化

「Visual C++プログラミングのメモ」には

(6)
　各ボタンの有効・無効(グレー化)を制御するには、以下の通り。フラグのデフォルトはTRUE(有効)。
(4bitビットマップの場合と同じ)

CToolBarCtrl& toolBarCtrl = m_wndToolBar.GetToolBarCtrl();
toolBarCtrl.EnableButton(ボタンのID, フラグ);

と、あるのですがSDIでは上手く行きませんでした。同じ悩みはみなさん持っているようです

http://rarara.cafe.coocan.jp/cgi-bin/lng/vc/vclng....

現象まで見事に一致しているので笑っちゃいます。回答にあるようにUPDATE_COMMAND_UIハンドラを追加しました

白抜きは非活性状態を示しています（選択中は二重選択不可→非活性）

ハンドラの追加は手動でも出来ると思いますが、GUIで追加する場合、
「クラスビュー」でCMainFrameを選択、右クリックで
「ClassWizard」起動しオブジェクトIDで該当する（ハンドラを追加する）ボタンのIDを選択
「メッセージ」でUPDATE_COMMAND_UIを選択、右側の「ハンドラの追加」ボタンを押す、お酢．．。

UIハンドラ
UIハンドラの考え方は理解苦しみます。質問者のやり方がやっぱ自然ですよね・・・。

ラジオボタン化

　
PLAY、PAUSEのボタンは排反でトグルスイッチの様に交互にON/OFFを切り替えたいです
　

m_wndToolBar.SetButtonStyle(13, TBBS_CHECKGROUP|TBBS_CHECKBOX);
m_wndToolBar.SetButtonStyle(14, TBBS_CHECKGROUP|TBBS_CHECKBOX);

　
msdnによればボタンのスタイルの説明は下記のように・・
TBBS_CHECKGROUPでグループの開始を指定。じゃ終了はどうすんの！？

ボタンのスタイル。次のボタンスタイルがサポートされています。
　TBBS_BUTTON 標準のプッシュボタン (既定)。
　TBBS_SEPARATOR 区切り記号。
　TBBS_CHECKBOX 自動チェックボックスボタン。
　TBBS_GROUP ボタングループの開始をマークします。
　TBBS_CHECKGROUP チェックボックスボタンのグループの開始をマークします。
　TBBS_DROPDOWN ドロップダウンリストボタンを作成します。
　TBBS_AUTOSIZE イメージのサイズではなくボタンのテキストに基づいて、ボタンの幅を計算します。
　TBBS_NOPREFIX ボタンのテキストに、ボタンに関連付けられているアクセラレータプリフィクスを含めません。

処理を再掲
　　
　　
　　

14

このページを編集するこのページを元に新規ページを作成

印刷する

コメント（0）

カテゴリ：
趣味
総合

ツールバー - ポチの玉手箱先頭へ

コメントをかく

名前	ユーザIDを使用しないで書き込む	ユーザーIDを使う	ログインする
画像コード	画像に記載されている文字を下のフォームに入力してください。
備考	「http://」を含む投稿は禁止されています。
本文
利用規約をご確認のうえご記入下さい

ポチの玉手箱