Flutter Dev نشر 10 مايو 2021 أرسل تقرير نشر 10 مايو 2021 السلام عليكم ورحمة الله وبركاته تحيه طيبه للجميع لدي كود يعمل بشكل جميل لختيار مجموعة من الصور من الهاتف وعرضهم للمستخدم . لكني محتاج مساعده لطريقة ربطه وجعله يقوم بتحميل هذا الصور الى قاعدة بيانات mysql من خلال مكتبة http من فلاتر import 'dart:io'; import 'package:flutter/material.dart'; import 'package:image_picker/image_picker.dart'; void main() => runApp(new SingleImageUpload()); class SingleImageUpload extends StatefulWidget { @override _SingleImageUploadState createState() { return _SingleImageUploadState(); } } class _SingleImageUploadState extends State<SingleImageUpload> { List<Object> images = List<Object>(); Future<File> _imageFile; @override void initState() { // TODO: implement initState super.initState(); setState(() { images.add("Add Image"); images.add("Add Image"); images.add("Add Image"); images.add("Add Image"); }); } @override Widget build(BuildContext context) { return new MaterialApp( home: new Scaffold( appBar: new AppBar( centerTitle: true, title: const Text('Plugin example app'), ), body: Column( children: <Widget>[ Expanded( child: buildGridView(), ), ], ), ), ); } Widget buildGridView() { return GridView.count( shrinkWrap: true, crossAxisCount: 3, childAspectRatio: 1, children: List.generate(images.length, (index) { if (images[index] is ImageUploadModel) { ImageUploadModel uploadModel = images[index]; return Card( clipBehavior: Clip.antiAlias, child: Stack( children: <Widget>[ Image.file( uploadModel.imageFile, width: 300, height: 300, ), Positioned( right: 5, top: 5, child: InkWell( child: Icon( Icons.remove_circle, size: 20, color: Colors.red, ), onTap: () { setState(() { images.replaceRange(index, index + 1, ['Add Image']); }); }, ), ), ], ), ); } else { return Card( child: IconButton( icon: Icon(Icons.add), onPressed: () { _onAddImageClick(index); }, ), ); } }), ); } Future _onAddImageClick(int index) async { setState(() { _imageFile = ImagePicker.pickImage(source: ImageSource.gallery); getFileImage(index); }); } void getFileImage(int index) async { // var dir = await path_provider.getTemporaryDirectory(); _imageFile.then((file) async { setState(() { ImageUploadModel imageUpload = new ImageUploadModel(); imageUpload.isUploaded = false; imageUpload.uploading = false; imageUpload.imageFile = file; imageUpload.imageUrl = ''; images.replaceRange(index, index + 1, [imageUpload]); }); }); } } class ImageUploadModel { bool isUploaded; bool uploading; File imageFile; String imageUrl; ImageUploadModel({ this.isUploaded, this.uploading, this.imageFile, this.imageUrl, }); } 1 اقتباس
1 بلال زيادة نشر 10 مايو 2021 أرسل تقرير نشر 10 مايو 2021 بعد إرجاع الصور من الباك أند تقوم بإضافتهن إلى List images مثل ما هو موجود في الكود الخاص بك. هل ممكن ترفق جزء الإستعلام عن البيانات من الباك اند في flutter ؟ 1 اقتباس
0 Flutter Dev نشر 10 مايو 2021 الكاتب أرسل تقرير نشر 10 مايو 2021 بتاريخ 6 ساعات قال بلال زيادة: بعد إرجاع الصور من الباك أند تقوم بإضافتهن إلى List images مثل ما هو موجود في الكود الخاص بك. هل ممكن ترفق جزء الإستعلام عن البيانات من الباك اند في flutter ؟ اهلا بك اخي هذا الكود ليس مرتبط ب قاعدة بيانات الان انا احصل على الصور من الهاتف وعرضها الان وارغب بتحميلها او عمل upload لها بتاريخ 6 ساعات قال بلال زيادة: بعد إرجاع الصور من الباك أند تقوم بإضافتهن إلى List images مثل ما هو موجود في الكود الخاص بك. هل ممكن ترفق جزء الإستعلام عن البيانات من الباك اند في flutter ؟ ما احتاجه هو عكس ما فهمت انت اخي الكريم اما ارغب بطريقة عمل upload. لمجموعة الصور المختاره اقتباس
0 Nuhla Almasri نشر 11 مايو 2021 أرسل تقرير نشر 11 مايو 2021 (معدل) نعم صحيح حسنا يمكنك إستعمال شئ يسمى multi_image_picker و هي طريقة لتحميل عدة صورة بنفس الوقت دون الحاجة الى عمل اكثر من كبسةهنا يوجد مثال كيفية إستخدام هذه المكتبة بدلا من المكتبة العادية : https://pub.dev/packages/multi_image_picker/example و يمكنك فهم الكود بطريقة بسيطة كالتالي Future<void> loadAssets() async { // هنا نقوم بعمل ليست من الصور و هي اسسيت List<Asset> resultList = <Asset>[]; String error = 'No Error Detected'; try { // نقوم باخذ جميع الصور و خفظ الملومات باوبجكت و من ثم وضعها داخل مصفوفة resultList = await MultiImagePicker.pickImages( maxImages: 300, enableCamera: true, selectedAssets: images, cupertinoOptions: CupertinoOptions(takePhotoIcon: "chat"), materialOptions: MaterialOptions( actionBarColor: "#abcdef", actionBarTitle: "Example App", allViewTitle: "All Photos", useDetailsView: false, selectCircleStrokeColor: "#000000", ), ); } on Exception catch (e) { error = e.toString(); } // If the widget was removed from the tree while the asynchronous platform // message was in flight, we want to discard the reply rather than calling // setState to update our non-existent appearance. if (!mounted) return; // هنا نقوم بحفظ المصفوفة بالستيت setState(() { images = resultList; _error = error; }); } Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: const Text('Plugin example app'), ), body: Column( children: <Widget>[ Center(child: Text('Error: $_error')), ElevatedButton( // هنا تقوم بعمل كبسة واحد تستدعي الدالة التي تقوم بحقظ البيانات child: Text("Pick images"), onPressed: loadAssets, ), Expanded( child: buildGridView(), ) ], ), ), ); } } تم التعديل في 11 مايو 2021 بواسطة Nuhla Almasri 1 اقتباس
0 Flutter Dev نشر 11 مايو 2021 الكاتب أرسل تقرير نشر 11 مايو 2021 بتاريخ 6 دقائق مضت قال Nuhla Almasri: نعم صحيح حسنا يمكنك إستعمال شئ يسمى multi_image_picker و هي طريقة لتحميل عدة صورة بنفس الوقت دون الحاجة الى عمل اكثر من كبسةهنا يوجد مثال كيفية إستخدام هذه المكتبة بدلا من المكتبة العادية : https://pub.dev/packages/multi_image_picker/example اهلا بك اخي الكريم نعم لقد وجدتها ولكن الشكل الخارجي لفكرتي كان مختلف لذلك لم ارغب بستعمالها اقتباس
السؤال
Flutter Dev
السلام عليكم ورحمة الله وبركاته
تحيه طيبه للجميع
لدي كود يعمل بشكل جميل لختيار مجموعة من الصور من الهاتف وعرضهم للمستخدم . لكني محتاج مساعده لطريقة ربطه وجعله يقوم بتحميل هذا الصور الى قاعدة بيانات mysql من خلال مكتبة http من فلاتر
4 أجوبة على هذا السؤال
Recommended Posts
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.