Create new record view

[vidbina]

Upon clicking the "add record" button (see FAB in Android, see ➕ in iOS) a camera view should pop up which allows one to snap a picture followed by a view which allows one to specify a price and description.

[vidbina]

As a user I want to enter information such as the description, the monetary value and date or time for every entry.

We have to figure out how we will support this but at least we will need inputs for the description (text), price (numeric value where the keyboard should be a keypad and there should be a dropdown for the currency) and the date (use DatePicker).

Dont worry about saving. We just need the layouts in place, the functional will be added later. Create RecordFormIOS and RecordFormAndroid components which will contain the views to be used. And display the views whenever one clicks the "new record" button.

I believe we currently have the "camera" set up here, but let's just have the "new record" click fire a "CreateRecord" event which may fire up the camera first of the form depending on a setting which we will define later.

[zirconias]

what about a mockup ?
are we going to think about reusable components or each platform has its own design ? do we look after versatility ? or user experience used to be for each platform?

[vidbina]

We go for native experience UI-wise, so own designs 😉. I'm drafting mockups at the moment.

[zirconias]

ok cool ,

[vidbina]

In iOS we allow the scanning of a document through the displayed "Add scan" option, which will eventually fetch an image from the camera.

[vidbina]

The floating action button in Android should allow the user to take a picture of the entry.

[vidbina]

I've already set up components/RecordFormViewAndroid.js and components/RecordFormViewIOS.js which should contain the forms we want. I've done this because I needed to explore to which extent the keyboardType prop of the TextInput offered the ability to customise the keyboards. See commit 70f2903 for details.

Just focus on getting the form to look and feel like the mockups. The functionality will be added later when we have the dispatcher and other plumbing for actions and stores set up 😉

TODO

• Compose component/PriceInput.js which contains the currency and value inputs (clicking on currency should trigger some callback that will eventually display a list of selectable options)
• Style iOS form
• Style Android form

[AlinaChernenko]

Hi @vidbina ! Could you help me with icons for this view? do you have a source assets? Thanks!