شرح كيفية إضافة ظل حول العناصر في فلاتر | How to add a shadow around items in Flutter

Ahmed Mahmoud

اخر تحديث :

شرح كيفية إضافة ظل حول العناصر في فلاتر | how to add a shadow around items in Flutter

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

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

how to use PhysicalModel widget in flutter

ببساطة بعد وضع العنصر الذي تريدة باستخدام PhysicalModel تستطيع استخدام الامر shadowColor لكي تضع الظل حول العنصر واستخدام الخاصيه elevation لمدى تاثير الظل حولل العنصر وبهذا تكون قد قمت بعمل ظل حول العنصر المراد بكل سهوله

ui.dart

class CodeLess extends StatelessWidget {
  const CodeLess({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
            child: PhysicalModel(
                elevation: 20.0,
                shadowColor: Colors.greenAccent,
                color: Colors.redAccent,
              child: Container(
                height: 250,
                width: 250,
                color: Colors.green,
              ),
              ),
      ),
    );
  }
}