Flutter图片缓存插件cached_s5_image的使用

cached_s5_image

一个用于S5 CID的简单缓存图像提供器。

使用

查看示例。

这是一个基于s5库构建的库。更多详细信息请参阅s5。

基本用法：

Widget cachedS5Image = CachedS5Image(
  cid: cid, // 字符串
  s5: s5, // 参见 https://pub.dev/packages/s5
  thumbhash: thumbhashText, // thumbhash的字符串表示
);

感谢

这项工作得到了Sia基金会的支持。

完整示例代码

import 'package:cached_s5_image/cached_s5_image.dart';
import 'package:cached_s5_image_example/src/s5.dart';
import 'package:cached_s5_manager/cached_s5_manager.dart';
import 'package:flutter/material.dart';
import 'package:logger/logger.dart';
import 'package:s5/s5.dart';

void main() {
  runApp(const CachedS5ImageDemo());
}

class CachedS5ImageDemo extends StatelessWidget {
  const CachedS5ImageDemo({super.key});

  // 这是你的应用的根组件。
  [@override](/user/override)
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: '缓存S5图像演示',
      home: Demo(),
    );
  }
}

class Demo extends StatefulWidget {
  const Demo({super.key});
  [@override](/user/override)
  State<Demo> createState() => _DemoState();
}

class _DemoState extends State<Demo> {
  String? cid;
  final TextEditingController _cidController = TextEditingController(
      text: "z2H7AJ1Pt8FdqG5UNzt4ffEhMY28c2z3K13TGf9fGcCRRwN7kS5B");
  final TextEditingController _thumhashController =
      TextEditingController(text: "mtcJLYbGWGaPeYiLl4dndYaAdgdY");
  S5? s5;
  Logger logger = Logger();
  CachedS5Manager? cacheManager;

  [@override](/user/override)
  void initState() {
    _initS5();

    super.initState();
  }

  Future<void> _initCache() async {
    await cacheManager?.init();
  }

  void _initS5() async {
    // 这是一个示例S5节点，建议使用自己的节点以获得最佳性能
    s5 = await initS5("https://s5.jptr.tech", "hive", null);
    cacheManager = CachedS5Manager(s5: s5!);
    await _initCache();
    setState(() {}); // 更新UI
  }

  void _submitCID() async {
    if (s5 != null) {
      setState(() {
        cid = _cidController.text;
      });
    }
  }

  void _clearCache() async {
    cacheManager?.clear();
  }

  void _clearImage() async {
    setState(() {
      cid = null;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        children: [
          Row(
            children: [
              const Text("S5状态:"),
              (s5 == null)
                  ? const CircularProgressIndicator()
                  : const Icon(Icons.check),
            ],
          ),
          TextField(
            controller: _cidController,
            decoration: const InputDecoration(labelText: "CID: z2..."),
          ),
          const SizedBox(
            height: 10,
          ),
          TextField(
            controller: _thumhashController,
            decoration: const InputDecoration(labelText: "Thumbhash: "),
          ),
          const SizedBox(
            height: 10,
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              ElevatedButton(
                  onPressed: _submitCID, child: const Text("提交CID")),
              ElevatedButton(
                  onPressed: _clearCache, child: const Text("清除缓存")),
              ElevatedButton(
                  onPressed: _clearImage,
                  child: const Text("清除加载的图像"))
            ],
          ),
          const SizedBox(
            height: 10,
          ),
          AnimatedSwitcher(
            duration: const Duration(milliseconds: 300),
            child: (cid != null && s5 != null)
                ? CachedS5Image(
                    cid: cid!,
                    s5: s5!,
                    thumbhash: _thumhashController.text,
                    cacheManager: cacheManager,
                  )
                : Container(),
          ),
        ],
      ),
    );
  }
}