# @freakycoder/react-native-progressive-fast-image 中文文档

规范地址：https://npmcn.com/package/%40freakycoder/react-native-progressive-fast-image/

版本：1\.0\.0
npm 元数据更新时间：2023-04-05T11:30:56.418Z
中文译文更新时间：2026-11-15T13:09:49.758Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40freakycoder/react-native-progressive-fast-image
原文对照：https://npmcn.com/package/%40freakycoder/react-native-progressive-fast-image/?lang=original
项目主页：https://www.freakycoder.com/
源码仓库：https://github.com/WrathChaos/react-native-progressive-fast-image

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：71.9 kB，29 个文件
- 模块格式：CommonJS
- TypeScript 类型：包内自带
- 运行依赖：1 个
- 首次发布：2020-08-25T08:55:44.518Z
- 最新版本发布：2023-04-05T11:30:56.273Z
- 近 30 天下载量：4741（2026-10-16 至 2026-11-14，npm 官方下载统计）
- 已发布版本数：8（近 12 个月 0 个）

## 中文简介

用快取图像自定义的渐进图像

## 安装

```sh
npm install @freakycoder/react-native-progressive-fast-image
```

也可以使用：`pnpm add @freakycoder/react-native-progressive-fast-image`、`yarn add @freakycoder/react-native-progressive-fast-image`、`bun add @freakycoder/react-native-progressive-fast-image`

## README

