自动应用翻译

Pub

一个通过语言截图,然后按语言创建和分发商店图片的库。

"Buy Me A Coffee"

如何使用?

0. 准备

应用此库必须设置以下库

1. 创建 Android / iOS 模拟器

它应该适合商店的尺寸。请参考 此链接

android

  1. 打开 Android Studio
  2. 工具 – 设备管理器 – 创建设备 – 新硬件配置文件
    1. 三星 Galaxy S10
      1. 设备名称: 三星 Galaxy S10
      2. 屏幕 – 分辨率: 1440 x 3040
      3. 点击“下一步”直到“验证配置”步骤
      4. 点击“显示高级设置”
      5. 模拟性能 – 启动选项: 冷启动
      6. 内存和存储 – 内部存储: 超过2000MB
    2. nexus_9
      1. 设备名称: nexus_9
      2. 屏幕 – 分辨率: 1536 x 2048
      3. 点击“下一步”直到“验证配置”步骤
      4. 点击“显示高级设置”
      5. 模拟性能 – 启动选项: 冷启动
      6. 内存和存储 – 内部存储: 超过2000MB

ios

  1. 打开 Xcode
    1. 菜单栏中的窗口
    2. 点击“设备和模拟器”
    3. 点击左上角的“模拟器”
    4. 点击左下角的“+”
    5. add
      1. iPhone 8
      2. iPhone 8 Plus
      3. iPad Pro (12.9 英寸) (第二代)
      4. iPhone 13 Pro Max

2. 设置 gitignore。

  • 由于有数百张图片,您需要将这些图片从 git 中排除。

/auto_translation/screenshots/
/auto_translation/framed/
/auto_translation/metadata/

3. 在应用程序中设置截图场景

  • 在截图之前,您需要设置要截图的屏幕。

1. 下载 text_drive.zip 文件,并将其放在项目根目录。

![](https://user-images.githubusercontent.com/21379657/205572412-098ff34d-498c-4d1c-ae2b-ba2f9e37dbe1.png)

  • 请设置要截图的部分,并插入截图代码。详情请参考 官方文档

2. 在项目根目录中创建“auto_translate”目录。

3. 下载 frameit-chrome.zip 文件夹,并将其放在“auto_translate”目录中。

4. 在“auto_translate”目录中创建“make_screenshot.dart”文件并写入以下代码。

import 'dart:io';

import 'package:emulators/emulators.dart';
import 'package:auto_screenshot_translate/callable/core_my/my_language_code/entity/flutter_support_language_for_screenshot.dart';

Future<void> main() async {
   // Create the config instance
   final emu = await Emulators.build();

   // Shutdown all the running emulators
   await emu.shutdownAll();

   // For each emulator in the list, we run `flutter drive`.
   await emu.forEach([
      'nexus_9',
      'Samsung_Galaxy_S10',
      'iPhone 8 Plus',
      'iPhone 8',
      'iPad Pro (12.9-inch) (5th generation)',
      'iPhone 13 Pro Max',
   ])((device) async {
      for (final c in flutterLocalizeSupportLanguagesForScreenShot) {
         final p = await emu.drive(
            device,
            'test_driver/main.dart',
            config: c,
         );
         stderr.addStream(p.stderr);
         await stdout.addStream(p.stdout);
      }
   });
}

5. 在项目根目录打开终端,输入以下命令以创建截图。

dart auto_translation/make_screenshots.dart 

6. 您可以在“auto_translation/screenshots”目录中看到截图。

7. 删除 Galaxy 截图文件名中的下划线。

  • 在“auto_translate”目录中创建名为“frame_galaxy_remove_under_bar.dart”的 dart 文件并写入以下代码。

import 'package:auto_screenshot_translate/auto_screenshot_translate.dart';

Future<void> main() async {
  AutoScreenshotTranslate.removeUnderBarInGalaxy();
}
  • 在终端运行此文件。
dart auto_translation/frame_galaxy_remove_under_bar.dart 

8. 准备用于生成商店图片的截图标题。

  • 在“auto_translate”目录中创建名为“frame_prepare.dart”的 dart 文件并写入以下代码。

import 'package:auto_screenshot_translate/auto_screenshot_translate.dart';
import 'package:auto_screenshot_translate/callable/core_my/my_screenshot_helper/entity/my_screenshot_info.dart';

Future<void> main() async {
  MyScreenshotInfo myScreenshotInfo = MyScreenshotInfo(
    // not use
    screenshotTitle01: "",
    screenshotTitle02: "",
    screenshotTitle03: "",
    screenshotTitle04: "",
    screenshotTitle05: "",

    // using (screenshot top text)
    screenshotSubTitle01: "",
    screenshotSubTitle02: "",
    screenshotSubTitle03: "",
    screenshotSubTitle04: "",
    screenshotSubTitle05: "",

    // screenshot start language for translate
    screenshotStartLanguageCode: "en",
  );

  AutoScreenshotTranslate.prepareGenerateScreenshotFrame(myScreenshotInfo);
}
  • 填写 screenshotSubTitle0~ 为您想要使用的说明,并在项目根终端运行以下代码。
dart auto_translation/frame_prepare.dart
  • 翻译后,您可以在 auto_translation/screenshots 目录中看到“keyword.strings”文件。

9. 在项目根终端输入以下命令以生成商店图片。

dart auto_translation/frameit-chrome/bin/frameit_chrome.dart 

10. 您可以看到商店图片已在“auto_translation/framed”目录中生成,如下所示。

11. 将生成的文件移动到 fastlane 可以理解的文件结构中。

  • 在“auto_translate”目录中创建名为“framed_distribute.dart”的 dart 文件并写入以下代码。

import 'package:auto_screenshot_translate/auto_screenshot_translate.dart';

Future<void> main() async {
  AutoScreenshotTranslate.distributeScreenshotFrameFile();
}
  • 在终端运行此文件。
dart auto_translation/framed_distribute.dart 
  • 您可以看到已创建为 fastlane 可以理解的结构的文件。

12. 部署到 Play 商店和 App Store。

– Play 商店

1. 设置 fastlane 配置文件 (android)

请参考 官方文档auto_store_translate 库。

2. 在 android/fastlane/fastfile 文件中的 platform:android do 下添加以下代码。

    lane :metaWithScreenshot do
      upload_to_play_store(
          track: 'internal',
          metadata_path: '../auto_translation/metadata/android',
          skip_upload_changelogs: true,
          release_status: 'draft',
          aab: '../build/app/outputs/bundle/release/app-release.aab',
      )
    end

3. 在 Android 项目位置打开终端并输入以下命令。

fastlane metaWithScreenshot

4. 您将在 Play 商店控制台中看到翻译后的信息。

– App Store

1. 设置 fastlane 配置文件 (ios)

请参考 官方文档

2. 在 ios/fastlane/fastfile 文件中的 platform:ios do 下添加以下代码。

   lane :onlyScreenShotOverWrite do
      get_certificates           # invokes cert
      get_provisioning_profile   # invokes sigh
      deliver(
          skip_metadata: true,
          screenshots_path: '../metadata/[프로젝트명]/ios/screenshots',
          overwrite_screenshots: true,
          force: true, # Skip HTMl report verification
          # skip_screenshots: true,
          skip_binary_upload: true,
      )
   end

3. 在 iOS 项目位置打开终端并输入以下命令。

fastlane onlyScreenShotOverWrite

4. 您将在 App Store Connect 中看到翻译后的信息。

GitHub

查看 Github