mirror of https://github.com/01-edu/public.git
2 changed files with 52 additions and 24 deletions
@ -1,34 +1,50 @@
|
||||
# Favorite Images |
||||
## Favorite Images |
||||
|
||||
### Introduction |
||||
Nowadays, it is very difficult to imagine a popular app that does not work with storing, accessing images. This is a practical exercise designed to help you practice it in a mobile app. |
||||
|
||||
Nowadays, it is very difficult to imagine a popular app that does not work with storing, accessing images. |
||||
In this app you will get a chance to practise it. |
||||
You should create your gallery, where you can load images from phone library or take a picture and immediately upload it. |
||||
This app must allows you to create a personal gallery where you can upload images from your phone library or take new pictures and immediately add them to your collection. |
||||
|
||||
Allowed package: [image_picker](https://pub.dev/packages/image_picker). |
||||
To build this app, you have as allowed packages the [image_picker](https://pub.dev/packages/image_picker), which enables you to access the device's camera and gallery. |
||||
|
||||
### First Part |
||||
### Instructions |
||||
|
||||
- Create an appbar with **IconButton**. |
||||
- When you click on a button you should see 2 options: open camera or a gallery. |
||||
- See the usage of [image_picker](https://pub.dev/packages/image_picker) package. |
||||
- Don't forget to add special keys to Info.plist file under ios folder to access the camera and gallery, see [example](https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/AboutInformationPropertyListFiles.html). |
||||
- Show "No images selected" message if no images are loaded. |
||||
### Image Picker |
||||
|
||||
In the first part of the exercise, you will create an `appbar` with an **IconButton**. |
||||
When the user clicks on the button, they should see two options: |
||||
|
||||
- Open the camera. |
||||
- Access the gallery. |
||||
|
||||
> Note: Your camera must work both in `iOS` and `Android`. |
||||
|
||||
You should use the `image_picker` package to implement this functionality. Additionally, you should show a `"No images selected"` message if no images have been loaded. |
||||
|
||||
> Note: Don't forget to add special keys to Info.plist file under ios folder to access the camera and gallery, see [example](https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/AboutInformationPropertyListFiles.html). |
||||
|
||||
<center> |
||||
<img src="./resources/imageLibrary.01.png?raw=true" style = "width: 210px !important; height: 420px !important;"/> |
||||
|
||||
</center> |
||||
|
||||
### Second Part |
||||
### Image Gallery |
||||
|
||||
In the second part of the exercise, you will add the following functionalities: |
||||
|
||||
- When user is done picking image or taking picture it should be added to GridList |
||||
- When an image is tapped, user should see the whole image |
||||
- Add an ability to zoom in, zoom out the image, see [example](https://api.flutter.dev/flutter/widgets/InteractiveViewer-class.html). |
||||
- Add the selected image or taken picture to a `GridList` to display all the images in your collection. |
||||
- Implement the ability for the user to `tap on an image` and view the entire picture, providing a better user experience. |
||||
- Add the ability for the user to `zoom in and out` of the image, allowing them to see the image details more clearly. |
||||
|
||||
<center> |
||||
<img src="./resources/imageLibrary.02.png?raw=true" style = "width: 210px !important; height: 420px !important;"/> |
||||
|
||||
<img src="./resources/imageLibrary.03.png?raw=true" style = "width: 210px !important; height: 420px !important;"/> |
||||
</center> |
||||
|
||||
### Bonus |
||||
|
||||
Here are three possible bonus features you could add to this project: |
||||
|
||||
- `Image editing features`, you could add basic image editing functionalities such as cropping, rotating, or adding filters to the images before they are added to the gallery. |
||||
|
||||
- `Cloud storage` to make sure that the user's images are safe, you could implement cloud storage so that the images are stored on a remote server rather than just on the user's device. |
||||
|
||||
- `Sharing options`, to improve the user experience, you could add sharing options so that users can easily share their favorite images on social media platforms or through email or messaging. |
||||
|
@ -1,17 +1,29 @@
|
||||
#### Functional |
||||
|
||||
> In order to run and hot reload app either on emulator or device, follow the [instructions](https://docs.flutter.dev/get-started/test-drive?tab=androidstudio#run-the-app) |
||||
> In order to run and hot reload the app either on emulator or device, follow the [instructions](https://docs.flutter.dev/get-started/test-drive?tab=androidstudio#run-the-app) |
||||
|
||||
##### Create a new empty personal gallery. |
||||
|
||||
###### Does the app show "No images selected" message when no images are loaded? |
||||
|
||||
###### Does the app have a select image button in the appbar? |
||||
###### Does the app have a `select image` button in the `appbar`? |
||||
|
||||
##### Tap on the select image button. |
||||
|
||||
###### Tap on the select image button. Do you have an option to choose an image from gallery and take a picture? |
||||
###### Do you have an option to `choose an image` from gallery and `take a picture`? |
||||
|
||||
###### Does the camera work both in iOS and Android? |
||||
###### Does the camera work both in `iOS` and `Android`? |
||||
|
||||
###### Does the app load chosen image? |
||||
|
||||
###### Tap on the image. Does it become full-size? |
||||
###### Does the image opens in `full-size` once taped? |
||||
|
||||
###### Can you `zoom in and out` the image? |
||||
|
||||
#### Bonus |
||||
|
||||
###### Does the app provide image editing features such as cropping, rotating, or adding filters to images? |
||||
|
||||
###### Does the app implement cloud storage to store images on a remote server? |
||||
|
||||
###### Can you zoom in, zoom out the image? |
||||
###### Does the app have sharing options to share images on social media platforms or through email or messaging? |
||||
|
Loading…
Reference in new issue