一、概要
本稿では、WPF を用いてメッセージセンターの機能を実装する方法について解説します。一般的なソフトウェアでは、サーバーから「ニュース」や「お知らせ」などのメッセージが頻繁にプッシュされます。このような場合、要件を分析する必要があります。
機能分析は以下の通りです。
- メッセージ内容の表示
- メッセージ管理:追加、削除、一括削除
- メッセージ分類(通知タイプ、インタラクティブタイプ(例:特定のリンクやプログラム内のモジュールに遷移可能))
- メッセージ処理(受諾、削除、無視)
二、実装

- メッセージ内容の表示
ここではカスタムコントロールとして ListBox を検討します。メッセージ自体は複数の項目からなり、各項目に対して操作が必要です。
<ListBox
Grid.Row="1"
MaxHeight="335"
Background="{x:Null}"
BorderThickness="0"
ItemContainerStyle="{DynamicResource ListBoxItemStyle}"
ItemsSource="{Binding MessageItem}"
ScrollViewer.HorizontalScrollBarVisibility="Hidden">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Vertical" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate DataType="{x:Type localModel:MessageItemModel}">
<Border
Height="30"
BorderBrush="#FFBDBDBD"
BorderThickness="0,0,0,0.6">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="40" />
</Grid.ColumnDefinitions>
<DockPanel>
<Label
MaxWidth="70"
Content="{Binding Path=Name}"
Foreground="Red"
ToolTip="{Binding Path=Name}" />
<Label
MaxWidth="130"
Content="{Binding Path=Content}"
Foreground="White"
ToolTip="{Binding Path=Content}" />
</DockPanel>
<CheckBox
Grid.Column="1"
FlowDirection="RightToLeft"
IsChecked="{Binding Path=CheckBoxState}" />
</Grid>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
- メッセージ管理:追加、削除、一括削除
主要なコンテナが決まったら、次に各メッセージに対してカスタムの ListBoxItem を定義します。各メッセージに対して具体的な処理が必要です。
例:通知タイプのメッセージは、確定ボタンのみ必要です。
インタラクティブタイプのメッセージは、確認、削除、無視のボタンが必要です。
<DataTemplate x:Key="SelectedTemplate" DataType="{x:Type localModel:MessageItemModel}">
<Border BorderBrush="#FFBDBDBD" BorderThickness="0,0,0,0.6">
<StackPanel>
<TextBox
MaxWidth="240"
MaxHeight="200"
Padding="0,5,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Background="Transparent"
BorderThickness="0"
FontSize="14"
Foreground="White"
IsReadOnly="True"
Text="{Binding Path=Content}"
TextAlignment="Center"
TextWrapping="WrapWithOverflow"
ToolTip="{Binding Path=Content}"
VerticalScrollBarVisibility="Auto" />
<StackPanel
Margin="5,5,5,9"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Orientation="Horizontal">
<Button
Width="60"
Height="25"
Margin="5"
Command="{Binding DataContext.ClickAcceptCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
CommandParameter="{Binding}"
Content="受諾"
Style="{StaticResource BlueButtonStyle}"
Visibility="{Binding Path=InvitationType, Converter={StaticResource BooleanToVisibilityConverter}}" />
<Button
Width="60"
Height="25"
Margin="5"
Command="{Binding DataContext.ClickRefuseCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
CommandParameter="{Binding}"
Content="無視"
Style="{StaticResource BlueButtonStyle}"
Visibility="{Binding Path=InvitationType, Converter={StaticResource BooleanToVisibilityConverter}}" />
<Button
Width="60"
Height="25"
Margin="5"
Command="{Binding DataContext.ClickAgreeCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
CommandParameter="{Binding}"
Content="確認"
Style="{StaticResource BlueButtonStyle}"
Visibility="{Binding Path=NoticeType, Converter={StaticResource BooleanToVisibilityConverter}}" />
</StackPanel>
</StackPanel>
</Border>
</DataTemplate>
- メッセージ分類
ここでは Model 層に具体的な列挙型を定義するだけです。
/// <summary>
/// メッセージ処理結果
/// </summary>
public enum SysMessageResult
{
/// <summary>
/// 未処理
/// </summary>
Unhandled = 0,
/// <summary>
/// 承認済み
/// </summary>
Processed = 1
}
/// <summary>
/// メッセージタイプ
/// </summary>
public enum SysMessageType
{
/// <summary>
/// 通知タイプ
/// </summary>
NoticeType = 0,
/// <summary>
/// その他タイプ
/// </summary>
OtherType = 1
}
- メッセージ処理
メッセージ処理とは、「確認」「受諾」「無視」の3つのボタンによるメッセージ内容の処理ロジックを指します。必要に応じて、各自の要件に合わせて修正してください。ここでは以下のように定義します。
- 確認:通常、通知メッセージを処理します。処理は単にメッセージリストからその項目を削除するだけで、他の動作は行いません。
- 受諾:インタラクティブタイプのメッセージを処理するボタンです。メッセージリストからその項目を削除し、さらに他のビジネス処理をトリガーします。
- 無視:すべてのタイプのメッセージを処理します。UIには表示されなくなりますが、メッセージリストには残り、次回または空き時間に処理されます。