PubNub Developer Relationsデスクトップ・ノーティフィケーションは、リアルタイムのイベント・ドリブン・アプリに必要な機能になってきていることにお気づきだろうか。Webサービスでは、バックエンドのシグナルや他のユーザーからのメッセージが発生すると、ユーザーに通知する必要があります。
このガイドでは、C#と WPF、Windows Forms、UWPを使用してWindowsデスクトップアプリケーションを構築しようとしているソフトウェアエンジニアやフルスタックソフトウェア開発者を対象に、MVVMデザインパターンを使用してデスクトッププッシュ通知のフロントエンドとバックエンドのコードを構築する方法を説明します。
このガイドの主役はPubNubの リアルタイムメッセージングAPIです。このAPIを使用すると、クライアントやサーバーは世界中のどこからでも、任意の数のデバイス、Webアプリ、モバイルアプリにリアルタイムでシグナルを送信できます。
トースト通知に必要なプログラミング言語の概要
このチュートリアルでは、さまざまなコーディング言語とアルゴリズム言語を使用します。まず始めに、それらのプログラマー言語を簡単に定義し、それからワークフローのプロセスに飛び込みます。
WPFとは？
これから一緒に実行するコード例は、Windows Presentation FoundationまたはWPFを使って書かれています。過去10年間、WPFはC#と.NET FrameworkでWindowsデスクトップWebアプリを開発するためのベストチョイスのサブシステムでした。ユーザーインターフェイス開発にはXAMLを使用し、各ビューにはC#Code Behindsを使用するという点で、Windows Formsに似ています。
簡単なヒント
このチュートリアルでは、MVVMパターンを使用するため、できるだけ多くのコードをコードビハインドの外に置くようにします。そのため、通常はコードビハインドに記述するコードをViewModel クラスに記述します。
MVVMアーキテクチャとは？
Model-View-ViewModel、またはMVVMは、ユーザー向けのアプリケーションにおいて、UI開発とバックエンド開発を分離するためのデザインパターンです。このパターンを構成する3つのコンポーネントがあります。
WPFAppsのコンポーネントは何ですか？
WPFappsの場合、これらのコンポーネントは次のとおりです：
ビュー - XAMLとCodeBehinds
ViewModels - 状態管理と、ModelとViewの間を移動するデータを制御するためのC#コード。
モデル - C#クラス、データストレージ、ビジネスロジック。
C#デスクトップ通知
OSを意識した通知のためのWindowsデスクトップのソリューションは、Toast Notificationクラスです。Toast通知はWindows UI Notificationクラスに統合されています。
Toast通知とは？
この例では、Toast 通知を使用します。Toast通知は、自動的に表示され、期限切れになるようにプログラムされた小さなポップアップです。通常は控えめで、ユーザーからのアクションを必要としません。また、ユーザーの活動を停止させることもありません。
このタイプの自動プッシュ通知は、デスクトップポップアップに最適です。しかし、WPFでのToastのサポートは豊富ではありません。
Toast通知のプロのヒント
このシナリオの回避策は、WPFappが通知を含むことができるように、独自のトーストデスクトップ通知ユーザーインターフェイスを構築することです。このような通知は、ViewModel コード内の従来の C# イベントを使用して、 いつでもトリガーできます。
これから一緒に作るサンプルは、C#の通知を使ったWPFappです。
親ウィンドウが1つあり、ボタンが1つあります。ボタンをクリックすると、ネットワークへのJSONデータのPubNubパブリッシュがトリガーされます。アプリケーションはまた、Publishコードと同じチャネルとAPIキー（無料のPubNubAPIキー）を使用してPubNubにサブスクライブします。
PubNubサブスクライブコードは、新しいメッセージがパブリッシュされるたびに、デスクトップにポップアッププッシュ通知を作成するC#イベントをトリガします。PubNubメッセージの待ち時間は、発行者と購読者の距離に関係なく、一般的に80〜100ミリ秒です。
PubNubは、70以上のクライアント SDKを持っているので、任意のインターネット対応デバイスは、この図に交換することができます。
C#とMVVMによるWPFTutorial通知チュートリアルプロジェクト
PubNubメッセージングのパワーとWPFデスクトップ通知のためのソリューションを実証するために、独自のC＃通知アプリを構築するつもりです。以下はMVVMプロジェクトのファイル構造です：
このチュートリアルで参照するコードはすべて GitHubでオープンソースとして公開 されています。
アプリを実行 するには、永久無料のPubNubAPIキーを取得する必要が あります。
PublishキーとSubscribeキーをソースコードに追加してください！
MVVMで始めるデスクトップ通知の構築
1.ゼロから始める場合は、Visual*Studio（無料）を開き、新しいWPFwebアプリケーションを作成します。File -> New -> Projectをクリック*します。
2.ソリューションエクスプローラーで新規プロジェクトファイルを右クリックし、NuGetパッケージの管理をクリックします。PubNubをインストールする必要があります。
3.先ほどのスクリーンショットのように、プロジェクトのルートにフォルダを作成します。これらのフォルダはModel、View、ViewModelです。Viewフォルダに2つの新しいXAMLウィンドウ、Main Windowと Notification Windowを作成します。
通知ビルドをXAMLで続ける
作成した2つのビューファイルのXAMLです。これが親ウィンドウと通知ウィンドウのUIになります。
MainWindow.xaml
<Window x:Class="WPF_PubNub.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:vm="clr-namespace:WPF_PubNub.VM" xmlns:local="clr-namespace:WPF_PubNub" mc:Ignorable="d"
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" Title="{Binding WindowName}" Height="300" Width="400"> <Window.DataContext> <vm:PubNubVM /> </Window.DataContext> <i:Interaction.Triggers> <i:EventTrigger EventName="Loaded"> <ei:CallMethodAction TargetObject="{Binding}"MethodName="MainWindowLoaded"/> </i:EventTrigger> </i:Interaction.Triggers> <!--Loaded="{Binding OnWindowLoaded}"--> <Grid > <StackPanel Name="stackPanel2" Grid.Column="1" Grid.Row="0" Background="White" > <Border CornerRadius="5" BorderBrush="Gray" BorderThickness="2" HorizontalAlignment="Center" > <Button Width="{Binding ButtonWidth}"
Height="{Binding ButtonHeight}"Content="{バインディング ButtonContent}"Background="#FFF3F0F0"> <i:Interaction.Triggers> <i:EventTrigger EventName="Click"> <ei:CallMethodAction TargetObject="{Binding}"メソッド名="PublishMessage"/> </i:EventTrigger> </i:Interaction.Triggers> </Button> </Border> </StackPanel> </Grid> </Window> <Window
通知ウィンドウ.xaml
Height="116.783" Width="319.93" Background="#FF110505" > <!-- Animation --> <！-- Notification area --> <画像ソース="CloseBtn.JPG" 高さ="39" 幅="28" /> <//Window> <Window
C#通知ウィンドウのコード例
通知ウィンドウの C#コード 例です。すべてのコードはUI固有のものです。これは "Toast "通知に似ています。
using System; using System.Windows; using System.Windows.Threading; namespace Toast { /// /// NotificationWindow.xaml /// NotificationWindow.xamlのインタラクションロジック。xaml /// public partial class NotificationWindow : Window { public NotificationWindow() { InitializeComponent(); Dispatcher.BeginInvoke(DispatcherPriority.ApplicationIdle, new Action() => { var workingArea = System.Windows.Forms.Screen.PrimaryScreen.WorkingArea;
var transform = PresentationSource.FromVisual(this).CompositionTarget.TransformFromDevice;
var corner = transform.Transform(new Point(workingArea.Right, workingArea.Bottom));
Left = corner.X - ActualWidth;
Top = corner.Y - ActualHeight;
}));
}
//Close the notification window
private void Button\_Click\_Close(object sender, RoutedEventArgs e)
{
Close();
}
}
}
C#、WPF、MVVM 通知を構築する最後のステップ
ViewModelフォルダにPubNubVM.csを作成します。PubNubVM.csは Modelコードと Viewコードの間のファシリテーターとなります。このファイルのコードはここにあります。
Modelフォルダには、PubNub発行/購読APIと対話するためのPubNubHelper.csクラスを作成します。 PubNubの初期化コードには、必ず独自の PubNubAPIキーを 入力して ください。
ファイル内に"__YOUR_PUBNUB_PUBLISH_KEY_HERE__"と"__YOUR_PUBNUB_SUBSCRIBE_KEY_HERE__"があります。これらの文字列リテラルをあなたのキーに置き換えてください。
using Newtonsoft.Json; using PubnubApi; using System; using System.Windows; using Toast; namespace WPF_PubNub.public class PubNubHelper { Pubnub pubnub; private readonly string ChannelName = "win-notification"；
public void Init() { //PNConfiguration pnConfiguration = new PNConfiguration { PublishKey = "__YOUR_PUBNUB_PUBLISH_KEY_HERE__", SubscribeKey = "__YOUR_PUBNUB_SUBSCRIBE_KEY_HERE__", Secure = true }; pubnub = new Pubnub(pnConfiguration); //Subscribe pubnub.Subscribe() .Channels(new string[] { ChannelName }) .WithPresence() .Execute(); } //メッセージを発行する public void Publish() { JsonMsg Person = new JsonMsg { Name = "John Doe", Description = "Description", Date = DateTime.Now.ToString() }; //文字列に変換 arrayMessage = JsonConvert.SerializeObject(Person); pubnub.Publish() .Channel(ChannelName) .Message(arrayMessage) .Async(new PNPublishResultExt((result, status) => {})); } //チャンネルを聞く public void Listen() { SubscribeCallbackExt listenerSubscribeCallack = new SubscribeCallbackExt( (pubnubObj, message) => { //UIスレッドから通知ウィンドウを呼び出す Application.Current.Dispatcher.Invoke(new Action(() => { //WIN-10トーストのようなWPFウィンドウメッセージとしてメッセージを表示する NotificationWindow ts = new NotificationWindow(); //メッセージをJSONに変換する JsonMsg bsObj = JsonConvert.DeserializeObject(message.Message.ToString()); string messageBoxText = "Name：" + bsObj.Name + Environment.NewLine + "説明：" + bsObj.Description + Environment.NewLine + "Date: " + bsObj.Date; ts.NotifText.Text = messageBoxText; ts.Show();
}));
},
(pubnubObj, presence) => {
// handle incoming presence data
},
(pubnubObj, status) => {
// the status object returned is always related to subscribe but could contain
// information about subscribe, heartbeat, or errors
// use the PNOperationType to switch on different options
});
pubnub.AddListener(listenerSubscribeCallack);
}
}
}
Pro Tip: Modelフォルダには、JsonMsg.csクラスも必要 です。 WPFプロジェクト・ファイルで参照されているNuGetパッケージは必ず追加して ください。また 、ViewフォルダにはいくつかのJPG画像 ファイルがあります。これらの画像はカスタムメイドの通知ウィンドウに表示されます。必ずプロジェクトのViewフォルダに追加してください。
4.プロジェクトを実行します！Trigger Notification Window "ボタンをクリックしてください。デスクトップの右下にカスタム通知が表示されます！これはPubNubを利用しているため、このアプリケーションを複数のマシンで実行している場合、各ボタンをクリックするたびにすべてのマシンに通知が表示されます。
他のPubNubSDKとクライアントデバイスを使用することで、通知システムは言語やデバイスに依存しません。
デスクトップトースト通知を始める
このデスクトップ通知パターンは、ユーザーエクスペリエンスの向上を目的としたカスタムプッシュ通知のために変更することができます。複数のチャネルを使用し、 Access Manager を使用して、特定のチャネルの読み取り/書き込みを許可するユーザーを保護することもできます。
C#のコード例については、devrel@pubnub.com、またはアプリ開発のスピードアップに役立つドキュメントや 開発者向けリソースをご覧ください！
PubNubはどのようにあなたを助けることができますか？
この記事はPubNub.comに掲載されたものです。
PubNubのプラットフォームは、開発者がWebアプリ、モバイルアプリ、IoTデバイス向けにリアルタイムのインタラクティブ機能を構築、提供、管理できるように支援します。
私たちのプラットフォームの基盤は、業界最大かつ最もスケーラブルなリアルタイムエッジメッセージングネットワークです。世界15か所以上で8億人の月間アクティブユーザーをサポートし、99.999%の信頼性を誇るため、停電や同時実行数の制限、トラフィックの急増による遅延の問題を心配する必要はありません。
PubNubを体験
ライブツアーをチェックして、5分以内にすべてのPubNub搭載アプリの背後にある本質的な概念を理解する
セットアップ
PubNubアカウントにサインアップすると、PubNubキーに無料ですぐにアクセスできます。
始める
PubNubのドキュメントは、ユースケースやSDKに関係なく、あなたを立ち上げ、実行することができます。
