RiverpodのStreamProviderを使ってPushNotificationを実装してみた

はじめに エキサイト株式会社の高野です。エキサイトホールディングス Advent Calendar 2023の3日目を担当させていただきます。 今回はFlutterにおけるRiverpodのStreamProviderを使ってPushNotificationを実装した話です。 動作環境 Flutter: 3.13.4 hooks_…

FlutterKaigi 2023に参加してきました。

はじめに エキサイト株式会社の高野です。 今回はFlutterKaigi 2023に参加してきましたのでその感想及びレポートになります。 聴講したセッション一覧 Flutterアプリにおけるテスト戦略の見直しと自動テストの導入 出前館におけるFlutterの現在とこれから Ma…

Google I/O Extended Japan 2023に登壇します

はじめに エキサイト株式会社の髙野です。この度Google I/O Extended Japan 2023に登壇します。 今回はAppTrack, WebTrackに分かれていて、私はAppTrackの13:30 - 14:30にてFlutter の活用事例 / Live Q&Aについてお話しさせていただきます。 話す内容につい…

FlutterでRetryというライブラリを使ってみました

はじめに エキサイト株式会社の髙野です。 今回はFlutterでretryというライブラリを使用したのでこのretryの使用方法をご紹介します。 環境 Flutter: 3.7.0 retry: 3.1.0 使用方法 final r = RetryOptions(maxAttempts: 8); final response = await r.retry(…

Android Studioで開発時にFlutterでの生成ファイルを隠してファイルツリーを見やすくする

はじめに エキサイト株式会社の髙野です。 今回はAndroid Studioで開発している時にファイルツリーを見やすくする設定を書いていきます。 今回の問題 FlutterではModel(Entity)を作成する際にFreezedを使用するかと思います。その際 .freezed.dart .g.dart …

FlutterのローカルDBにDriftを使用する

はじめに エキサイト株式会社の髙野です。 今回はFlutterのライブラリであるDriftを使用しましたので紹介します。 そもそもDriftとは DriftとはiOSではRealm, AndroidではRoomのようにオブジェクトをアプリがアンインストール等されない限り端末内に残してお…

Flutterで独自UIのダイアログを作成する方法

はじめに エキサイト株式会社の髙野です。 エキサイトホールディングス Advent Calendar 2022の16日目を担当します。 今回はFlutterで独自UIのダイアログの作成方法を書いていきます。 実装 今回自分が実装した方法としては SimpleDialog を使用しました。 S…

FirebaseAnalyticsでscreen_viewにパラメータが付与できない

はじめに FlutterでAnalyticsを送信する時に setCurrentScreen を使用するかと思います。 その際にparameterを含めることができない問題を解消する方法がないか調べましたので備忘録として書きます。 実装 今回私が使用した方法としては FirebaseAnalytics …

画面全体にタップイベントをつける際に他のタップイベントを邪魔しないようにする方法

はじめに 今回は画面全体にタップイベントをつける方法を備忘録的に紹介します。 画面全体にタップイベントをつけた場合、それと同階層またはその下にあるタップイベントは反応しなくなってしまいます。その対処法として紹介します。 実装 よくあるScaffold…

表示非表示をアニメーション付きでハンドリングするWidgetの作り方

はじめに 今回のモチベーションとしては漫画のビューワーなどでフルスクリーン時にAppBarやNavigationBarの表示非表示を行いたいというものです。 実装 今回の例としてはAppBarをAnimation付きでハンドリングするためのものを紹介します。 class AnimationAp…

他のWidgetを邪魔せずに画面全体にタップイベントをつける方法

はじめに 今回のユースケースとしては漫画アプリ(viewer)でスワイプ操作などをそのままに左側タップで次のページに進んだりするときの実装です。 通常Stackを用いてViewの上に GestureDetector を置いてしまうと全てのアクションが GestureDetector に吸われ…

FlutterFireで複数の環境を分けてCrashlyticsを設定する方法

はじめに 業務としてアプリ開発する時にinhouse版を作ったり、stage版、develop版を作ったりすることがあるかと思います。 その際にFirebaseプロジェクトを本番とstage版などで分けた場合に自分がやった方法を解説します。 firebase_options.dartの生成 まず…

Chopperを用いたAPI通信

環境 Flutter3.0.3 chopper: 4.0.4 Client まずはClient部分の実装になります class AppChopper { static ChopperClient create(Ref ref, [String? baseURL]) { return ChopperClient( baseUrl: baseURL ?? ApiConfig.baseURL, converter: const JsonConvert…

エキサイトメディア事業部で採用しているRiverpodの使用法

はじめに 現状まだまだネイティブからFlutterへの移行の途中であり、最初期の構成としてはViewModelを定義してViewModelをStateNotifierProviderで状態管理している変数をView側に通知するようにしていたり、View側のタップ処理を受け付けるようにしていまし…

Dart2.17でアップデートされたEnumについて

2.17以前のEnum enum Fruit { apple, orange, grape, } このようにメンバーを定義するだけで、Javaのように中に定数を入れるようにするためにはExtensionを定義してあげないといけませんでした extension FruitExt on Fruit { String get name { switch (thi…

Rxdartを使用して値の変化を他タブなど別画面に通知する方法

これは エキサイトホールディングス Advent Calendar 2021 21日目の記事です。 エキサイト株式会社の高野です。今回はFlutterにおける別画面への値渡しや通知をする方法についてです。 実装 まずはじめに通知を受ける変数として以下を定義します。 final hog…

iOSでネイティブ広告を出す際にIBOutletを繋げられない時の対処法

これは エキサイトホールディングス Advent Calendar 2021 18日目の記事です。 エキサイト株式会社の高野です。今回はFlutterにおけるネイティブ広告の話です。 はじめに 今回の記事はgoogle_mobile_ads(1.0.0)の話ですので他のライブラリを使っていたり、バ…

WebViewの高さをローディング時に動的に変える方法

はじめに 2021年度アドベントカレンダーの2日目の担当の高野です。メディア事業部のアプリではWebViewを使うことが多く、その備忘録として残します。 動作バージョン Flutter 2.5.1 Dart 2.14.0 webview_flutter 2.1.1 実装 今回はwebview_flutterを使用して…

state_notifierとfreezedのプロジェクトでMockitoを用いたunit test

エキサイト株式会社の高野です。 弊社では最近Flutterでテストを書き始めました。state_notifierとfreezedを用いたプロジェクトをどうやってテストしようか考えていた所Mockitoを見つけ、よさそうでしたので書いてみたコードの流れの紹介になります。 各バー…

TabBarの選択ボタンを中央寄せにするアニメーション付き無限スクロール化するTips2

エキサイト株式会社の高野です。 前回 TabBarの選択ボタンを中央寄せにするアニメーション付き無限スクロール化するTips を書いたのですが、また別の方法で実装しましたのでその方法を紹介します。 (前回と同様にTabBarをListViewで実装する際の一例です。) …

statusBarの表示非表示ハンドリング

エキサイト株式会社の高野です。 今回はFlutterを書いていく中でiOSでstatusBarが表示されない(消えてる)問題の解決に当たっていたのでその辺りについて書いていこうと思います。 環境 iOS: 14.5 Flutter: 2.0.6 Android Studio: 4.1.3 解決方法 先にXcodeの…

TabBarの選択ボタンを中央寄せにするアニメーション付き無限スクロール化するTips

こんにちは。 エキサイト株式会社の高野です。 今回はTabBarをListviewで実装することを前提にお話ししていくことを前提としていきます。 FlutterでTabBarを無限スクロール化する方法はいくつかあり、ライブラリでいうと infinite_listview や indexed_list_…