cfug / flutter.cn

Flutter CN docs translation plan, get started from the wiki: https://github.com/cfug/flutter.cn/wiki

Flutter documentation website

The documentation site for the Flutter framework, built with Eleventy and hosted on Firebase.

Issues, bugs, and requests

We welcome contributions and feedback on our website. Please file a request in our issue tracker or create a pull request. For simple changes (such as tweaking some text), it's easiest to make changes using the GitHub UI.

If you have an issue with the API docs on api.flutter.dev, please file those issues on the flutter/flutter repo, not on this (flutter/website) repo. The API docs are embedded in Flutter's source code, so the engineering team handles those.

Before you submit a PR

We love it when the community gets involved in improving our docs! But here are a few notes to keep in mind before you submit a PR:

• When triaging issues, we sometimes label an issue with the tag PRs welcome. But we welcome PRs on other issues as well— it doesn't have to be tagged with that label.
• Please don't run our docs through Grammarly (or similar) and submit those changes as a PR.
• We follow the Google Developer Documentation Style Guidelines — for example, don't use "i.e." or "e.g.", avoid writing in first person, and avoid writing in future tense. You can start with the style guide highlights or the word list, or use the search bar that's at the top of every style guide page.

We truly thank you for your willingness and helpfulness in keeping the website docs up to date!

Contributing

To update this site, fork the repo, make your changes, and generate a pull request. For small, contained changes (such as style and typo fixes), you probably don't need to build this site. Often you can make changes using the GitHub UI. If needed, we can stage the changes automatically in your pull request.

Important

If you are cloning this repository locally, follow the below instruction on cloning with its submodule.

If your change involves code samples, adds/removes pages, or affects navigation, do consider building and test your work before submitting.

If you want or need to build the site, follow the steps below.

Build the site

For changes beyond simple text and CSS tweaks, we recommend running the site locally to enable an edit-refresh cycle.

Get the prerequisites

Install the following tools to build and develop the site:

Flutter

The latest stable release of Flutter, which includes Dart, is required to build the site and run its tooling. If you don't have Flutter or need to update, follow the instructions at Install Flutter or Upgrading Flutter.

If you already have Flutter installed, verify it's on your path and already the latest stable version:

flutter --version

Node.js

The latest stable LTS release of Node.js is required to build the site. If you don't have Node.js or need to update, download your computer's corresponding version and follow the instructions from the Node.js download archive. If you prefer, you can use a version manager such as nvm, and run nvm install from the repository's root directory.

If you already have Node installed, verify it's available on your path and already the latest stable version (currently 20.12 or later):

node --version

If your version is out of date, follow the update instructions for how you originally installed it.

Clone this repo and its submodules

Note

This repository has git submodules, which affects how you clone it. The GitHub documentation has general help on forking and cloning repos.

If you're not a member of the Flutter organization, we recommend you create a fork of this repo under your own account, and then submit a PR from that fork.

