読者です 読者をやめる 読者になる 読者になる

しばやん雑記

ASP.NET とメイドさんが大好きなフリーランスのプログラマーのブログ

WebMatrix 2 の拡張機能を作成する (3) - 通知・ダイアログ

前回で基本的な拡張機能の仕組みについては理解してもらえたと思いますので、今回からは拡張機能を使用してできることを画像とサンプルコード多めで紹介したいと思います。

まずは機能的にシンプルで利用頻度も高そうな、通知とダイアログから説明します。

通知を表示する

ウェブサイトを作成した時になどに画面の下の方に出てくる黄色いバーを表示したい場合には ShowNotification メソッドを使います。通知なのでボタンを追加したりはできませんし、一定時間で非表示になります。

C#

WebMatrixHost.ShowNotification("テストメッセージ");

実行結果

引数で指定したメッセージが表示されていることが確認できます。

基本的にはテキストのメッセージしか表示できませんが、オーバーロードされたメソッドを使うことで、一つだけハイパーリンクを表示することが出来ます。

C#

WebMatrixHost.ShowNotification("テストメッセージ", "アクション", () =>
{
    // アクションが選択された時の処理
});

実行結果

この場合では「アクション」をクリックすると 3 つめの引数で指定したデリゲートが実行されます。

ダイアログを表示する

WPF や WinForm のようなダイアログを表示したい場合には WebMatrixHost.ShowDialog メソッドを使います。

ShowDialog メソッドは以下のような 4 つのオーバーロードされたメソッドを持っていますが、基本的には title と content を指定するだけでダイアログの表示は可能です。

bool? ShowDialog(string title, object content);
bool? ShowDialog(string title, object content, DialogSize dialogSize);
bool? ShowDialog(string title, object content, MessageBoxButton buttons, MessageBoxResult defaultButton);
bool? ShowDialog(string title, object content, DialogSize dialogSize, MessageBoxButton buttons, MessageBoxResult defaultButton);

DialogSize は列挙子となっていて、以下のような値を取ります。意味は名前から理解できると思いますので省略します。

  • SizeToContent
  • Small
  • Medium
  • Large

MessageBoxButton と MessageBoxResult はダイアログに表示するボタンの種類と、デフォルトで選択されるボタンの設定なので特に説明は必要ないですね。

例えば、以下のコードではシンプルな文字列だけを表示するダイアログが表示されます。

C#

WebMatrixHost.ShowDialog("WebMatrix サンプル", "これはテストメッセージですよ");

実行結果


ユーザーコントロールを表示する

WebMatrix ではダイアログとして UserControl を表示出来るようになってます。content に UserControl のインスタンスを指定すれば自動的にコンテンツとして表示されます。

以下のコードでは CustomDialog を表示するダイアログが表示されます。

C#

WebMatrixHost.ShowDialog("WebMatrix サンプル", new CustomDialog());

実行結果

デフォルトの「OK」「Cancel」ボタンを非表示にしたい場合には IDialogContent インターフェースを実装します。その代わりに UserControl がダイアログを閉じる機能を実装している必要があります。

IDialogContent インターフェースは CloseDialog イベントだけを持っていて、このイベントを呼び出すことで表示中のダイアログ、つまり自分自身を閉じることが出来ます。サンプルとして C# と XAML のコードを載せておきます。

C#

public partial class CustomDialog : UserControl, IDialogContent
{
    public event EventHandler<EventArgs> CloseDialog;

    private void CloseButton_Click(object sender, RoutedEventArgs e)
    {
        if (CloseDialog != null)
        {
            CloseDialog(sender, e);
        }
    }
}

XAML

<UserControl x:Class="WebMatrixExtension1.CustomDialog"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             Width="300" Height="300"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid>
        <Rectangle Fill="Red" Margin="0,0,0,50" />
        <Button IsDefault="True" Width="90" Height="30" Content="Close" VerticalAlignment="Bottom" Click="CloseButton_Click" />
    </Grid>
</UserControl>

実行結果

デフォルトのボタンが表示されず、XAML で指定したボタンのみが表示されていることが分かります。UserControl を載せることが出来るので、わざわざウィンドウを用意する必要がありません。

WebMatrix 自体が機能を提供しているので、テーマに合った違和感のない表示が出来るのが素晴らしいですね。次回はリボン UI のカスタマイズについて説明したいと思います。お疲れ様でした。