LoginSignup
11
10

More than 5 years have passed since last update.

iOSアプリでバッヂを表示させるOSS、3選

Posted at

はじめに

iOSアプリ内にバッヂをつけるためのOSSを3つ紹介します。

UIView+MGBadgeView

件数の表示用です。UIViewのカテゴリなので使いやすいです。

687474703a2f2f6935372e74696e797069632e636f6d2f317a62716b6e6c2e706e67.png

条件

Objective-Cベース。MITライセンス。iOS6.0+。Matteo Gobbi氏による。
https://github.com/matteogobbi/UIView-MGBadgeView

カスタマイズできるもの

badgeValue: NSInteger バッヂの内容。整数のみ。文字列はセットできない。何かの件数を表示するとき用に特化している。
outlineWidth: float 円の外枠の幅
badgeColor: UIColor バッヂの色
textColor: UIColor テキストの色
position: ボタンに対してどの角にバッヂを出すか。MGBadgePositionTopRightなどの定数が用意されている。
displayIfZero: Bool 0件のときに表示したい場合はtrueを指定。

その他、MGBadgeViewはUIViewのサブクラスなので、userInteractionEnabledを指定することなども可能。

インストール

cocoapods 'UIView+MGBadgeView'
@import UIView_MGBadgeView; としてModulesとしてインポートできる。

使った感想

  • UIViewのカテゴリなので、UIView由来のクラスなら既存コードをそのままにしたままバッヂを追加できる。とても使いやすい。
  • 最終コミットが現時点では1年前。安定しているので良いとも言えます。
  • Objective-Cベースなので、Swiftとのハイブリットなプロジェクトでも安心して使える。
  • バッヂの位置が標準のposition指定だとずれてしまうことがあった。すなわち、ボタンのレイアウトによっては間が空いた位置にバッヂが配置されてしまうことがある。この点については、.centerで直接badgeViewの位置を指定して調整した。
  • バッヂの上をタップするとボタンが反応しないので、userInteractionEnabled = falseをしてタップを透過させて使った。

MLPAccessoryBadge

文字列を指定できるバッチです。
badgeDemo.png

条件

Objective-Cベース。MITライセンス。iOS5.0+。Eddy Borja氏による。
https://github.com/EddyBorja/MLPAccessoryBadge

カスタマイズできるもの

  • バッヂの形状。種類ごとにクラスが用意されている。UIViewベースのMLPAccessoryBadgeと、それを継承したMLPAccessoryBadgeArrow、MLPAccessoryBadgeChevron(バッヂと>アイコン)、MLPAccessoryBadgeEmboss。デモがあるので、わかりやすいです。
  • バッヂの内容は、文字列、数値(NSNumberとIntの2パターンあり)を指定できる。
  • バッヂのテキストカラー(setTextColor)
  • バッヂの最小サイズ(badgeMinimumSize)
  • バッヂを非表示にする(badgeHidden) など。

インストール

cocoapods 'MLPAccessoryBadge'
Swiftでは、import MLPAccessoryBadgeでインポートできます。

使った感想

  • UITableViewCellのAccessoryViewにセットすると、右側にバッヂを出せる。Newなどのバッヂを出すときに向く。 ちなみに、非表示にしたいときはbadgeHiddenを使うのではなく、AccessoryViewにnilをセットするほうをおすすめします。Disclosureアイコンなどを表示する管理が楽になるからです。
  • ソースは2,3年前の更新が最終で、安定していて良いとも言えます。
  • Objective-Cベースなので、Swiftとのハイブリットなプロジェクトでも安心して使える。

UIBarButtonItem-Badge

UIButtonにバッチをつけることができます。

screenshot2.png

もちろん、名前の通り、UIBarButtonItemにバッチをつけることもできます。

screenshot.png

条件

Objective-Cベース。MITライセンス。iOS6.0+。mikeMTOL氏による。
https://github.com/mikeMTOL/UIBarButtonItem-Badge

カスタマイズできるもの

badgeValue: NSString 文字列なので、数値を文字列化してセットする。
badgeBGColor、badgeTextColorで色指定できるほか、badgeFontでフォント指定もできる。badgeOriginX,Yが用意されている。
shouldHideBadgeAtZeroをfalseにすると、0件と表示させることができる。

感想

  • スターが多い(今554件)。ソースの最終更新は3ヶ月前。メンテナンスに安心感がある。
  • UIButtonのカテゴリなので、ボタン以外にもつけたい場合に工夫が必要。その点を考えると、前掲のUIView+MGBadgeViewを使うほうが使いやすいと思います。ボタン以外につける予定が全くない場合、スター数やソースの更新を基準に、こちらのOSSのほうが良いかもしれません。
  • Objective-Cベースなので、Swiftとのハイブリットなプロジェクトでも安心して使える。
11
10
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
10