今回は作成済みウインドウに対し、コンボボックスの配置、スピナーの配置を行います。
コンボボックスの表示と定義
このコントロールは標準であるコンボボックスとほぼ同じです。プロパティの挙動もほぼ同じ複数選択肢の中から一つを選ぶためのコントロールです。設置すると以下画像のようになります。今回は書式タブ内にコントロールを配置していきます。Size プロパティは設定できますが無視されます。
<Fluent:RibbonTabItem x:Name="contextualTabA" Header="書式" KeyTip="TF" Group="{Binding ElementName=tabGroup1, Mode=OneWay}"> <Fluent:RibbonGroupBox Header="コンボボックス" KeyTip="CO"> <Fluent:ComboBox MinWidth="130" KeyTip="C1" DisplayMemberPath="Text" SelectedIndex="0"> <TextBlock Text="子要素1"/> <TextBlock Text="子要素2"/> <TextBlock Text="子要素3"/> </Fluent:ComboBox> <Fluent:ComboBox Margin="0 3 0 0" MinWidth="130" KeyTip="C2" DisplayMemberPath="Text" IsEditable="False" SelectedIndex="0"> <TextBlock Text="子要素1"/> <TextBlock Text="子要素2"/> <TextBlock Text="子要素3"/> </Fluent:ComboBox> </Fluent:RibbonGroupBox> </Fluent:RibbonTabItem>
設定項目が標準の ComboBox とほぼ同じため以上となります。
スピナーの表示と定義
スピナーは、WinForm 時代の NumericUpDown コントロールと同じです。数値をアップ、ダウンボタンで変更できるコントロールになります。標準にないので Fluent.Ribbonを導入していたら、別の個所でも使用できます。(その場合でも、普通に使い勝手が良いのです (汗
設置すると以下の表示となります。
標準にないため、プロパティのおおよその説明です。
プロパティ | 説明 |
---|---|
Icon | 一番左側に表示されるアイコンを表します。 |
Header | アイコンの隣に表示される文字列を表します。 |
Value | このコントロールに設定されている値を表します。 |
Increment | ボタンを押すごとに増減する量を指定します。 |
Maximum | このコントロールで取れる最大値を指定します。 |
Minimum | このコントロールで撮れる最小値を指定します。 |
Format | 表示文字列の書式を指定します。(以下例では適当に使用していますが使い方がよくわからないです。おおよそ Format に似てると思います) |
画像の表示の XAML は以下の通りです。
<!-- グループ用のタブ定義 --> <Fluent:RibbonTabItem x:Name="contextualTabA" Header="書式" KeyTip="TF" Group="{Binding ElementName=tabGroup1, Mode=OneWay}"> <Fluent:RibbonGroupBox Header="スピナー" KeyTip="SP"> <Fluent:Spinner KeyTip="P1" InputWidth="90" Format="0 万人" Increment="100" Header="利用者数:" Icon="..."/> <Fluent:Spinner KeyTip="P1" InputWidth="90" Format="0.0 人" Header="利用者数:" Increment="0.1" Maximum="100" Minimum="5" Icon="..."/> </Fluent:RibbonGroupBox>
以上で、コンボボックス、スピナーの説明は終了です。次回はギャラリーを実装していきます。
各記事へのリンク
- 連載一覧ページ
- 第1回:構成要素の紹介
- 第2回:導入方法とウインドウ表示
- 第3回:タブ、グループ、ボタンの配置
- 第4回:ツールチップ、コンテキストタブを表示する
- 第5回:クイックアクセスバー、ツールバーメニューを表示する
- 第6回:コンボボックス、スピナーを表示する(このページ)
- 第7回:ギャラリーを表示する
- 第8回:アプリケーションメニュー、バックステージを表示する