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

関連記事

Minnow Board Turbot + Windows 10 IoT Core をSSD上で動作させる

MinnowBoard は SATAが搭載されているので、SSDなどが利用できる。 通常はSDカード

記事を読む

no image

【ストアアプリ】資格情報の保存と読み込み

こんにちは。 Windowsストアアプリで資格情報をセキュアに保存する方法について。

記事を読む

no image

Microsoft.OData.Clientでフォーム認証を行う

構成 サーバー ** Azure API Apps ** ASP.NET Web API クライ

記事を読む

no image

‘System.Windows.Navigation.BaseUriHelper’ のタイプ初期化子が例外をスローしました。

作成した.NETアプリケーション(WPF)が起動しない。 今回は構成ファイル(app.config)

記事を読む

【VisualStudio2015】UWPアプリケーションのXAMLデザイナにて「パッケージを登録できませんでした。」

VisualStudio2015 / UWPアプリケーション / XAMLデザイナ / エラー のメ

記事を読む

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

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

記事を読む

UWPをHockeyApp対応させる

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

記事を読む

Flowで毎月の定期タスク設定

Flow を使い始めてみた。 Requrrenceで時間をトリガーにすることが出来るがSecond

記事を読む

【iPhoneアプリ】多言語対応させる2

今回はコード内の文字列を多言語化する ファイルを追加する。  

記事を読む

Hardware assisted virtualization and data execution protection must be enabled in the BIOS

MacBook Pro + Bootcamp + Windows10 で Docker for Wi

記事を読む

Message

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

PAGE TOP ↑