# Flutter 的 Cupertino 设计

> 了解 Flutter 的 Cupertino 设计。



The Flutter Cupertino library is a collection
of widgets that implement Apple's iOS design language
for Flutter apps. The widgets have a similar look
and feel to iOS, including rounded corners, gradients,
and minimalistic design.
They also include iOS interactions and animations.

Flutter Cupertino 库是一组为 Flutter 应用实现 Apple iOS 设计语言的 widget。
这些 widget 的外观和手感与 iOS 相似，包括圆角、渐变和极简设计。它们还包含 iOS 的交互和动画。

The following 15-minute video provides a high-level
glimpse of the Cupertino package:

以下 15 分钟视频概览了 Cupertino package：

<YouTubeEmbed id="3PdUaidHc-E" title="Flutter's Cupertino Package"></YouTubeEmbed>

To see some Cupertino widgets in action, the following videos from the
Widget of the Week series cover a few of them.

要观看部分 Cupertino widget 的实际效果，Widget of the Week 系列中的以下视频介绍了其中几个。

<div class="card-grid">
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="D0xwcz2IqAY" title="CupertinoRadio (Widget of the Week)"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="5H-WvH5O29I" title="CupertinoSheetRoute (Widget of the Week)"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="esnBf6V4C34" title="CupertinoSlidingSegmentedControl (Widget of the Week)"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="ua54JU7k1Us" title="CupertinoCheckbox (Widget of the Week)"></YouTubeEmbed>
    </div>
  </div>
  <div class="card wrapped-card outlined-card">
    <div class="card-content">
      <YouTubeEmbed id="24tg_N4sdMQ" title="CupertinoSwitch (Widget of the Week)"></YouTubeEmbed>
    </div>
  </div>
</div>

## More information {:.no_toc}

## 更多信息 {:.no_toc}

To learn more about using the Cupertino
package with Flutter,
check out the following resources:

要了解更多在 Flutter 中使用 Cupertino package 的信息，请查看以下资源：

* The (mostly visual) [Cupertino widget catalog][]
  on doc.flutter.dev

  doc.flutter.dev 上（以视觉为主）的 [Cupertino widget 目录][Cupertino widget catalog]

* The [Cupertino library][] page in the API docs

  API 文档中的 [Cupertino library][] 页面

* The [Cupertino API examples][] on the flutter/flutter
  repo. ([Instructions][]) For example,
  to run `CupertinoSwitch`:

  flutter/flutter 仓库中的 [Cupertino API 示例][Cupertino API examples]。
  （[说明][Instructions]）例如，要运行 `CupertinoSwitch`：

```console
cd path/to/flutter
cd examples/api
flutter run lib/cupertino/switch/cupertino_switch.0.dart
```

[Cupertino API examples]: https://github.com/flutter/flutter/tree/main/examples/api/lib/cupertino
[Cupertino library]: https://api.flutter-io.cn/flutter/cupertino/cupertino-library.html
[Cupertino widget catalog]: /ui/widgets/cupertino
[Instructions]: https://github.com/flutter/flutter/tree/main/examples/api#api-example-code