https://github.com/ky1vstar/flutter_test
https://github.com/ky1vstar/flutter_test
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/ky1vstar/flutter_test
- Owner: ky1vstar
- Created: 2023-10-08T20:23:28.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2023-10-08T21:20:48.000Z (over 1 year ago)
- Last Synced: 2025-01-06T04:41:22.600Z (4 months ago)
- Size: 6.84 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Olearis Flutter test
## Goals
Before proceeding to the technical interview, we would like to check you skills as Flutter engineer by providing you with this test task.
Your main goal is to create an app consisting of two screens described below. We expect this app to behave as close as possible to the [demo](https://github.com/ky1vstar/flutter_test/assets/23170237/9cd807f8-3031-49ca-ab9a-9e311ce053c6) video.
Your second goal is to implement the app architecture as it was real project from scratch. You should consider using some architectural patterns (like DDD), state management (like BLoC), localization, etc.
## Sign In screen
1. Create simple sign in form consisting of [logo](resources/logo.svg), login text field, password text field and `Continue` button.
2. Logo should be placed at the top of the screen, `Continue` button at the bottom and text fields should be groupped in the middle.
3. You should handle both portrait and landscape orientations and keyboard appearence making the content scrollable.
4. `Continue` button should have simple validation of non-empty inputs.
5. Try to replicate behaviour shown in [result video](https://github.com/ky1vstar/flutter_test/assets/23170237/9cd807f8-3031-49ca-ab9a-9e311ce053c6) as close as possible.
## Home screen
1. Put [logo](resources/logo.svg) image on the screen. It’s minimal margins from each side are 30px and max width is 375.
2. The screen accepts `List` items. The size of the list could be from 0 to any. This list contains the item’s names.
3. You should generate tiles with the items names. Each tile should have minimal margin 12 from each side and a black outside border. There should be two columns.
4. You should calculate tiles width and height to make it:
- fill the screen by width;
- tiles aspect ratio should be 4.
5. The tiles list should be aligned to the bottom. You should use the screen space above it to center Logo vertically and horizontally. See the example below.
6. If there are too many items, Logo should be aligned horizontally by it’s minimal margin and a scroll appears. See the example below.
)
)
)
7. Both portrait and landscape orientations should be handled
8. Try to replicate behaviour shown in [result video](https://github.com/ky1vstar/flutter_test/assets/23170237/9cd807f8-3031-49ca-ab9a-9e311ce053c6) as close as possible.
## Result
https://github.com/ky1vstar/flutter_test/assets/23170237/9cd807f8-3031-49ca-ab9a-9e311ce053c6