Flutter & Shared Preference:如何将网络图像保存到本地内存?

Flutter & Shared Preference : How do I save a network image to local memory?

想使用 shared_preference 包将网络图像保存到我的本地内存中。

让我们使用下图:

Link : https://user-images.githubusercontent.com/54469196/100627883-ef57f100-336a-11eb-9dac-fa3b910b8302.png

如何使用 shared_preference 做到这一点?

期待您的来信。谢谢。

对于以下方法,您的图像可能太大,因此我使用了来自 https://picsum.photos/200 的较小占位符图像,returns 每次调用时都是随机图像。查看以下代码,首先检查图像是否保存在共享首选项中,如果没有,代码将下载图像,将图像转换为 base64 字符串并将图像 base64 字符串保存到共享首选项中。

import 'dart:async';
import 'dart:convert';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:shared_preferences/shared_preferences.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark(),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  State createState() => MyHomePageState();
}

class MyHomePageState extends State<MyHomePage> {
  String _base64;
  Future getImage;

  Future<String> _getImage() async {
    String base64;
    final SharedPreferences prefs = await SharedPreferences.getInstance();
    base64 = prefs.getString("base64Image");
    if (base64 == null) {
      final http.Response response = await http.get(
        'https://picsum.photos/200',
      );
      base64 = base64Encode(response.bodyBytes);
      prefs.setString("base64Image", base64);
    }
    return base64;
  }

  @override
  void initState() {
    super.initState();
    getImage = _getImage();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Example App')),
      body: FutureBuilder<String>(
        future: getImage,
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            _base64 = snapshot.data;
            final Uint8List bytes = base64Decode(_base64);
            return ListTile(
              leading: Image.memory(bytes),
              title: Text(_base64),
            );
          }
          return const Center(child: CircularProgressIndicator());
        },
      ),
    );
  }
}