Xamarin.FormsのTabbedPageでバッジを表示する

公開日: : 最終更新日:2016/11/03 Blog, Microsoft , , , , ,

iOSのタブバーはNative側でバッジ機能があるのだが、Androidにはそもそもバッジが無いらしい。
カスタムレンダラーで頑張って作ってみようと思ったら既にあった…。

GitHub : xamarin-forms-tab-badge
License : MIT
※プレリリース(2016/10/31)

NuGetで取得

  • ソリューションエクスプローラーでソリューションを右クリックし、ソリューションの NuGet パッケージの管理(N)を選択
  • プレリリースを含めるにチェック
  • Plugin.Badgeを検索し、全プロジェクトにインストール

iOS側のレンダラー登録

xxx.iOSの/Properties/AssemblyInfo.csに以下を追加

【余談】
XF標準のTabbedPageTabbedRendererを継承したBadgedTabbedPageRendererを指定することでXFは標準コントロールのままでネイティブ側の動きだけをカスタマイズできるの知らなかった。
XF側も継承コントロール必須だと思ってた。

Android側のレンダラー登録

Android側もAndroid用のレンダラーを登録
xxx.Droidの/Properties/AssemblyInfo.csに以下を追加

Forms側で使う

  • TabbedPageはXF標準のものでOK

  • 各ページに設定されたPlugin.Badge.Abstractions.TabBadge.BadgeTextがバッジのテキストとして表示される。

  • TabBadgeBadgeColorでバッジの色を指定

  • 空文字またはnullでバッジを非表示にできる(※現在iOSは空文字だとクリアされずに空バッジが表示されるっぽい
    Issue挙げたら速攻対応してくれた【2016/11/03追記】

※ChildrenがNavigationPageなのは深い意味はない。

実行結果

  • Android
    badge-droid

  • iOS
    badge-ios

関連記事

no image

【VB.NET】DataGridViewで行の最大高を設定

DataGridViewにおける行の最大高さを設定するメモ 最大高さに満たない場合は内容を全て表示

記事を読む

no image

Xamarin.UITest, Xamarin Test Cloud にて iPhone 6 Plus, 6S Plus, 7 Plus などで app.Tap が効かない

動作しないというか、app.Tapがどうしても反応しない。 app.ScreenShotなどは動作す

記事を読む

no image

Expression Encoder を組み込んだアプリケーションを配布する際のライセンス問題

Windowsアプリケーションにメディア編集機能を実装したい場合に、Expression Encod

記事を読む

Visual Studio 2015 Update1 の Xamarin.Forms でインテリセンスを使いたい

Xamarinを触り始めました。 チュートリアルということで、Xamarin.Forms Quick

記事を読む

Xamarin Studio から Visual Studio for Mac へ変更してから、”The “XamlCTask” task failed unexpectedly.” が発生。

Visual Studio for Mac がGAしたので、インストールしてみた。 それまで開発して

記事を読む

【ストアアプリ】タイル通知(TileUpdateManager)について

こんにちは。 ストアアプリでタイル通知を行う方法を調べました。 前回のトースト通知と

記事を読む

UWPをHockeyApp対応させる

走り書きメモ。 UWPをHockeyApp対応させるためにはNuGetパッケージを使ってモジュール

記事を読む

AdMob,Nendメディエーション時の優先順位

先日リリースしたアプリでは勉強を兼ねて、 AdMob+Nendでのメディエーション広告を実装し

記事を読む

【.NET】【WPF/XAML】ローカルPDFを画面に表示する

[crayon-5b046b6f1406c033381870/] [vb] Public

記事を読む

拡張温度に対応した Windows 10 IoT Core ボード

Windows 10 IoT Core 対応ボード その2 こっちは拡張温度対応している。 Ban

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

PAGE TOP ↑