عبد الواحد الحدادي نشر 11 سبتمبر 2020 أرسل تقرير مشاركة نشر 11 سبتمبر 2020 السلام عليكم ورحمة الله وبركاته، أتمنى أن يكون الجميع بصحة جيدة ... أريد أن أسأل أيّ المكتبات توفر هذا السلايد الذي يكون على الأجهزة اللوحية والصغيرة ( انظر الفيديو المرفق من فضلك ) .. المثال من موقع eBay . تحياتي لكم وبالتوفيق للجميع . Record_2020-09-11-22-19-52.mp4 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 عبد الواحد الحدادي نشر 11 سبتمبر 2020 الكاتب أرسل تقرير مشاركة نشر 11 سبتمبر 2020 بتاريخ 38 دقائق مضت قال Motaz Khogali: وعليكم السلام موجودة علي flutter باستخدام هذل الكود كمثال class _HomePageState extends State<HomePage> { int _index = 0; @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(), body: Center( child: SizedBox( height: 200, // card height child: PageView.builder( itemCount: 10, controller: PageController(viewportFraction: 0.7), onPageChanged: (int index) => setState(() => _index = index), itemBuilder: (_, i) { return Transform.scale( scale: i == _index ? 1 : 0.9, child: Card( elevation: 6, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)), child: Center( child: Text( "Card ${i + 1}", style: TextStyle(fontSize: 32), ), ), ), ); }, ), ), ), ); } } أهلاً بك أستاذي؛ هل يمكنك إرشادي إلى دليل أو فيديو يوضح لي كيف أستخدم flutter في هذه المرحلة ؟ وشكرا لك مسبقاً . اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 ماجد قطوسة نشر 11 سبتمبر 2020 أرسل تقرير مشاركة نشر 11 سبتمبر 2020 بتاريخ منذ ساعة مضت قال عبد الواحد الحدادي: السلام عليكم ورحمة الله وبركاته، أتمنى أن يكون الجميع بصحة جيدة ... أريد أن أسأل أيّ المكتبات توفر هذا السلايد الذي يكون على الأجهزة اللوحية والصغيرة ( انظر الفيديو المرفق من فضلك ) .. المثال من موقع eBay . تحياتي لكم وبالتوفيق للجميع . Record_2020-09-11-22-19-52.mp4 أهلاً بك هذا يسمى Carousel في الويب . يوجد له استخدام في الbootstrap و يمكن عمله ال css و ال html و ال js اقدم لك هذا المثال الشبيه لما هو في الفديو الخاص بك . يمكنك التعديل على الملف . بما يناسب حاجتك . مرفق ملف فيه كود html css js شكراً لك index.html بتاريخ 17 دقائق مضت قال عبد الواحد الحدادي: أهلاً بك أستاذي؛ هل يمكنك إرشادي إلى دليل أو فيديو يوضح لي كيف أستخدم flutter في هذه المرحلة ؟ وشكرا لك مسبقاً . flutter هو إطار عمل يعتمد على لغة ال dart البرمجية و هو مخصص لتطوير تطبيقات الأندرويد و ال ios و حتى الآن فهو غير مدعوم لتطوير الويب لذلك لا يمكنك إستخدامه في الموقع الخاص بكـ و لا ينصح باستخدام الflutter لتطوير تطبيقات الويب بسبب انها غير مدعومة . عدى عن هذا فأنت تحتاج الى تعلم لغة برمجة جديدة و هي لغة ال dart و هذا سيكون محبط لك نوعاً ما بما أنك ما زلت في مرحلة التعلم . أرفقت لك حل للمشكلة الخاصة بك بإستخدام ال html js css 2 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 Yomna Raouf نشر 12 سبتمبر 2020 أرسل تقرير مشاركة نشر 12 سبتمبر 2020 بتاريخ On 9/11/2020 at 14:23 قال عبد الواحد الحدادي: السلام عليكم ورحمة الله وبركاته، أتمنى أن يكون الجميع بصحة جيدة ... أريد أن أسأل أيّ المكتبات توفر هذا السلايد الذي يكون على الأجهزة اللوحية والصغيرة ( انظر الفيديو المرفق من فضلك ) .. المثال من موقع eBay . تحياتي لكم وبالتوفيق للجميع . Record_2020-09-11-22-19-52.mp4 مرحبًا عبد الواحد. يمكنك بناء الslider الموجود في المثال المرفق باستخدام html و css فقط دون الحاجة إلى استخدام أي مكتبات كما يلي: أكواد html: <div class="slider"> <div class="slider__item"> <img class="slider__image" src="image1.png" alt="" > </div> <div class="slider__item"> <img class="slider__image" src="image2.png" alt="" > </div> <div class="slider__item"> <img class="slider__image" src="image3.png" alt="" > </div> <div class="slider__item"> <img class="slider__image" src="image4.png" alt="" > </div> <div class="slider__item"> <img class="slider__image" src="image5.png" alt="" > </div> <div class="slider__item"> <img class="slider__image" src="image6.png" alt="" > </div> <div class="slider__item"> <img class="slider__image" src="image7.png" alt="" > </div> </div> أكواد css: .slider { display: flex; /*تظهر على هيئة صف slider ستقوم هذه الخاصية بجعل محتويات الحاوية */ overflow-x: scroll; /* حتى نرى باقي العناصر scroll بعدها نستخدم هذه الخاصية حتى نتمكن من عمل */ /* IE, Edge and Firefox في المتصفحات scroll baar نستخدم التنسيقين التاليين إذا أردنا إخفاء ال */ -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ } /* Chrome, Safari and Opera في المتصفحات scroll baar نستخدم التنسيقين التاليين إذا أردنا إخفاء ال */ .slider::-webkit-scrollbar { display: none; } .slider__image { width: 150px; } نتيجة الأكواد السابقة: repl.it.mp4 ملفات الأكواد إذا أردت تجربتها: ThoroughWateryWireframes.zip اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
-2 Motaz Khogali نشر 11 سبتمبر 2020 أرسل تقرير مشاركة نشر 11 سبتمبر 2020 وعليكم السلام موجودة علي flutter باستخدام هذل الكود كمثال class _HomePageState extends State<HomePage> { int _index = 0; @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(), body: Center( child: SizedBox( height: 200, // card height child: PageView.builder( itemCount: 10, controller: PageController(viewportFraction: 0.7), onPageChanged: (int index) => setState(() => _index = index), itemBuilder: (_, i) { return Transform.scale( scale: i == _index ? 1 : 0.9, child: Card( elevation: 6, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)), child: Center( child: Text( "Card ${i + 1}", style: TextStyle(fontSize: 32), ), ), ), ); }, ), ), ), ); } } 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
السؤال
عبد الواحد الحدادي
السلام عليكم ورحمة الله وبركاته، أتمنى أن يكون الجميع بصحة جيدة ... أريد أن أسأل أيّ المكتبات توفر هذا السلايد الذي يكون على الأجهزة اللوحية والصغيرة ( انظر الفيديو المرفق من فضلك ) .. المثال من موقع eBay .
تحياتي لكم وبالتوفيق للجميع .
Record_2020-09-11-22-19-52.mp4
رابط هذا التعليق
شارك على الشبكات الإجتماعية
4 أجوبة على هذا السؤال
Recommended Posts
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.