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

كيفية تنفيذ امر معين عند النقر مطول على صورة او اي عنصر في 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


تعليقات