شرح كيفية تخزين model كامل في SharedPrefrance داخل Flutter

شرح كيفية تخزين model كامل في SharedPrefrance داخل Flutter

في هذا المقال المميز سوف نشرح لكم كيف تقوم بتخزين model كامل مخصص في SharedPrefrance , كما نعلم ان خاصية SharedPrefrance نقوم فقط بتخزين ارقام وحروف وكلمات ولكن هل يمكن تخزين بيانات مختلفة مثل صور او حتى model في داخلها ؟ الاجابة هيا نعم وسوف نقوم في هذه المقالة بشرح لكم كيف تتم هذه العملية وكيف تقوم بتخزينها بطريقة سهله جدا وهذا الامر مفيد جدا وسوف يحسن من مستواك البرمجي والان دعونا لا نطيل عليكم في المقدمه وننتقل الى الشرح حتى نتمكن من تنفيذها بكل سهوله .

Flutter عبارة عن حزمة SDK أمامية لأنها تجمع بين عناصر واجهة المستخدم ومنطق الأعمال. على الرغم من أن العديد من الأشخاص يدعون أن Dart يُستخدم للواجهة الخلفية ، إلا أن الحقيقة هي أن Flutter هي واجهة أمامية بالكامل وأن Dart تستخدم فقط لمنطق الواجهة الأمامية. لكن تطوير التطبيقات الأصلية لنظامي التشغيل iOS و Android هو "ببساطة" الواجهة الأمامية.

Dart و Java و C / C ++ ولغات البرمجة الأخرى ليست سوى عدد قليل من تلك التي يمكن استخدامها لإنشاء تطبيقات الواجهة الأمامية والخلفية باستخدام Flutter ، وهو SDK عبر الأنظمة الأساسية.

من ناحية أخرى ، Flutter ليست لغة برمجة. إنها مجموعة تطوير برمجيات (SDK) تتضمن كودًا مكتوبًا مسبقًا ، وعناصر واجهة مستخدم جاهزة للاستخدام يمكن تخصيصها ، بالإضافة إلى مكتبات وأدوات ووثائق يمكن استخدامها جميعًا لإنشاء تطبيقات عبر الأنظمة الأساسية. 26 مارس 2021

android sdk manager تحميل flutter developers applications create app android android studio mac

SharedPrefrance class

في هذا ال class سوف يكون مسؤول عن SharedPrefrance يمكنك نسخه ولصقه لديك في مشروعك بدون مشاكل .

SharedPrefrance.dart

class CacheHelper {
  static late SharedPreferences sharedPreferences;

  static init() async {
    sharedPreferences = await SharedPreferences.getInstance();
  }

  static dynamic getData({
    required String key
  }) {
    return sharedPreferences.get(key);
  }

  static Future<bool> saveData({
    required String key,
    required dynamic value,
  }) async {

    if(value is String) return await sharedPreferences.setString(key, value);
    if(value is int) return await sharedPreferences.setInt(key, value);
    if(value is bool) return await sharedPreferences.setBool(key, value);

    return await sharedPreferences.setDouble(key, value);
  }

  static Future<bool> removeData({required String key}) async
  {
    return await sharedPreferences.remove(key);
  }

}

How to save data to shared Preference

الان في هذه العملية وهيا تخزين المتغيرات عن طريق نقرة زر من داخل التصميم كما هو موضح لحفظ واسترجاع البيانات .

shared.dart

class SecPage extends StatelessWidget {
  const SecPage({Key? key}) : super(key: key);
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [

            MaterialButton(onPressed: () async {

              final String encodedData = User.encode([
                User(name: 'Tom', age: '15'),
                User(name: 'bill', age: '18'),
                User(name: 'maher', age: '22'),
              ]);

              CacheHelper.saveData(key: 'musics_key', value: encodedData);

            }, child: const Text('save data')),

            MaterialButton(onPressed: () async {

              final String getData = CacheHelper.getData(key: 'musics_key');
              final List<User> users = User.decode(getData);

              print(users[2].name);
              print(users[2].age);

            }, child: const Text('get data'))

          ],
        ),
      ),
    );
  }
}

decode and encode model data

في هذه المرحلة سوف نقوم بعمل decode و encode للبيانات الخاصه بالمستخدم في ال model حتى نتمكن من تخزين وفك تخزين البيانات اثناء حفظها في الخطوة السابقه .

model.dart

class User {
  final String name;
  final String age;

  User({required this.name, required this.age});

  factory User.fromJson(Map<String, dynamic> parsedJson) {
    return User(
        name: parsedJson['name'] ?? "",
        age: parsedJson['age'] ?? "");
  }

  Map<String, dynamic> toJson() {
    return {
      "name": this.name,
      "age": this.age
    };
  }

  static Map<String, dynamic> toMap(User music) => {
    'name': music.name,
    'age': music.age,
  };


  static String encode(List<User> musics) => json.encode(
    musics
        .map<Map<String, dynamic>>((music) => User.toMap(music))
        .toList(),
  );

  static List<User> decode(String musics) =>
      (json.decode(musics) as List<dynamic>)
          .map<User>((item) => User.fromJson(item))
          .toList();

}