Flutterでレビュー機能を実装

image

開発環境

  • Flutter 3.3.10
  • Dart 2.18.6
  • in_app_review: ^2.0.6

この記事は、【 可茂IT塾 Advent Calendar 2022 】の20日目の記事です。

はじめに

 エンジニアとしてアプリを開発していく中で、コーディングしてアプリを作るのも楽しいですが、やっぱり開発者としては実際に作ったアプリを使ってもらった感想をフィードバックとしてもらった時が一番やりがいを感じれる瞬間なのではないかと考えています。

 もちろん、嬉しいことばかりではなく厳しい感想をもらうこともありますが、実際のユーザーからのフィードバックは今後のアプリのクオリティを上げるためには欠かせないものだと考えています。

 そのため、今回の記事ではApp Storeなどのリリースされたアプリに、アプリ内からレビューをする機能の実装について紹介していきます。

今回の実装する機能

 今回の記事で紹介するレビュー機能は、アプリ内にレビューボタンを作成しておいて、そのボタンを押すとそのアプリについてのレビューが行えるという機能を実装していきます。

図1

 レビュー機能の実装は、in_app_reviewというパッケージを使うとかなり簡単に実装することができます!実際にやっていきましょう。

パッケージのインストール

まずはアプリにin_app_reviewのパッケージをインストールをします。パッケージのインストール先はpubspec.yamlファイルです。 in_app_reviewのパッケージはこちらになります。

pubspec.yamlファイルのdev_dependenciesに以下のように記述します。

pubspec.yamlファイルは非常にデリケートなので記述する箇所のindent等には注意が必要です。

pubspec.yaml

dev_dependencies:
  flutter_test:
    sdk: flutter

  in_app_review: ^2.0.6

dev_dependenciesの箇所に上記のように記述したら、画面上のpub getボタン、もしくはターミナルでflutter pub getを入力して実行します。

メッセージやターミナルでエラーが吐かれなければ、アプリにin_app_reviewのインストールが完了したことになります。

コード

レビュー機能を実装したいファイル

import 'package:in_app_review/in_app_review.dart';

  
  Widget build(BuildContext context) {
    final InAppReview inAppReview = InAppReview.instance;

    return Column(
      children: [
        const Divider(color: Colors.grey),
        ListTile(
          title: const Text('レビュー'),
          onTap: () async {
            if (await inAppReview.isAvailable()) {
              inAppReview.openStoreListing(appStoreId: 'App Store ID');
            }
          },
          trailing: const Icon(Icons.arrow_forward_ios),
        ),
        const Divider(color: Colors.grey),
      ],
    );
  }

build内にinAppReviewを定義します。onTap内でinAppReviewを呼び出して、App Storeのレビューをしてもらいたいアプリのレビュー画面へと遷移させます。

コードの一部を説明

 if文の条件のinAppReview.isAvailable()はそのOSのバージョンで使用できるかのチェックを行なっています。例えばiOSの場合はiOS 10.14のバージョンよりも上のバージョンでのみ機能する仕組みになっています。

 また、appStoreIdではレビューをしてもらいたいアプリのApp Store IDを入力します。App Store IDはApp StoreでレビューしてもらいたいアプリのURLの末尾の数字のことです。appStoreIdにURLの数字を入力すれば、レビューしてもらいたいアプリのレビュー画面へと遷移する実装になります。

(例)共有したいアプリのURL/id0000000000 ←この数字の部分

まとめ

 いかがでしたでしょうか。意外と簡単にレビュー機能の実装をすることができたのではないかと思います。

 実際にアプリを使っているユーザーからのレビューをたくさん貰い、今後のアプリ開発に役立てていければと思ってます。

お知らせ

3月19日開催のアプリ開発講座の参加者募集中!!

3月19日開催のアプリ開発講座の参加者募集中!!

3月19日にアプリ開発講座を開催します!会場は岐阜県美濃加茂市のコワーキングスペース「こやぁね」です。興味のある方は是非ご参加ください!

Read More
可茂IT塾ではFlutterインターンを募集しています!

可茂IT塾ではFlutterインターンを募集しています!

可茂IT塾ではFlutterインターンを募集しています!可茂IT塾のエンジニアの判断で、一定以上のスキルをを習得した方には有給でのインターンも受け入れています。

Read More

タグ

Flutter (70)初心者向け (22)イベント (15)Nextjs (8)Google Apps Script (7)可茂IT塾 (6)Firebase (6)React (5)新卒 (3)就活 (3)給与支払報告書 (3)riverpod (3)Dart (3)JavaScript (3)TypeScript (3)インターン (3)FlutterWeb (2)画像 (2)アプリ開発 (2)React Hooks (2)tailwindcss (2)ワーケーション (2)社会人 (2)大学生 (2)お知らせ (2)webfeed (1)RSS (1)CodeRunner (1)VSCode (1)個人開発 (1)設計 (1)フルリモート (1)学生向け (1)Java (1)Spring Boot (1)エンジニア (1)DeviceOrientation (1)正規表現 (1)神楽 (1)趣味紹介 (1)プログラミングだけではない可茂IT塾のメンバー (1)線型計画法 (1)事例 (1)PreferredSize (1)マテリアルデザイン (1)Material (1)クパチーノデザイン (1)Cupertino (1)ListView (1)就活浪人 (1)既卒 (1)保守性 (1)シェアハウス (1)スクレイピング (1)Gmail (1)Googleグループ (1)GoogleWorkspace (1)ShaderMask (1)google map (1)Google Places API (1)Vercel (1)Google Domains (1)branch (1)Git (1)オンラインオフィス (1)Freezed (1)アイコン (1)Apple Store Connect (1)FlutterGen (1)検索機能 (1)Navigator (1)メール送信 (1)カスタム認証 (1)アニメーション (1)FloatingActionButton (1)Arduino (1)ESP32 (1)経験談 (1)フリーランス (1)Dialog (1)Figma (1)デザイン (1)Slack (1)BI (1)非同期処理 (1)BackdropFilter (1)iOS (1)レビュー (1)getAuth (1)匿名 (1)Algolia (1)chakra-ui (1)コンサルティング (1)Symbol (1)reactive_forms (1)

お知らせ

3月19日開催のアプリ開発講座の参加者募集中!!

3月19日開催のアプリ開発講座の参加者募集中!!

3月19日にアプリ開発講座を開催します!会場は岐阜県美濃加茂市のコワーキングスペース「こやぁね」です。興味のある方は是非ご参加ください!

Read More
可茂IT塾ではFlutterインターンを募集しています!

可茂IT塾ではFlutterインターンを募集しています!

可茂IT塾ではFlutterインターンを募集しています!可茂IT塾のエンジニアの判断で、一定以上のスキルをを習得した方には有給でのインターンも受け入れています。

Read More