إنشاء snackbar بشكل مختلف يحسن من مظهر تطبيقك في فلاتر
استخدام snackbar التقليدي في تطبيقك اصبح شيئ عادي ولا يميز تطبيقك عن باقي التطبيقات وعليك دائما بان تستمر في تطوير نفسك وتحسين الاسلوب الذي تتبعه في تصميم التطبيقات ويمكنك الاستعانه بموقعنا في مساعدتكم في انجاز الاعمال بشكل اسرع وفي هذا المقال نرجع لكم بتصميم جديد للsnackbar يمكنك الاعتماد عليه في تطبيقك بكل سهوله وذلك لانه بسيط وسهل الاستخدام ويمكنك استخدامه في اي مشروع تعمل عليه ويحسن من شكل التطبيق بصورة كبيرة والشكل الذي يظهر هو نفس الشكل الموجود في الصورة الخاصه بالمقالة , وقد قدمنا لكم الكثير من الدروس في هذا الموضوع .
مع تزايد شعبية تطوير البرامج عبر الأنظمة الأساسية. في السوق ، تم تقديم وإصدار العديد من الاطارات الجديدة. مثل React Native وكان احد الاطارات لتطوير التطبيقات عبر الأنظمة الأساسية لانظمة الاندرويد وios بكود واحد. ومع ذلك فقد شعبيته قليلا بعد ظهور فلاتر .
لقد تغير عالم تطوير الأنظمة الأساسية بشكل كبير منذ أن أعلنت Google عن Flutter في عام 2017. ومنذ ذلك الحين ، استمرت Google في تحسين نسختها وتحديثها ، مضيفة ميزات جديدة. تتزايد شعبية Flutter Development بين المطورين نتيجة الإصدارات الأخيرة. لذلك ، وصلنا إلى Google. Flutter 3 ، أحدث تحفة Google ، هو أحدث إصدار من Flutter مع التحديث الرئيسي لدعم ستة منصات بقاعدة واحدة.
add package awesome_snackbar_content
dependencies:
awesome_snackbar_content: ^0.0.5
How to show snackbar with new style
بكل بساطة يمكنك استخدام التطبيق الذي ترغب به عند النقر على الزر استخدام المكتبة التي قمت بتثبيتها بالاعلى وهيا سوف تخرج لك النتائج كما هو موضح يمكنك الاستعانه بالكود التالي لتجربة الشكل وتغيير الايقونة واللون وحتى يمكنك التعديل على المكتبة لكي تناسب التطبيق الذي تعمل عليه بكل سهوله بدون اي تعقيد تماما .
snackbar.ui
Center(
child: ElevatedButton(
child: const Text('show Test'),
onPressed: () {
var snackBar = SnackBar(
elevation: 0,
behavior: SnackBarBehavior.floating,
backgroundColor: Colors.transparent,
content: AwesomeSnackbarContent(
title: 'On Snap!',
message:
'This is an example error message that will be shown in the body of snackbar!',
contentType: ContentType.warning,
),
);
ScaffoldMessenger.of(context).showSnackBar(snackBar);
},
),
)مزيد من المقالات
