待办事项列表应用

一个使用Dart和Flutter创建的跨平台**待办事项列表应用**。我遵循了Johannes Mike的教程进行个人学习。然后开始调整应用程序以进行自定义，并更多地了解Flutter。

Flutter设置

步骤

根据您的操作系统，按照官方网站上的说明进行操作。就我而言，我使用的是**Windows**。

  • 从链接下载并安装JDK
  • 安装Git
  • 下载最新稳定版本的**Flutter SDK**
  • 解压缩zip文件，并将包含的flutter放置在Flutter SDK所需的安装位置。
  • 警告：请勿将Flutter安装在需要管理员权限的目录中，例如C:\Program Files\。
  • 将flutter\bin添加到您的PATH环境变量
  • 下载并安装**Android Studio**和**VS Code**
  • 从Android Studio的**SDK管理器**中安装Android SDK Tools和Google usb driver
  • 在VS Code中安装Flutter和Dart扩展。
  • 在Android Studio的**AVD管理器**中设置一个模拟器，以便在虚拟设备上运行您的应用程序。或者，您也可以使用真实设备。

Firebase设置

Android步骤

  • 在您的Firebase账户中创建一个新的项目
  • 然后创建一个Android应用
  • 在android/app/main/src/build.gradle中查找package name，并找到applicationID
  • 注册应用程序
  • 将Firebase Android配置文件添加到您的应用程序
  • 点击下载google-services.json以获取您的Firebase Android配置文件。
  • 将您的配置文件移动到应用程序的模块（app级别）目录中。
  • 在您的根目录（项目级别）Gradle文件中（build.gradle），添加规则以包含Google Services Gradle插件。同时检查您是否拥有Google的Maven仓库。

dependencies {
    // ...

    // Add the following line:
    classpath 'com.google.gms:google-services:4.3.10'  // Google Services plugin
  }
}
  • 在您的模块（app级别）Gradle文件中（通常是app/build.gradle），应用Google Services Gradle插件

apply plugin: 'com.android.application'
// Add the following line:
apply plugin: 'com.google.gms.google-services'  // Google Services plugin

android {
  // ...
}
  • 声明您想在应用程序中使用的**Firebase**产品的依赖项。在您的模块（app级别）Gradle文件中（通常是app/build.gradle）声明它们。

dependencies {
  // ...
  // Declare the dependency for the Firebase SDK for Google Analytics
  implementation 'com.google.firebase:firebase-analytics'
}
  • 点击下一步

iOS步骤

  • 在Flutter中，bundle id与Android情况下的产品名称相同。但是，您可以通过在**Xcode**中打开iOS文件夹来获取它。选择Runner，然后选择General选项卡。复制您的Bundle Identifier并粘贴到浏览器中。
  • 输入信息并注册应用程序
  • 点击下载GoogleService-Info.plist以获取您的Firebase Apple平台配置文件。
  • 将此文件拖放到Runner/Runner文件夹中。请确保已勾选**Add to targets**。
  • 接下来，转到iOS\Podfile。将iOS平台更改为10.0。如果您没有Podfile，则可以通过flutter run或pod init命令生成它。
  • 在您的浏览器中，连续点击Next，然后点击continue to console。

链接

应用功能

  • 添加、编辑和删除任务
  • 多彩的小部件
  • 使用firebase进行本地和云存储

解决问题

如果您在将项目复制到不同设备或在某些包更新后遇到构建问题，请在执行任何其他操作之前尝试以下步骤。
在根目录中运行以下命令。

flutter clean
flutter pub get
flutter run

不安全的安全检查

如果您使用的firebase插件版本较旧，某些包会给出**不安全的安全检查**问题。通过在运行命令中添加
–no-sound-safety-check 参数来解决此问题。

flutter run --no-sound-safety-check

在iOS上运行

  • iOS运行需要Podfile。它会在Flutter运行后自动生成。
  • 如果xcode不起作用（总体上或在复制的项目中），请删除ios/Podfile（包括锁定文件和pod）。

然后在根项目目录中运行。

flutter clean
flutter pub get
flutter run

IO.GRPC 错误

如果您看到错误"issue: I/Process ( 5084): Sending signal. PID: 5084 SIG: 9"，请执行以下操作来解决它。

  • 打开android/app/build.gradle
  • 在dependencies列表中，添加implementation "io.grpc:grpc-okhttp:1.32.2"

dependencies {
    .
    .
    implementation "io.grpc:grpc-okhttp:1.32.2"
}

版本问题

‘IPHONEOS_DEPLOYMENT_TARGET’版本错误

  • 添加到Podfile

post_install do |installer|
  installer.pods_project.targets.each do |target|
      flutter_additional_ios_build_settings(target)
      target.build_configurations.each do |config|
         if config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'].to_f < 10.0
           config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '10.0'
         end
      end
  end
end

迁移到cloud_firestore 2.0.0的迁移

  • 迁移涉及在多个地方添加<Map<String, dynamic>>
  • 只有在您使用较新版本的firebase_core和cloud_firestore时才执行此操作。

示例

- StreamBuilder<DocumentSnapshot>(
+ StreamBuilder<DocumentSnapshot<Map<String, dynamic>>>(
  stream: FirebaseFirestore.instance.collection('movies').doc('star-wars').snapshots(),
-  builder: (BuildContext context, AsyncSnapshot<DocumentSnapshot> snapshot) {
+  builder: (BuildContext context, AsyncSnapshot<DocumentSnapshot<Map<String, dynamic>>> snapshot) {
    // ...
  }
)

我的情况

  • 在utils.dart中更改转换器，从

static StreamTransformer<QuerySnapshot, List<T>> transformer<T>(
      T Function(Map<String, dynamic> json) fromJson) =>
  StreamTransformer<QuerySnapshot, List<T>>.fromHandlers(
    handleData: (QuerySnapshot data, EventSink<List<T>> sink) {
      final snaps = data.docs.map((doc) => doc.data()).toList();
      final users = snaps.map((json) => fromJson(json)).toList();

      sink.add(users);
    },
  );

to

  static StreamTransformer<QuerySnapshot<Map<String, dynamic>>, List<T>>
      transformer<T>(T Function(Map<String, dynamic> json) fromJson) =>
          StreamTransformer<QuerySnapshot<Map<String, dynamic>>,
              List<T>>.fromHandlers(
            handleData: (QuerySnapshot data, EventSink<List<T>> sink) {
              final snaps = data.docs.map((doc) => doc.data()).toList();
              final users = snaps
                  .map((json) => fromJson(json as Map<String, dynamic>))
                  .toList();

              sink.add(users);
            },
          );

在iOS 14及以下版本上的调试模式问题

当在iOS 14或更低版本的设备上进行调试/运行时，当程序在IDE中终止时，应用程序停止工作。要解决此问题，请在您的flutter run命令中添加--release。

flutter run --release --no-sound-null-safety

致谢

特别感谢Johannes Mike提供的精彩YouTube教程和代码库。

Johannes的YouTube教程

GitHub

查看 Github