add image and show it

ZahraErfani · ZahraErfani · commit f0e1a16c2d6f · 2023-03-14T15:57:05.000+03:30
diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
@@ -2,6 +2,7 @@
     package="com.example.todo">
     <uses-permission android:name="android.permission.RECORD_AUDIO" />
     <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
+    <uses-permission android:name="android.permission.CAMERA"/>
    <application
         android:label="todo"
         android:name="${applicationName}"
diff --git a/lib/Utils/upload_image.dart b/lib/Utils/upload_image.dart
@@ -0,0 +1,50 @@
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:image_picker/image_picker.dart';
+import 'package:todo/Utils/utils.dart';
+
+class UploadImage {
+  UploadImage._();
+  Future<bool> requestPermission(type) async {
+    if (type == ImageSource.gallery) {
+      return await Utils.getStoragePermission();
+    } else {
+      return await Utils.getCameraPermission();
+    }
+  }
+
+  static Future<XFile?> openImagePicker({
+    required ImageSource source,
+    required BuildContext context,
+  }) async {
+    Uint8List? imageBytes;
+    XFile? choosePhoto;
+    bool permission = false;
+    if (!kIsWeb) {
+      if (source == ImageSource.gallery) {
+        permission = await Utils.getStoragePermission();
+      } else {
+        permission = await Utils.getCameraPermission();
+      }
+
+      if (permission) {
+        ImagePicker picker = ImagePicker();
+        XFile? photo = await picker.pickImage(
+            source: source, maxWidth: 1500, maxHeight: 1500, imageQuality: 99);
+        if (photo != null) {
+          choosePhoto = photo;
+          imageBytes = await photo.readAsBytes();
+        }
+        return choosePhoto;
+      } else {
+        if (context.mounted) {
+          ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
+            content: Text('Permission'),
+            duration: Duration(seconds: 1),
+          ));
+        }
+      }
+    }
+    return null;
+  }
+}
diff --git a/lib/Utils/utils.dart b/lib/Utils/utils.dart
@@ -0,0 +1,22 @@
+import 'package:permission_handler/permission_handler.dart';
+
+class Utils {
+  Utils._();
+  static Future<bool> getStoragePermission() async {
+    final status = await Permission.storage.request();
+    if (status == PermissionStatus.granted) {
+      return true;
+    } else {
+      return false;
+    }
+  }
+
+  static Future<bool> getCameraPermission() async {
+    final status = await Permission.camera.request();
+    if (status.isGranted) {
+      return true;
+    } else {
+      return false;
+    }
+  }
+}
diff --git a/lib/config/route/const.dart b/lib/config/route/const.dart
@@ -3,4 +3,5 @@ class RouteName {
   static const String init = '/';
   static const String home = '/home';
   static const String addTask = '/addTask';
+  static const String showImage = '/showImage';
 }
diff --git a/lib/config/route/generate.dart b/lib/config/route/generate.dart
@@ -1,6 +1,8 @@
 import 'package:flutter/material.dart';
+import 'package:image_picker/image_picker.dart';
 import 'package:todo/screen/add_task/add_task.dart';
 import 'package:todo/screen/home/home.dart';
+import 'package:todo/screen/show_image/show_image.dart';
 import 'package:todo/screen/splash/splash.dart';
 
 import 'const.dart';
@@ -17,6 +19,8 @@ class RouteGenerator {
           return const Home();
         case RouteName.addTask:
           return const AddTask();
+        case RouteName.showImage:
+          return ShowImage(image: args as XFile);
         default:
           return _errorRoute(settings.name);
       }
