注意、最新のUI

すべてのWindowsストアアプリ開発者は、ガイドラインを知る必要があります。

英語から翻訳されたガイドライン-推奨事項、ガイドライン。 アプリケーションがストアに入るために推奨事項に従う必要はありませんが、推奨事項に従うことをお勧めします。 いくつかの機能があります。つまり、表現された機能（英語の機能）があり、各アプリケーションに必要です。 これらの機能を検討し、同時に開発を開始できるWindowsストアアプリケーションのC＃/ XAMLテンプレートを作成することにしました。 結局、何らかの方法で、特定の機能のスニペットコードをコピーするために、以前に開発されたアプリケーションまたはMSDNに頻繁に移動する必要があります。

以下に説明する機能は、アプリケーションに関連するガイドラインを作成するだけでなく、ユーザーの注意を引き付け、プロモーションにも役立つ追加機能でアプリケーションを装飾します。

共有契約

ユーザーが電子メールを友人に送信したり、ソーシャルネットワーク上のアプリケーション/ゲームに関する情報を共有したりするには、アプリケーションコードに共有契約を追加する必要があります。 これを行うには、次の手順を実行します。

名前空間を追加します。

using Windows.ApplicationModel.DataTransfer;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

そして、ページクラスで変数宣言を追加します。

 private DataTransferManager dataTransferManager;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