![React Native Progressive Fast Image](https://npmcn.com/package/%40freakycoder/react-native-progressive-fast-image/assets/logo.png)

[![Battle Tested ✅](https://img.shields.io/badge/-Battle--Tested%20%E2%9C%85-03666e?style=for-the-badge)](https://github.com/WrathChaos/react-native-progressive-fast-image)

[![Customizable progressive image for React Native with FastImage](https://img.shields.io/badge/-Customizable%20progressive%20image%20for%20React%20Native%20with%20FastImage-orange?style=for-the-badge)](https://github.com/WrathChaos/@freakycoder/react-native-progressive-fast-image)

[![npm version](https://img.shields.io/npm/v/@freakycoder/react-native-progressive-fast-image.svg?style=for-the-badge)](https://www.npmjs.com/package/@freakycoder/react-native-progressive-fast-image) [![npm](https://img.shields.io/npm/dt/@freakycoder/react-native-progressive-fast-image.svg?style=for-the-badge)](https://www.npmjs.com/package/@freakycoder/react-native-progressive-fast-image) ![Platform - Android and iOS](https://img.shields.io/badge/platform-Android%20%7C%20iOS-blue.svg?style=for-the-badge) [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=for-the-badge)](https://opensource.org/licenses/MIT) [![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=for-the-badge)](https://github.com/prettier/prettier)

<table><tbody><tr><td><b>渐进快图像</b></td><td><b>内置加载渐进快图像</b></td></tr><tr><td align="center"><img alt="React Native Progressive Fast Image" src="https://npmcn.com/package/%40freakycoder/react-native-progressive-fast-image/assets/Screenshots/React-Native-Progressive-Fast-Image.gif" loading="lazy" decoding="async" referrerpolicy="no-referrer"></td><td align="center"><img alt="React Native Progressive Fast Image" src="https://npmcn.com/package/%40freakycoder/react-native-progressive-fast-image/assets/Screenshots/React-Native-Progressive-Fast-Image-Loading.gif" loading="lazy" decoding="async" referrerpolicy="no-referrer"></td></tr></tbody></table>

# 安装

添加依赖 :

```bash
npm i @freakycoder/react-native-progressive-fast-image
```

## 同伴依赖关系

##### _重要的东西! 你需要安装它们_

```js
"react-native-fast-image": ">= 8.3.2"
```

# 使用量

## 导入

```jsx
import ProgressiveFastImage from "@freakycoder/react-native-progressive-fast-image";
```

## 基本用途

它接受每一个 `Image` 财务报告和审定财务报表 `FastImage` 道具来. 你可以像以前一样使用它.

```jsx
<ProgressiveFastImage
  source={require("./assets/my-image.png")}
  thumbnailSource={require("./assets/my-image.png")}
/>
```

# 配置 - 道具

| 财产 | 类型 | 默认 | 说明 |
| --- | :-: | :-: | --- |
| 来源 | 来源 | 未定义 | 设置图像的主要来源 |
| 缩略图来源 | 图像来源配置Type | 未定义 | 设置图像的缩略图源 |
| 装入来源 | 图像来源配置Type | 未定义 | 设置图像的错误源 |
| 错误来源 | 图像来源配置Type | 未定义 | 设置图像的装入源 |
| 装入图像组件 | 构成部分 | 默认 | 警告:读以下! |
| 模糊的拉迪乌斯 | 编号 | 15个 | 更改模糊半径级别 |

### `loadingImageComponent` 使用量

如果您要为装入图像设置自己的组件, 请设置此选项 **样式** 用于组件顶部

```tsc
{
  top: 0,
  left: 0,
  right: 0,
  bottom: 0,
  position: "absolute",
  alignItems: "center",
  alignSelf: "center",
  justifyContent: "center",
}
```

## 自定义道具

| 财产 | 类型 | 默认 | 说明 |
| --- | :-: | :-: | --- |
| 样式 | 样式 | 默认 | 更改或覆盖主图像样式 |
| 装入图像容器Style | 样式 | 默认 | 更改或覆盖装入图像容器样式 |
| 装入 图像样式 | 样式 | 默认 | 更改或覆盖装入图像样式 |
| 缩略图 图像样式 | 样式 | 默认 | 更改或覆盖缩略图图像样式 |
| 缩略图动画定义 | 编号 | 默认 | 更改缩略图动画的持续时间 |
| 图像动画定义 | 编号 | 默认 | 更改主要图像动画的持续时间 |
| 登录 | 函数 | 默认 | 唤起路德 |
| 通布尼尔路 | 函数 | 默认 | 呼唤ThumbnailLoad |
| 关闭时 | 函数 | 默认 | 调用 LAD End |
| 错误 | 函数 | 默认 | 唤作哀号 |

## 未来计划

-   [x] ~自由主义~
-   [x] ~内置加载指标~
-   [x] ~内建错误图像源~
-   [ ] 写一篇关于介质上的 lib 的文章

## 内置错误修复更好

**修补** 快速图像 `source null` 错误修复 .

-   [https://github.com/DylanVann/反应-内设-快-形象/issues/623](https://github.com/DylanVann/react-native-fast-image/issues/623)
-   [https://github.com/Dylanvan/resact-native-fast-image/issues/27 (英语)](https://github.com/DylanVann/react-native-fast-image/issues/27)
-   [https://github.com/DylanVann/反应-native-fast-image/issues/484 (英语)](https://github.com/DylanVann/react-native-fast-image/issues/484)
-   [https://github.com/DylanVann/resact-native-fast-image/issues/96 (英语)](https://github.com/DylanVann/react-native-fast-image/issues/96)

## 作者

怪人编剧, [库拉约贡@gmail.com](mailto:kurayogun@gmail.com)

## 许可证

根据麻省理工学院的许可,可以提供“土著进步快成像”。 更多信息见LICENSE文件.

## 常见问题

### @freakycoder/react-native-progressive-fast-image 是什么？

用快取图像自定义的渐进图像

### 如何安装 @freakycoder/react-native-progressive-fast-image？

在项目目录运行 npm install @freakycoder/react-native-progressive-fast-image，或使用 pnpm add / yarn add / bun add。

### @freakycoder/react-native-progressive-fast-image 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @freakycoder/react-native-progressive-fast-image 支持 ESM 还是 CommonJS？

以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。

### @freakycoder/react-native-progressive-fast-image 可以商用吗？

@freakycoder/react-native-progressive-fast-image 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @freakycoder/react-native-progressive-fast-image 的下载量有多少？

根据 npm 官方下载统计，@freakycoder/react-native-progressive-fast-image 在 2026/10/16 – 2026/11/14 这 30 天内被下载 4,741 次，日均约 158 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @freakycoder/react-native-progressive-fast-image 还在维护吗？

最新版本 1\.0\.0 发布于 2023/04/05（3 年前）；至今共发布 8 个版本，其中过去 12 个月发布了 0 个；首次发布于 2020/08/25。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。