Once you have a fork (or you're a Flutter org member), choose one of the following submodule-cloning techniques:

1. Clone the repo and its submodule at the same time using the --recurse-submodules option:

   git clone --recurse-submodules https://github.com/flutter/website.git

2. If you've already cloned the repo without its submodule, then run this command from the root of the repository:

   git submodule update --init --recursive

Note

At any time during development you can use the git submodule command to refresh submodules:

git pull && git submodule update --init --recursive

Set up your local environment and serve changes

Before you continue setting up the site infrastructure, verify the correct versions of Flutter and Node.js are set up and available by following the instructions in Get the prerequisites.

1. Optional: After cloning the repo and its submodules, create a branch for your changes:

   git checkout -b <BRANCH_NAME>

2. From the root directory of the repository, fetch the site's Dart dependencies.

   dart pub get

3. Install pnpm, an alternative, efficient package manager for npm packages. If you already have pnpm, verify you have the latest stable version.

   node --version

   If you do not already have pnpm installed, we recommend using corepack to install and manage pnpm versions, since corepack is bundled with most installations of Node. If you installed node using Homebrew, you'll need to install corepack separately:

   brew install corepack

   If you haven't used corepack before, you'll need to first enable it with corepack enable. Then, to install the correct pnpm version, from the root directory of the repository, run corepack install:

   corepack enable;
   corepack install

   To install pnpm without using corepack, you can use your preferred installation method.

4. Once you have pnpm installed and setup, fetch the site's npm dependencies using pnpm install. We highly recommend you use pnpm, but you can also use npm.

   pnpm install

   Rerun pnpm install whenever you incorporate the latest changes to the main branch or if you experience dependency or import errors when building the site.

5. From the root directory, run the dash_site tool to validate your setup and learn about the available commands.

   ./dash_site --help

6. From the root directory, serve the site locally.

   ./dash_site serve

   This command generates and serves the site on a local port that's printed to your terminal.

7. View your changes in the browser by navigating to http://localhost:4000.

   Note the port might be different if 4000 is taken.

   If you want to check the raw, generated HTML output and structure, view the _site directory in a file explorer or an IDE.

8. Make your changes to the local repo.

   The site should automatically rebuild on most changes, but if something doesn't update, exit the process and rerun the command. Improvements to this functionality are planned. Please open a new issue to track the issue if this occurs.

9. Commit your changes to the branch and submit your PR.

   If your change is large, or you'd like to test it, consider validating your changes.

Tip

To find additional commands that you can run, run ./dash_site --help from the repository's root directory.

Validate your changes

Check documentation and example code

If you've made changes to the code in the /examples or /tool directories, commit your work, then run the following command to verify it is up to date and matches the site standards.

./dash_site check-all

If this script reports any errors or warnings, then address those issues and rerun the command. If you have any issues, leave a comment on your issue or pull request, and we'll try our best to help you. You can also chat with us on the #hackers-devrel channel on the Flutter contributors Discord!

Refresh code excerpts

A build that fails with the error Error: Some code excerpts needed to be updated! means that one or more code excerpts in the markdown file aren't identical to the code in the corresponding .dart file.

To resolve this error, from the root of the website directory, run ./dash_site refresh-excerpts.

For more information see Code excerpts .

[Optional] Deploy to a staging site

Submitted pull requests can be automatically staged by a site maintainer. If you'd like to stage the site yourself though, you can build a full version and upload it to Firebase.

1. If you don't already have a Firebase project,

• Navigate to the Firebase Console and create your own Firebase project (for example, flutter-dev-staging).

• Head back to your local terminal and verify that you are logged in.

  firebase login

• Ensure that your project exists and activate that project:

  firebase projects:list
  firebase use <your-project>

2. From the root directory of the repository, build the site:

   ./dash_site build

   This will build the site and copy it to your local _site directory. If that directory previously existed, it will be replaced.

3. Deploy to your activated Firebase project's default hosting site:

   firebase deploy --only hosting

4. Navigate to your PR on GitHub and include the link of the staged version. Do consider adding a reference to the commit you staged, so that reviewers know if any further changes have been made.

flutter.cn's Issues

#31 - Display images from the internet - 显示网络上的远程图片

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/images/network-image.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/images/network-image.html

建议完成时间：1 - 3 天

[翻译] /docs/get-started/install/windows.html

希望完成该文档的翻译。
文章链接: https://github.com/cfug/flutter.cn/tree/master/src/docs/get-started/install/windows.md

[翻译] /docs/get-started/flutter-for/ios-devs.html

希望完成该文档的翻译。
文章链接: https://github.com/cfug/flutter.cn/tree/master/src/docs/get-started/flutter-for/ios-devs.md

#23 - Building a form with validation - 构建一个有验证判断的表单

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/forms/validation.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/forms/validation.html

建议完成时间：3 - 5 天

#27 - Retrieve the value of a text field - 获取文本框的输入值

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/forms/retrieve-input.md

英文文档预览：https://flutter.cn/docs/cookbook/forms/retrieve-input.html

建议完成时间：1 - 3 天

#37 - Creating lists with different types of items - 创建拥有不同列表项的列表

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/lists/mixed-list.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/lists/mixed-list.html

建议完成时间：3 - 5 天

[翻译] /docs/cookbook/animation/opacity-animation.html

申请翻译该文档：
https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/animation/opacity-animation.md
GitHub ID 是：@Vadaski

[翻译] /docs/get-started/flutter-for/android-devs.html

希望完成该文档的翻译。
文章链接: https://github.com/cfug/flutter.cn/tree/master/src/docs/get-started/flutter-for/android-devs.md

[翻译] /docs/cookbook/design/tabs.html

申请翻译该文档：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/design/tabs.md

GitHub ID 是：@Vadaski

#6 - Flutter for Android devs - 给 Android 开发者的 Flutter 指南

编号：6

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/get-started/flutter-for/android-devs.md

英文文档预览：https://debug.flutter.cn/docs/get-started/flutter-for/android-devs

建议完成时间：10 - 15 天

#21 - Using custom fonts - 使用自定义字体

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/design/fonts.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/design/fonts.html

建议完成时间：2 - 3 天

[翻译] 完成所有元数据的翻译

大家好，为了统一整个网站标题，提供更好、更一致的用户体验，我会统一翻译所有的元数据。

元数据这里指的是 .md 文档的最上方，如 title: 之类的内容。

谢谢！

#28 - Adding Material Touch Ripples - 添加点按涟漪效果 (Material Design)

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/gestures/ripples.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/gestures/ripples.html

建议完成时间：1 - 3 天

[翻译] /docs/resources/technical-overview.html

希望完成该文档的翻译。
文章链接: https://github.com/cfug/flutter.cn/tree/master/src/docs/resources/technical-overview.md

[翻译] /docs/cookbook/animation/animated-container.html

申请翻译该文档：
https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/animation/animated-container.md

GitHub ID 是：@Vadaski

#39 - Working with long lists - 长列表的处理

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/lists/long-lists.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/lists/long-lists.html

建议完成时间：1 - 3 天

#33 - Working with cached images - 使用缓存图片

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/images/cached-images.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/images/cached-images.html

建议完成时间：1 - 3 天

#40 - Report errors to a service - 把报错信息通过服务上传

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/maintenance/error-reporting.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/maintenance/error-reporting.html

建议完成时间：3 - 5 天

[翻译] /docs/deployment/flavors.html

希望完成该文档的翻译。
文章链接: https://github.com/cfug/flutter.cn/tree/master/src/docs/deployment/flavors.md

#45 - Return data from a screen - 从一个页面回传数据

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/navigation/returning-data.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/navigation/returning-data.html

建议完成时间：3 - 5 天

#43 - Navigate with named routes - 导航到对应名称的 routes 里

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/navigation/named-routes.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/navigation/named-routes.html

建议完成时间：3 - 5 天

[翻译] flutter.cn/src/docs/get-started/install/index.md

希望完成该文档的翻译，GitHub ID @chenglu
文档链接：https://github.com/cfug/flutter.cn/blob/cn/src/docs/get-started/install/index.md

#41 - Animating a Widget across screens - 跨页面切换的动效 Widget (Hero animations)

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/navigation/hero-animations.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/navigation/hero-animations.html

建议完成时间：3 - 5 天

#8 - Flutter for React Native devs - 给 React Native 开发者的 Flutter 指南

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/get-started/flutter-for/react-native-devs.md

英文文档预览：https://debug.flutter.cn/docs/get-started/flutter-for/react-native-devs

建议完成时间：10 - 15 天

#23 - Building a form with validation - 构建一个有验证判断的表单

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/forms/validation.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/forms/validation.html

建议完成时间：3 - 5 天

#17 - Displaying SnackBars - 显示 SnackBars

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/design/snackbars.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/design/snackbars.html

建议完成时间：1 - 3 天

#24 - Create and style a text field - 文本框的创建和设定

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/forms/text-input.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/forms/text-input.html

建议完成时间： 1 - 3 天

#10 - Flutter for Xamarin.Forms devs - 给 Xamarin.Forms 开发者的 Flutter 指南

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/get-started/flutter-for/xamarin-forms-devs.md

英文文档预览：https://debug.flutter.cn/docs/get-started/flutter-for/xamarin-forms-devs

建议完成时间：10 - 15 天

[翻译] /docs/cookbook/design/package-fonts.html

申请翻译该文档：
https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/design/package-fonts.md

GitHub ID 是：@Vadaski

#38 - Place a floating app bar above a list - 在列表顶部放置一个浮动的 app bar

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/lists/floating-app-bar.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/lists/floating-app-bar.html

建议完成时间：3 - 5 天

[翻译] /docs/reference/tutorials.md

申请翻译该文档：https://github.com/cfug/flutter.cn/blob/master/src/docs/reference/tutorials.md

GitHub ID 是：@MzoneCL

#36 - Creating a Grid List - 创建一个网格列表

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/lists/grid-lists.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/lists/grid-lists.html

建议完成时间：1 - 3 天

#19 - Updating the UI based on orientation - 根据屏幕方向更新界面

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/design/orientation.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/design/orientation.html

建议完成时间：1 - 3 天

#16 - Add a Drawer to a screen - 在屏幕上添加一个 Drawer

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/design/drawer.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/design/drawer.html

建议完成时间：1 - 3 天

[翻译] /docs/get-started/flutter-for/web-devs.html

认领该文档的翻译工作。

文章链接: https://github.com/cfug/flutter.cn/tree/master/src/docs/get-started/flutter-for/web-devs.md

#44 - Pass arguments to a named route - 给特定的 route 传参

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/navigation/navigate-with-arguments.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/navigation/navigate-with-arguments.html

建议完成时间：3 - 5 天

#34 - Basic List - 基础列表

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/lists/basic-list.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/lists/basic-list.html

建议完成时间：1 - 3 天

#29 - Handling Taps - 捕获和处理点击动作

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/gestures/handling-taps.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/gestures/handling-taps.html

建议完成时间：1 - 3 天

#32 - Fade in images with a placeholder - 占位符和网络图片淡入

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/images/fading-in-images.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/images/fading-in-images.html

建议完成时间：1 - 3 天

[翻译] flutter.cn/src/docs/cookbook/testing/unit/mocking.md

申请翻译该文档：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/testing/unit/mocking.md

GitHub ID 是：@LyndonChin

[翻译] /docs/development/packages-and-plugins/background-processes.html

希望完成该文档的翻译。
文章链接: https://github.com/cfug/flutter.cn/tree/master/src/docs/development/packages-and-plugins/background-processes.md

#42 - Navigate to a new screen and back - 导航到一个新页面和返回

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/navigation/navigation-basics.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/navigation/navigation-basics.html

建议完成时间：3 - 5 天

#25 - Focus on a Text Field - Text Field 上的焦点

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/forms/focus.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/forms/focus.html

建议完成时间：3 - 5 天

#26 - Handling changes to a text field - 响应文本框内容的更改

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/forms/text-field-changes.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/forms/text-field-changes.html

建议完成时间：3 - 5 天

[翻译] /docs/get-started/editor.html

希望完成该文档的翻译。
文章链接: https://github.com/cfug/flutter.cn/tree/master/src/docs/get-started/editor.md

#20 - Using Themes to share colors and font styles - 使用 Themes 统一颜色和字体风格

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/design/themes.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/design/themes.html

建议完成时间：2 - 3 天

#35 - Create a horizontal list - 创建一个水平滑动的列表

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/lists/horizontal-list.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/lists/horizontal-list.html

建议完成时间：1 - 3 天

#30 - Implement Swipe to Dismiss - 实现「滑动清除」效果

Markdown 文件路径：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/gestures/dismissible.md

英文文档预览：https://debug.flutter.cn/docs/cookbook/gestures/dismissible.html

建议完成时间：3 - 5 天

自我介绍 - Self Introductions

请在这个 Issue 下简要介绍自己的背景和关于 Flutter 的技术程度，再次谢谢你对 Flutter 文档的贡献！

[翻译] flutter.cn/src/docs/cookbook/testing/unit/introduction.md

申请翻译该文档：https://github.com/cfug/flutter.cn/blob/master/src/docs/cookbook/testing/unit/introduction.md

GitHub ID 是：@LyndonChin