次に、ページに出入りするイベントを再定義します。

 protected override void OnNavigatedTo(NavigationEventArgs e) { //    share this.dataTransferManager = DataTransferManager.GetForCurrentView(); this.dataTransferManager.DataRequested += new TypedEventHandler<DataTransferManager, DataRequestedEventArgs>(this.DataRequested); } protected override void OnNavigatedFrom(NavigationEventArgs e) { //   this.dataTransferManager.DataRequested -= new TypedEventHandler<DataTransferManager, DataRequestedEventArgs>(this.DataRequested); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

共有できる最も簡単なコンテンツは、見出し、テキスト、およびリンクです。

  private void DataRequested(DataTransferManager sender, DataRequestedEventArgs e) { Uri dataPackageUri = new Uri("http://apps.microsoft.com/windows/ru-ru/app/mp3/0122ffd9-585f-4b3d-a2ad-571f74231d14"); DataPackage requestData = e.Request.Data; requestData.Properties.Title = " "; requestData.SetWebLink(dataPackageUri); requestData.Properties.Description = "   - . ,     ."; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ファイルまたは画像を送信することもできます。 メッセージをHTML形式で送信できるオプションがあります。

マジックチャームソケットを呼び出し、その中の次のアイコンを選択することにより、Windows 8.1から共有できます。



Windows 10では、アプリケーションの左上隅にある同じアイコンをクリックしてコンテンツを共有できます。



コードからプログラムでウィンドウを開くには、次の行を使用できます。

 Windows.ApplicationModel.DataTransfer.DataTransferManager.ShowShareUI();
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

公式ガイドは次の場所にあります。

クイックスタートガイド：コンテンツ共有（XAML）

ライブタイル

確かに、開始画面の一部のタイルは時間とともに変化することに気づきました。 たとえば、ニュースサイトタイルまたは財務アプリケーションタイルを取り上げます。これらのタイル自体がセキュリティ情報を更新します。 一部のタイルは数秒ごとに変化するため、ユーザーの注意を引き付けます。 これらは、いわゆる「ライブ」タイル/タイルです。

アプリケーションがタイルを変更するには、 プッシュ通知を送信できますが、アプリケーション自体からタイルを更新できます。

アプリケーションからタイルを更新するには、最初に名前空間を追加する必要があります

 using Windows.UI.Notifications;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

次に、タイルの外観とテキストを変更する簡単なメソッドを記述します。

 void UpdateTileWithText() { // #    var tileXml = TileUpdateManager.GetTemplateContent(TileTemplateType.TileSquare150x150Text04); var tileAttributes = tileXml.GetElementsByTagName("text"); string tiletext = " -      "; tileAttributes[0].AppendChild(tileXml.CreateTextNode(tiletext)); var tileNotification = new TileNotification(tileXml); tileNotification.ExpirationTime = DateTimeOffset.UtcNow.AddHours(1); TileUpdateManager.CreateTileUpdaterForApplication().Update(tileNotification); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

この例では、4行のテキストを含むタイルがテンプレートとして使用されました。 すべてのパターンは、 タイルパターンカタログで入手できます。



ガイドラインによると、アプリケーションには正方形と幅広のタイルを使用することを強くお勧めします。したがって、同じコードを複製し、タイルを正方形ではなく幅広としてテンプレートとして指定することをお勧めします。 つまり、この例では、 TileTemplateType.TileSquare150x150Text04をTileTemplateType.TileWide310x150Text04に置き換えます。



私のアプリケーションでは、App_Suspendingイベント中にタイルを更新して、ユーザーが何を止めたかを思い出させましたが、これはいつでもできます。

行われた変更をクリアし、タイルを元のフォームに戻す必要がある場合、次の行のコードからこれを行うことができます。

 TileUpdateManager.CreateTileUpdaterForApplication().Clear();
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

公式ではありますが、簡潔ではありますが、もう少し詳細な説明がここにあります。

クイックスタートガイド：タイル更新の送信（XAML）

評価とレビュー

控えめにユーザーを招待してアプリケーションを評価することをお勧めします。 良い評価とレビューは、オファーの人気を高めるのに役立ちます。 さらに、ユーザーレビューにより、アプリケーションの機能とデザインにタイムリーで有用な変更を加えることができます。 推定値でWindowsストアウィンドウを開くには、URIを作成して開きます。 これには2行で十分です。

  var uri = new Uri("ms-windows-store:Review?PFN=9cc1e6dd-9d82-4736-aee5-acb9a01d9c39_1dv79ndb6c382"); await Windows.System.Launcher.LaunchUriAsync(uri);
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ページはawaitを使用して非同期で開かれることに注意してください。 その場合、ボタンのクリック手順に非同期述語を追加する必要があります。

URIの生成は比較的簡単です。 「ms-windows-store：Review？PFN = "」というテキストに、パッケージファミリ名または略称PFNを追加する必要があります。 アプリケーションマニフェストを開くと、その意味がわかります。



ストア内のアプリケーションへのリンクを作成する方法の公式ガイドへのリンク：

アプリへのリンク

キーワードもロシア語の翻訳で誤って翻訳されたため、彼は英語でリンクを示しました。



テンプレートは10ではなく8.1で記述しているため、少し混乱しています。 WP 8.1のURI生成方法は、WindowsストアアプリケーションのURI生成方法とわずかに異なります。 WP 8.1の場合、URIは次のようになります。

ms-windows-store：reviewapp？appid = cq23k522-7u59-1193-h4aa-3t56e4633c24

公式ガイド（ロシア語）：

ストア内のアプリケーションへのリンク



評価とユーザーフィードバックを取得するための非常に良い方法は、一定数の開始後にアプリケーションを評価することです。 ユーザーがアプリケーションを5回起動したため、アプリケーションについて何か言いたいことがあると想定します。

アプリケーションの起動回数は、アプリケーション設定を使用して保存できます。 同時に、設定を保存する方法を見つけます。

設定

アプリケーションが起動された回数をカウントできる単純なスニペット：

変数宣言で、次を追加します。

 int appRunCount = 0; Windows.Storage.ApplicationDataContainer localSettings = Windows.Storage.ApplicationData.Current.LocalSettings;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

this.InitializeComponent（）の後のページクラスコンストラクター内。 追加：

  try { appRunCount = (int)localSettings.Values["AppRunCount"]; } catch { } appRunCount++; try { localSettings.Values["AppRunCount"] = appRunCount; } catch { }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

したがって、appRunCount変数にアプリケーションの起動数を取得します。

Windows.Storage.ApplicationData.Current.LocalSettingsの代わりに、Windows.Storage.ApplicationData.Current.RoamingSettingsを使用できます。 これを行うと、ローカルではなくデバイスに設定を保存できますが、ローミング、つまり ネットで。 これらは、Microsoftユーザーアカウントに保存されます。 RoamingSettingsは、同じアカウントからログインしているすべてのデバイスから利用できます。

5回目のアプリケーションの起動時にメッセージが発行される簡単なコード。ユーザーが評価を付けることに同意すると、ストアウィンドウが開き、フィードバックを残す提案が表示されます。

  if (appRunCount == 5) { var messageDialog = new Windows.UI.Popups.MessageDialog(", ,   ", "  !"); //      /  messageDialog.Commands.Add(new Windows.UI.Popups.UICommand(" ", new Windows.UI.Popups.UICommandInvokedHandler(CommandHandler))); messageDialog.Commands.Add(new Windows.UI.Popups.UICommand("   ", new Windows.UI.Popups.UICommandInvokedHandler(CommandHandler))); messageDialog.Commands.Add(new Windows.UI.Popups.UICommand("  ", new Windows.UI.Popups.UICommandInvokedHandler(CommandHandler))); messageDialog.DefaultCommandIndex = 0; messageDialog.CancelCommandIndex = 2; await messageDialog.ShowAsync(); } private async void CommandHandler(IUICommand command) { if (command.Label==" ") { var uri = new Uri("ms-windows-store:PDP?PFN=9cc1e6dd-9d82-4736-aee5-acb9a01d9c39_1dv79ndb6c382"); await Windows.System.Launcher.LaunchUriAsync(uri); } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

質問ボックスは標準に見え、あまりにも普通です。 理想的には、アプリケーションの設計に適合する設計を持つ独自のPopUpを作成することが最善です。 しかし、これはすでにこの記事の範囲外です。

計算したアプリケーション設定を保存する方法。



公式ガイドの参照先は次のとおりです。

設定をダウンロードして保存する



ユーザーがModern UIアプリケーションの一部の設定を変更できるようにするために、「フライアウト」ソケットを作成することができます-フライアウト

設定フライアウト

この機能は、Windows 8.1および10でのみ使用できます。Windows8では、同様のソケットを作成したい場合は可能ですが、独自のユーザーコントロールを作成する必要がありました。

設定を含む「フライアウト」パネルをアプリケーションに追加するには、Settings Flyoutと呼ばれる新しいコントロールを追加する必要があります（ロシア語版の「パラメーターのポップアップ要素」）。 手順は次のとおりです。 メニューに移動します。

プロジェクト-新しいアイテムの追加...-Visual C＃-XAML-設定フライアウト

または

プロジェクト-新しいアイテムの追加-ビジュアルC＃-XAML-パラメーターポップアップ

たとえば、次のように新しい要素に名前を付けます。CustomSettingsFlyout.xaml

App.xaml.csアプリケーションに名前空間参照を追加します。

 using Windows.UI.ApplicationSettings; using Windows.UI.Popups;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

そして、次のコード：

  protected override void OnWindowCreated(WindowCreatedEventArgs args) { SettingsPane.GetForCurrentView().CommandsRequested += OnCommandsRequested; } private void OnCommandsRequested(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args) { SettingsCommand settingsCommand = new SettingsCommand("SettingsPage", "Open settings",new UICommandInvokedHandler(onSettingsCommand)); args.Request.ApplicationCommands.Add(settingsCommand); } private void onSettingsCommand(IUICommand command) { CustomSettingsFlyout settingsFlyout = new CustomSettingsFlyout(); settingsFlyout.Show(); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

これで、アプリケーション設定を呼び出すと、ウィンドウが表示されます。 必要に応じて、CustomSettingsFlyout要素のXAMLおよびC＃コードを編集できます。

Windows.Storage.ApplicationData.Current.LocalSettingsクラスを使用して設定を保存する方法を学習しました



公式マニュアル：

クイックスタート：アプリケーション設定の追加（XAML）

ポップアップ通知

ユーザーに何かを通知するために、トースト通知を表示できます。 これは、Flyoutのように右側にポップアップする画像とテキストを含む小さな長方形です。 MessageBoxとは異なり、トースト通知はアプリケーションインターフェイスをブロックしません。 コード内で通知呼び出しが別のメソッドで囲まれていると非常に便利です。 さらに2つの名前空間を追加します。

 using Windows.Data.Xml.Dom; using Windows.UI.Notifications;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

そして、テキストをパラメータとしてwhichを呼び出した後、通知を受け取るメソッド自体を追加します。

  void ShowToast(string whattext) { XmlDocument toastXml = ToastNotificationManager.GetTemplateContent(ToastTemplateType.ToastText01); XmlNodeList stringElements = toastXml.GetElementsByTagName("text"); stringElements[0].AppendChild(toastXml.CreateTextNode(whattext)); ToastNotification toast = new ToastNotification(toastXml); toast.Activated += ToastActivated; toast.Dismissed += ToastDismissed; toast.Failed += ToastFailed; ToastNotificationManager.CreateToastNotifier().Show(toast); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

xmlに設定する最初の行は、ToastText01テンプレートです。 これは、3行にわたるテキストのみを含む非常に単純なテンプレートです。

可能なテンプレートはすべてここにあります： ポップアップ通知テンプレートカタログ

また、通知のアクティブ化、通知の非表示、および通知エラーの3つのイベントにサブスクライブしていることにも気づくでしょう。 次に、これらのイベントのハンドラーを実装する必要があります（コードがなくても）。

  private void ToastFailed(ToastNotification sender, ToastFailedEventArgs args) { } private void ToastDismissed(ToastNotification sender, ToastDismissedEventArgs args) { } private void ToastActivated(ToastNotification sender, object args) { }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

公式ガイド：

クイックスタートガイド：ポップアップ通知（XAML）を送信する

AppBarおよびCommandBar

最後に、標準コントロールを備えたパネルをアプリケーションに追加します。

パネルは上部でも下部でもかまいません。 通常、コマンドとツールのボタンは下部パネルに配置されます。

次のタグを使用して、XAMLでパネルを作成できます。

 <Page.TopAppBar> <!-- content --> </Page.TopAppBar>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

または

 <Page.BottomAppBar> <!-- content --> </Page.BottomAppBar>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

パネルのコンテンツは、AppBar要素（最愛の人が配置したいさまざまなコントロール用）またはCommandBar要素（ボタンのみ-AppBarButton、AppBarToggleButtonおよびAppBarSeparator要素のXAML）です。 通常のアプリケーションでは、通常のボタンで十分なので、CommandBarに限定します。 コードは次のとおりです。

  <Page.BottomAppBar> <CommandBar IsOpen="True"> <AppBarButton Label=" Vote and review" Icon="Like" Click="ReviewButton_Click"/> <AppBarButton x:Name="btnSecTile" Label="Add to Start" Click="btnSecTile_Click" Icon="Pin"/> <CommandBar.SecondaryCommands> <AppBarButton Label="Share" Icon="OtherUser" Click="ShareButton_Click"/> </CommandBar.SecondaryCommands> </CommandBar> </Page.BottomAppBar>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

IsOpen =” True”属性に注意してください。 アプリケーションを開くとき、ユーザーがその可用性を認識し、それに応じてアプリケーションにどんな機会があるかを知るようにパネルを表示することが望ましいです。 また、左パネルに反映されるボタンを含むネストされたタグCommandBar.SecondaryCommandsに気付くことができます。 それらは二次的なものです。



公式ガイド：

クイックスタートガイド：アプリケーションパネルの追加（XAML）

二次タイル

ユーザーが補助タイル/タイルをWindowsスタート画面に修正できるようにすることが可能です。 このタイルをクリックすると、特定のパラメーターでアプリケーションを開くことができ、補助タイルを「ライブ」（つまり、ライブタイル）にして特別なアラートを表示できます。

まず、セカンダリタイルを追加するために、必要な欠落している名前空間を追加します。

 using Windows.UI.StartScreen;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

InitializeComponent（）の後のページコンストラクター。 パラメータを使用してメソッド呼び出しを追加します。

 ToggleAppBarButton(!SecondaryTile.Exists("MyUnicTileID"));
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ここで、MyUnicTileIDはタイルの一意の識別子です

次に、ToggleAppBarButtonメソッド自体を追加する必要があります。このメソッドは、補助タイルの現在の状態に応じて、アタッチアイコンまたはデタッチアイコンを表示します。

  public void ToggleAppBarButton(bool showPinButton) { if (showPinButton) { btnSecTile.Label = ""; btnSecTile.Icon = new SymbolIcon(Symbol.Pin); } else { btnSecTile.Label = ""; btnSecTile.Icon = new SymbolIcon(Symbol.UnPin); } this.btnSecTile.UpdateLayout(); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ここで、showPinButtonは渡された値を保存するブール変数です！SecondaryTile.Exists（ "MyUnicTileID"）、つまり アプリケーションの補助タイルが開始画面に添付されているかどうか。

次に、ボタンクリックイベントにコードを追加します。 このコードは、タイルを初期画面に添付するか、固定を解除します。

  private async void btnSecTile_Click(object sender, RoutedEventArgs e) { Windows.Foundation.Rect rect = GetElementRect((FrameworkElement)sender); if (SecondaryTile.Exists("MyUnicTileID")) { SecondaryTile secondaryTile = new SecondaryTile("MyUnicTileID"); bool isUnpinned = await secondaryTile.RequestDeleteForSelectionAsync(rect, Windows.UI.Popups.Placement.Above); ToggleAppBarButton(isUnpinned); } else { // Pin Uri square150x150Logo = new Uri("ms-appx:///Assets/Logo.scale-100.png"); string tileActivationArguments = "Secondary tile was pinned at = " + DateTime.Now.ToLocalTime().ToString(); string displayName = "Application name"; TileSize newTileDesiredSize = TileSize.Square150x150; SecondaryTile secondaryTile = new SecondaryTile("MyUnicTileID", displayName, tileActivationArguments, square150x150Logo, newTileDesiredSize); secondaryTile.VisualElements.Square30x30Logo = new Uri("ms-appx:///Assets/SmallLogo.scale-100.png"); secondaryTile.VisualElements.ShowNameOnSquare150x150Logo = true; secondaryTile.VisualElements.ForegroundText = ForegroundText.Light; bool isPinned = await secondaryTile.RequestCreateForSelectionAsync(rect, Windows.UI.Popups.Placement.Above); ToggleAppBarButton(!isPinned); } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

また、関数を追加する必要があります

  public static Rect GetElementRect(FrameworkElement element) { GeneralTransform buttonTransform = element.TransformToVisual(null); Point point = buttonTransform.TransformPoint(new Point()); return new Rect(point, new Size(element.ActualWidth, element.ActualHeight)); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

タイルを初期画面に修正すると、次のような警告が表示されます。



「App Template」は、アプリケーションの名前です。 タイルを修正するか、アプリケーションの空き領域のどこかをクリックしてポップアップを閉じることにより拒否できます。

いつものように、公式ガイドへのリンク：

クイックスタートガイド。 補助タイルの修正（XAML）



これらは、Windowsストアアプリの機能の一部でした。 それらを使用することを強くお勧めします。

GitHubのリンクから結果のテンプレートをダウンロードできます。

https://github.com/programmersommer/WindowsStoreAppTemplate

またはzipアーカイブとして（ロシア語のコメント付きバージョン）：

OneDrive