شارك المقالة

كيفية تنفيذ امر معين عند النقر مطول على صورة او اي عنصر في Flutter


كيفية تنفيذ امر معين عند النقر مطول على صورة او اي عنصر في Flutter

يغفل كثير من المبرمجين عن widget مهم وموجود في flutter وهو CupertinoContextMenu حيث انه يقوم بتنفيذ وظيفة رائعه ويعطي مظهر جيد لتطبيقك , بكل بساطه يعمل على امكانية جعل العنصر الذي ينقر عليه المستخدم قابل للضغط المطول وتنفيذ امر معين بعد الضغطة المطوله عليه مثل الموجود في تطبيق انستقرام الشهير يمكنك النقر مطول على العنصر حتى يتم فتحه وتمويه باقي الصورة الموجوده ليصبح التركيز كامل على الصورة الرئيسيه هذا الwidget يقوم بتنفيذ العملية تقريبا ولكن مع اختلاف بسيط .


تم إنشاء تقنيات جديدة ، بما في ذلك Flutter ، لجعل حياتنا أسهل وأفضل. هذا واضح في الأعمال التجارية أيضًا ، لا سيما في قطاع تكنولوجيا المعلومات أو الشركات التي تطور تطبيقات الويب والجوال. يتضمن تطوير المنتجات الرقمية وصيانتها وإنشاءها تغييرات يومية وصعوبات جديدة. من أجل معالجتها ، يمكن أن يكون تطوير تطبيقات الهاتف المحمول flutter مفيدًا. العامل الرئيسي في ضمان الجودة والأداء العالي والقدرة على تطوير التطبيق بمرور الوقت هو التكنولوجيا التي تختار استخدامها لتصميم تطبيق هاتفك المحمول. مع المرونة الهائلة ، تضمن تقنية Flutter المتطورة الأمان والجودة في المستقبل. ركز على تحقيق أهدافك من خلال تطوير Flutter بدلاً من القلق بشأن الديون التقنية التي تمنع تطوير المنتجات ونمو الشركة!


How to use CupertinoContextMenu In Flutter

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


How to use CupertinoContextMenu In Flutter

ui.dart


            SizedBox(
              height: 120,
              width: 200,
              child: CupertinoContextMenu(
                child: ClipRRect(
                    borderRadius: BorderRadius.circular(20),
                    child: Image.network(
                      'https://images.unsplash.com/photo-1661961112951-f2bfd1f253ce?ixlib=rb-1.2.1&ixid=MnwxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1172&q=80',
                      fit: BoxFit.cover,)),
                  actions: [
                    CupertinoContextMenuAction(
                      child: const Text('Copy' , style: _labelStyle,),
                      onPressed: () {
                        Clipboard.setData(ClipboardData(text: text));
                      },
                    ),
                    CupertinoContextMenuAction(
                      child: const Text('close'),
                      onPressed: () {
                        Navigator.pop(context);
                      },
                    ),
                  ],
              ),
            ),
            


فيديو الشرح



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


شاهد أيضًا
مقالات ذات صلة
اكواد اندرويد ستوديو تقوم بعمل broadcast receiver لعرض نسبة شحن الهاتف | android studio code

  اكواد اندرويد ستوديو تقوم بعمل broadcast receiver لعرض نسبة شحن الهاتف | android studio…

مجموعة من اكواد البايثون التي تجعل منك شخص محترف في اللغة | A set of Python codes that make you a professional in the language

مجموعة من اكواد البايثون التي تجعل منك شخص محترف في اللغة موقع ومدونه جي كودرس…

شرح مكتبة numpy بلغة البايثون | Explanation of the numpy library in Python

شرح مكتبة numpy بلغة البايثون | Explanation of the numpy library in Python NumPy هي حزمة…

🚫 مانع الإعلانات مفعل

يجب إيقاف مانع الإعلانات لاستكمال تصفح الموقع