diff --git a/lib/data/hive/models/task.dart b/lib/data/hive/models/task.dart
@@ -15,7 +15,7 @@ class Task extends HiveObject {
   @HiveField(4)
   final String? note;
   @HiveField(5)
-  final String? image;
+  final List<String?>? image;
   @HiveField(6)
   final List<SubTask>? subTask;
   Task(
diff --git a/lib/data/hive/models/task.g.dart b/lib/data/hive/models/task.g.dart
diff --git a/lib/screen/add_task/add_task.dart b/lib/screen/add_task/add_task.dart
@@ -1,6 +1,13 @@
+import 'dart:io';
+
 import 'package:flutter/material.dart';
+import 'package:image_picker/image_picker.dart';
 import 'package:record/record.dart';
+import 'package:todo/Utils/upload_image.dart';
+import 'package:todo/config/route/const.dart';
 import 'package:todo/config/themes/my_drawing.dart';
+import 'package:todo/data/hive/models/task.dart';
+import 'package:todo/data/hive/requests/task_request.dart';
 import 'package:todo/data/media_query/media_query.dart';
 import 'package:todo/data/media_query/space_between.dart';
 import 'package:todo/data/model/front/header_model.dart';
@@ -25,6 +32,7 @@ class _AddTaskState extends State<AddTask> {
   final record = Record();
   bool recordAudio = false;
   String? audioPath;
+  List<String?> choosePhoto = [];
 
   @override
   void initState() {
@@ -63,7 +71,7 @@ class _AddTaskState extends State<AddTask> {
                       name = text;
                     });
                   },
-                  labelText: "Task Name",
+                  labelText: "Task name",
                   validation: "required",
                   preIcon: Icons.task,
                 ),
@@ -79,7 +87,6 @@ class _AddTaskState extends State<AddTask> {
                         title: "record",
                         child: AudioRecorder(
                           onStop: (path) {
-                            print('Recorded file path: $path');
                             setState(() {
                               audioPath = path;
                               recordAudio = true;
@@ -107,7 +114,7 @@ class _AddTaskState extends State<AddTask> {
                       note = text;
                     });
                   },
-                  labelText: "Add a Note",
+                  labelText: "Add a note",
                   validation: "required",
                   preIcon: Icons.note,
                 ),
@@ -117,9 +124,65 @@ class _AddTaskState extends State<AddTask> {
                     loading: false,
                     showBoxShadow: false,
                     icon: Icons.image,
-                    onTab: () {},
+                    onTab: () => chooseImageSource(),
                     title: "Add an image"),
                 intermediate(20),
+                choosePhoto.isNotEmpty
+                    ? Wrap(
+                        children: [
+                          for (int index = 0;
+                              index < choosePhoto.length;
+                              index++)
+                            Padding(
+                              padding: const EdgeInsets.symmetric(
+                                  vertical: 10.0, horizontal: 10.0),
+                              child: InkWell(
+                                onTap: () => Navigator.of(context).pushNamed(
+                                    RouteName.showImage,
+                                    arguments: choosePhoto[index]!),
+                                child: Stack(
+                                  alignment: Alignment.topLeft,
+                                  children: [
+                                    ClipRRect(
+                                      borderRadius: BorderRadius.circular(4.0),
+                                      child: Image.file(
+                                        File(choosePhoto[index]!),
+                                        width: 100,
+                                        height: 100,
+                                        fit: BoxFit.cover,
+                                      ),
+                                    ),
+                                    InkWell(
+                                        onTap: () {
+                                          setState(() {
+                                            choosePhoto.removeAt(index);
+                                          });
+                                        },
+                                        child: Padding(
+                                          padding: const EdgeInsets.symmetric(
+                                              vertical: 3, horizontal: 3),
+                                          child: ClipOval(
+                                            child: Container(
+                                              alignment: Alignment.center,
+                                              width: 25,
+                                              height: 25,
+                                              color: MyColors.white,
+                                              child: const Icon(
+                                                Icons.clear,
+                                                color: MyColors.red,
+                                                size: 20,
+                                              ),
+                                            ),
+                                          ),
+                                        ))
+                                  ],
+                                ),
+                              ),
+                            ),
+                        ],
+                      )
+                    : Container(),
+                intermediate(20),
                 ButtonLoading(
                     btnColor: MyColors.primaryDark,
                     btnWidth: context.width - 20,
@@ -135,9 +198,48 @@ class _AddTaskState extends State<AddTask> {
     );
   }
 
+  chooseImageSource() async {
+    final res = await ModalClass.showModalBottomCustomSheet(
+        context: context,
+        child: Container(
+            color: MyColors.white,
+            width: context.width,
+            height: 200,
+            child: Column(
+              children: [
+                intermediate(20),
+                ButtonLoading(
+                    loading: false,
+                    showBoxShadow: false,
+                    onTab: () => Navigator.of(context).pop("camera"),
+                    title: "Camera"),
+                intermediate(20),
+                ButtonLoading(
+                    loading: false,
+                    showBoxShadow: false,
+                    onTab: () => Navigator.of(context).pop("gallery"),
+                    title: "Gallery"),
+              ],
+            )));
+    if (res != null && context.mounted) {
+      final result = await UploadImage.openImagePicker(
+          source: res == "camera" ? ImageSource.camera : ImageSource.gallery,
+          context: context);
+      if (result != null) {
+        setState(() {
+          choosePhoto.add(result.path);
+        });
+      }
+    }
+  }
+
   save() {
-    if (formKey.currentState!.validate()) {
+    if (formKey.currentState!.validate() &&
+        audioPath != null &&
+        choosePhoto.isNotEmpty) {
       print("1111111111111111111");
+      TaskHiveRequest.addTask(Task(
+          taskName: name!, record: audioPath, note: note!, image: choosePhoto));
     } else {
       print("ajsdhgkjd");
     }
diff --git a/lib/screen/show_image/show_image.dart b/lib/screen/show_image/show_image.dart
@@ -0,0 +1,33 @@
+import 'dart:io';
+
+import 'package:flutter/material.dart';
+import 'package:image_picker/image_picker.dart';
+import 'package:todo/data/media_query/media_query.dart';
+import 'package:todo/data/model/front/header_model.dart';
+import 'package:todo/widgets/appbar/my_custom_appbar.dart';
+
+class ShowImage extends StatelessWidget {
+  final XFile image;
+  const ShowImage({Key? key, required this.image}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: MyCustomAppBar(
+        item: HeaderModel(title: "Image", icon: []),
+        backButton: true,
+      ),
+      body: Center(
+        child: ClipRRect(
+          borderRadius: BorderRadius.circular(4.0),
+          child: Image.file(
+            File(image.path),
+            width: context.width - 100,
+            height: context.width - 100,
+            fit: BoxFit.cover,
+          ),
+        ),
+      ),
+    );
+  }
+}
diff --git a/lib/widgets/modal/modal.dart b/lib/widgets/modal/modal.dart
@@ -1,6 +1,8 @@
 import 'package:flutter/material.dart';
 
 class ModalClass {
+  ModalClass._();
+
   static Future showModalBottomPage({
     required BuildContext context,
     required Widget child,
@@ -42,4 +44,22 @@ class ModalClass {
       },
     );
   }
+
+  static Future showModalBottomCustomSheet({
+    required BuildContext context,
+    required Widget child,
+  }) async {
+    final res = await showModalBottomSheet(
+        context: context,
+        shape: const RoundedRectangleBorder(
+          borderRadius: BorderRadius.only(
+              topLeft: Radius.circular(30.0), topRight: Radius.circular(30.0)),
+        ),
+        builder: (context) {
+          return DraggableScrollableSheet(
+            builder: (_, controller) => Container(child: child),
+          );
+        });
+    return res;
+  }
 }
diff --git a/pubspec.lock b/pubspec.lock
diff --git a/pubspec.yaml b/pubspec.yaml

Original file line number	Diff line number	Diff line change
`@@ -3,4 +3,5 @@ class RouteName {`
`3`	`3`	`static const String init = '/';`
`4`	`4`	`static const String home = '/home';`
`5`	`5`	`static const String addTask = '/addTask';`
	`6`	`+ static const String showImage = '/showImage';`
`6`	`7`	`}`