Session ID : T2-401
マイクロソフト株式会社
エバンジェリスト
井上 章
Blog : http://blogs.msdn.com/chack/
本セッションでは、
現在開発中のテクノロジーを取り扱っています。
仕様および機能は変更される可能性があります。
リボン UI とは？
Office 2007 リボン
Windows Scenic リボン
リボン UI の特徴と利点
リボン開発プラットフォーム
Scenic リボン アーキテクチャ
リボン マークアップ
リボン マークアップ コンパイラ
初期化とコールバック
ヘッダファイルのインクルード
IUIApplication の実装
IUICommandHander の実装
リボン UI の初期化と破棄
コントロールの追加とイベント処理
Scenic リボン コントロール
まとめ
Office 2007 で採用された新しいユーザーインター
フェース
タブと大きめに配置されたコントロールで構成
従来のメニュー バーに置き換わる UI
Windows 7 ではリボン UI のための新たな API が標
準で用意され、アプリケーションで容易に実装でき
る
Windows 7 の ペイントやワードパッドでリボン UI
が採用
以下の２種類に分けられる
Office 2007 リボン
Windows Scenic リボン
Office ボタン
タブ
クイック アクセス
ツールバー
コンテキスト タブ セット
ヘルプ
コンテキスト タブ
グループ（別名 “Chunk”）
ダイアログ ボックス
ラウンチャー
アプリケーション
メニュー
タブ
クイック アクセス
ツールバー
コンテキスト タブ セット
グループ（別名 “Chunk”）
ヘルプ
コンテキスト タブ
ダイアログ ボックス ラウンチャー
Windows 7 に標準搭載, Windows Vista に配置可能
Win32 API, COM ベースの開発（まずはネイティブデベロッパを対象）
Microsoft Office 2007 リボンとほぼ同等の機能を提供
統一されたユーザーエクスペリエンスの提供
大きくデザインされたボタンなどのコントロールと、ラ
ベル表記によるコマンド説明
コンテキスト タブ による、選択オブジェクトに関連した
コマンドのタブ表示
クイック アクセス ツールバーによるコマンドへの素早い
アクセス
コマンドを見つけやすい
マウスでクリックしやすい
直観的なアプリケーション操作と操作方法の容易な習得
アプリケーションのユーザービリティ向上
ソフトウェアベンダのさまざまなニーズに対応
ターゲット:
Managed
ターゲット:
MFC ネイティブ
ターゲット:
ネイティブ
.NET Fx 3.5 必須
Windows 2000 以上
Windows Vista 以上
Office 2007 &
Windows styles
Office 2007 &
Windows styles1
Windows styles
Coming soon…
2009 年予定
Visual Studio 2008
SP1 に搭載
Coming soon…
Windows 7 と同時
にリリース
WPF
MFC
Scenic
Microsoft の リボン Strategy
1
Office 2007 スタイル はリリース済み, Windows スタイル は 2009 年を予定
マークアップ ベースの UI
XML によるリボン コントロール定義
小さく高性能なネイティブ コード ランタイム
最上位のメニュー バー機能をオーバーライドし、
リボン形式のコマンド UI をレンダリング
COM API による初期化処理、およびコールバック
メソッドの実装によるイベント処理
Windows Scenic リボン
Markup
コントロールの構成
<Ribbon>
<Tab>
<Button … />
</Tab>
</Ribbon>
COM API
初期化および
イベント処理
MyHandler::Execute(…)
{
DoStuff();
}
アプリケーショ
ン固有のビジネ
ス ロジック
void DoStuff()
{
…
…
}
<Application xmlns="http://schemas.microsoft.com/windows/2009/Scenic/Intent">
<Application.Commands>
<!-- tabs -->
<Command Name="TabHome" Symbol="cmdTabHome" Id="30000">
<Command.LabelTitle>
<StringDef>Home</Stringdef>
</Command.LabelTitle>
</Command>
<!-- chunks -->
<Command Name="ChunkClipboard" Symbol="cmdChunkClipboard" Id="31002">
<Command.LabelTitle>
<StringDef>Clipboard</StringDef>
</Command.LabelTitle>
<Command.LargeImages>
<Image Source="Paste.bmp"/>
</Command.LargeImages>
</Command>
<!-- Clipboard commands -->
<Command Name="Paste" Symbol="cmdPaste" Id="57637”>
<Command.LabelTitle>
<StringDef>Paste</Stringdef>
</Command.LabelTitle>
<Command.LargeImages>
<Image Source="Paste.bmp"/>
</Command.LargeImages>
</Command>
</Application.Commands>
<Application.Views> ... </Application.Views>
</Application>
<Application xmlns="http://schemas.microsoft.com/windows/2009/Scenic/Intent">
<Application.Commands> ... </Application.Commands>
<Application.Views>
<Ribbon Name="Microsoft.Scenic.Intent.RibbonSample">
<Ribbon.Tabs>
<Tab CommandName="TabHome">
<Group CommandName="ChunkClipboard">
<Button CommandName="Paste"/>
<Button CommandName="..."/>
...
</Group>
</Tab>
<Tab CommandName=“..."> ... </Tab>
...
</Ribbon.Tabs>
</Ribbon>
</Application.Views>
</Application>
IntentCL.exe
リボン マークアップ (XML) を検証
バイナリ版 リボン マークアップを生成
アプリケーションビルドで使用するヘッダファイルとリ
ソースファイルを生成
コマンドライン構文
IntentCL <ribbonFile> <binaryFile> /header:<headerFile> /res:<resourceFile> /name:<ribbonName>
リボン マークアップ のアプリケーションへの組み込み
markup.xml
を記述
IntentCL.exe
でコンパイル
markup.bml
ribbonres.h
ribbonres.rc
を生成
※ リボン マークアップ の詳細は Windows SDK v7.0 ドキュメントを参照
オンライン：http://msdn.microsoft.com/en-us/library/dd371191(VS.85).aspx
アプリケー
ションの
ビルド
アプリケーションへの組み込み
リボン
プラットフォーム
アプリケーション
CoCreateInstance
Initialize(HWND, IUIApplication*)
LoadUI( resourceName )
OnCreateUICommand
OnDestroyUICommand
OnViewChanged
IUIFramework
IUIApplication
マークアップコンパイラで生成したヘッダファイルと
リソースファイルをインクルード
// RibbonApplication.rc
#include “ribbonres.h”
#include “ribbonres.rc”
ATL/COM ヘッダファイルをインクルード
// stdafx.h
#include <atlbase.h>
#include <atlcom.h>
#include <initguid.h>
リボンインターフェース定義のヘッダファイルをイン
クルード
// RibbonImpl.cpp
#include <scenicintent.h>
#include <ScenicIntentPropertyHelpers.h>
class CApplication
: public CComObjectRootEx<CComMultiThreadModel>
, public IUIApplication
, public IUICommandHandler
{
public:
BEGIN_COM_MAP(CApplication)
COM_INTERFACE_ENTRY(IUIApplication)
COM_INTERFACE_ENTRY(IUICommandHandler)
END_COM_MAP()
// IUIApplication インターフェースの実装
STDMETHOD(OnViewChanged)(UINT32 viewID,
__in UI_VIEWTYPE typeID, __in IUnknown* pView,
UI_VIEWVERB verb, INT32 uReasonCode);
STDMETHOD(OnCreateUICommand)(UINT32 commandId,
__in UI_COMMANDTYPE typeID,
__deref_out IUICommandHandler** ppCommandHandler);
STDMETHOD(OnDestroyUICommand)(UINT32 commandId,
__in UI_COMMANDTYPE typeID,
__in IUICommandHandler* pCommandHandler);
... 次スライドへ続く ...
... 前スライドの続き ...
// IUICommandHandler インターフェースの実装
STDMETHOD(Execute)(UINT32 commandId,
UI_EXECUTIONVERB verb,
__in_opt const PROPERTYKEY* key,
__in_opt const PROPVARIANT* ppropvarValue,
__in_opt IUISimplePropertySet* pCommandExecutionProperties);
};
STDMETHOD(UpdateProperty)(UINT32 commandId,
__in REFPROPERTYKEY key,
__in_opt const PROPVARIANT* currentValue,
__out PROPVARIANT* newValue);
IUIFramework* g_pFramework = NULL;
HRESULT InitRibbon(CMainFrame* pFrame)
{
HRESULT hr = ::CoCreateInstance(CLSID_ScenicIntentUIFramework,
NULL,
CLSCTX_INPROC_SERVER,
IID_PPV_ARGS(&g_pFramework));
CComPtr<CComObject<CApplication>> pApplication;
hr = CComObject<CApplication>::CreateInstance(&pApplication);
hr = g_pFramework->Initialize(*pFrame, pApplication);
hr = g_pFramework->LoadUI(GetModuleHandle(NULL),
L"APPLICATION_RIBBON");
}
return hr;
void DestroyRibbon()
{
if (g_pFramework){
g_pFramework->Destroy();
g_pFramework->Release();
g_pFramework = NULL;
}
}
ボタンコントロールをタブグループへ追加
Markup.xml の Application.Commands 要素へ
Command 要素を追加
<Command Name="Paste" Symbol="cmdPaste" Id="57637”>
<Command.LabelTitle>
<StringDef>Paste</Stringdef>
</Command.LabelTitle>
<Command.LargeImages>
<Image Source="Paste.bmp"/>
</Command.LargeImages>
</Command>
Application.Views 要素の Ribbon.Tabs 要素へ
Button 要素を追加
<Tab CommandName="TabHome">
<Group CommandName="ChunkClipboard">
<Button CommandName="Paste"/>
</Group>
</Tab>
IUICommandHandler インターフェース
Execute メソッドの実装
STDMETHODIMP Execute(UINT32 commandId,
UI_EXECUTIONVERB verb,
__in_opt const PROPERTYKEY* key,
__in_opt const PROPVARIANT* ppropvarValue,
__in_opt IUISimplePropertySet* pCommandExecutionProperties)
{
switch (verb)
{
case UI_EXECUTIONVERB_EXECUTE:
if (commandId == cmdPaste)
{
AfxMessageBox(“Paste!!”);
}
break;
}
return S_OK;
}
IUICommandHandler インターフェース
UpdateProperty メソッドの実装
STDMETHODIMP UpdateProperty(UINT32 commandId,
__in REFPROPERTYKEY key,
__in_opt const PROPVARIANT* currentValue,
__out PROPVARIANT* newValue)
{
BOOL fVal = TRUE; // or FALSE
HRESULT hr = E_FAIL;
if (key == UI_PKEY_Enabled)
{
hr = UIInitPropertyFromBoolean(UI_PKEY_Enabled,
fVal,
newValue);
}
return hr;
}
リボン UI 対応アプリケーション
リボン UI により直観的なアプリケーション操作が可
能になり、ユーザービリティを向上することができる
リボンプラットフォームにより基本処理が制御され、
リボンを使ったアプリケーションのインターフェース
の一貫性が保たれる
今後、MFC および WPF ベースでもリボン UI 対応ア
プリケーション開発が可能になり、アプリケーション
への実装もさらに容易になる
統一されたユーザーエクスペリエンスの提供
アプリケーションのユーザービリティ向上
T2-201 Windows 7 機能概要
1月28日 13:15 - 14:25
T2-301 Windows 7：タスクバーを活用したアプリケー
ションの開発
1月28日 14:40 - 15:50
T2-302 Windows 7：マルチタッチ アプリケーションの開
発
1月28日 17:30 - 18:40
T2-402 Windows 7：グラフィックス API 詳解
1月28日 16:05 - 17:15
Windows Scenic Ribbon SDK Document
http://msdn.microsoft.com/en-us/library/dd371191(VS.85).aspx
リボン ガイドライン (MSDN Library)
http://msdn.microsoft.com/en-us/library/cc872782.aspx
WPF Ribbon Preview
http://www.codeplex.com/wpf/Wiki/View.aspx?title=WPF%20Ribbo
n%20Preview
© 2009 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market
conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation.
MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.
© Copyright 2024 ExpyDoc
