【swift】animated-tab-barを試してみる

今回は読んで字の如く、タブバーアイコンのアニメーションが簡単にできる「animated-tab-bar」を試していきたいと思います。ライセンスはMITです。

リンク先に動作イメージのアニメーションがあるので、ご参考に

GitHub - Ramotion/animated-tab-bar: :octocat: RAMAnimatedTabBarController is a Swift UI module library for adding animation to iOS tabbar items and icons. iOS library made by @Ramotion

:octocat: RAMAnimatedTabBarController is a Swift UI module library for adding animation to iOS tabbar items and icons. iOS library made by @Ramotion - Ramotion/...

github.com

では、いきましょう

手順

１．まずはプロジェクトを作成して、podで該当ライブラリをインストール＆xcworkspaceを起動します。（今回のサンプルプロジェクト名にハイフンが入っていますが、良い子はマネしないように！）

【swift】外部ライブラリ管理 - CocoaPods

iOSのアプリ開発で外部ライブラリを導入・管理するツールはいくつかありますが、メジャーな「CocoaPods」を使ってみたいと思います。手順１．まず先にXCODEで新規プロジェクトを作成しておきます。２．タ...

pomarano.site

2020.03.21

pod 'RAMAnimatedTabBarController'

２．storyboardでTab Bar Controllerを追加します。

　　白矢印（initial view）をTab Bar Controllerに移しておくのも忘れずに

３．Tab Bar ControllerのClassとModuleにRAMAnimatedTabBarControllerを設定します。

４．各UITabBarItemのClassにRAMAnimatedTabBarItemを設定します。

　　ModuleにはRAMAnimatedTabBarControllerを設定します。

５．Assets.xcassetsに画像を追加したら（30pxが丁度いいみたいです。使用したのは32px）

　　各UITabBarItemに画像を設定します。

６．Objectを追加したらClassにアニメーションを設定します。（矢印が不格好ですみません。。。）

　　ModuleにはRAMAnimatedTabBarControllerを設定します。

　　アニメーションは下記が設定できるようです。

• RAMBounceAnimation
• RAMLeftRotationAnimation
• RAMRightRotationAnimation
• RAMFlipLeftTransitionItemAnimations
• RAMFlipRightTransitionItemAnimations
• RAMFlipTopTransitionItemAnimations
• RAMFlipBottomTransitionItemAnimations
• RAMFrameItemAnimation
• RAMFumeAnimation

７．TabBarItemとObjectを接続します。

　　TabBarItemからcontrolキーを押しながら、ObjectにドラッグアンドドロップするとOutletsが表示されると思いますので、animationを選択して接続します。

以上で、設定完了です。

シミュレータか実機で確認してみてください。

結構簡単に実装できるので、ワンポイントとして使ってみてもいいかもですね！