Flutter 共享首选项在本地保存 int 值

Flutter shared preferences saving int value locally

我正在构建一个页面,用户可以使用 provider 包 select 显示应用周围的首选个人资料图片。我使用 shared_preferences 在本地将个人资料图片首选项保存为 int 值。为此,我在 assets 文件夹中添加了 15 张 SVG 图片,用户可以 select 只使用其中一张。 SVG 图像重命名为 1.svg2.svg...15.svg,因此我可以使用该 int 值访问 SVG。

这是我创建的shared_preferencesclass

class ProfilePicPref {
  static const PRO_PIC_STS = 'PROFILESTATUS';

  setProfilePic(int svgNo) async {
    SharedPreferences profilePref = await SharedPreferences.getInstance();
    profilePref.setInt(PRO_PIC_STS, svgNo);
  }

  Future<int> getProfilePicture() async {
    SharedPreferences profilePref = await SharedPreferences.getInstance();
    return profilePref.getInt(PRO_PIC_STS) ?? 1;
  }
}

这是我创建的提供者class

class ProfilePicProvider with ChangeNotifier {
  ProfilePicPref profilePicPreferences = ProfilePicPref();
  int _svgNumber = 1;

  int get svgNumber => _svgNumber;

  set svgNumber(int value) {
    _svgNumber = value;
    profilePicPreferences.setProfilePic(value);
    notifyListeners();
  }

  void changePic(int val) {
    _svgNumber = val;
    profilePicPreferences.setProfilePic(val);
    notifyListeners();
  }
}

watch the full video

这是小部件树。当用户点击个人资料图像时,它会更新当前图像。但不保存该数据。 问题是,我必须手动保存代码,才能看到之前 selected 的个人资料图片。请哪位大侠帮我把当前账号图片数据保存到本地

class SelectProfilePicture extends StatefulWidget {
  const SelectProfilePicture({Key? key}) : super(key: key);

  @override
  State<SelectProfilePicture> createState() => _SelectProfilePictureState();
}

class _SelectProfilePictureState extends State<SelectProfilePicture> {

  int svgNumber = 1;

  ProfilePicProvider proProvider = ProfilePicProvider();
  @override
  void initState() {
    getCurrentProfilePicture();
    super.initState();
  }

  void getCurrentProfilePicture() async {
    proProvider.svgNumber =
        await proProvider.profilePicPreferences.getProfilePicture();
  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      body: Column(
        children: [
          CurrentAccountPicture(path: 'assets/svg/${proProvider.svgNumber}.svg'),  // I want update this widget using users preferences. By default it is set to 1.svg
          Center(
            child: Text(
              'Current Account Picture',
              style: style(),
            ),
          ),
          Expanded(
            child: GridView.builder(
              itemCount: 15,
              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 3,
              ),
              itemBuilder: (context, index) {
                return GestureDetector(
                  onTap: () {
                    setState(() {
                      svgNumber = index + 1;
                    });
                    proProvider.changePic(index + 1);
                  },
                  child: SvgPicture.asset('assets/svg/${index + 1}.svg'),
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}

我认为您的 svgNumber 保存得很好。只是从存储中读取后不知道刷新页面。

因为你使用 ChangeNotifier 你可以编写代码来收听它。

或者,我认为将读数放在 setState 中也应该可以解决。所以喜欢:

  void getCurrentProfilePicture() async {
   
      proProvider.svgNumber =
        await proProvider.profilePicPreferences.getProfilePicture();

      setState(() {});
  
  }