(Week 9) Pembuatan guideline warna dan font

Pada week 9 sudah diselesaikan guideline yang diperlukan bagi satu tim sehingga mereka dapat menemukan nama font, warna dalam bentuk hex, dan juga icon yang diperlukan.

Dalam penggunaan font dapat dengan mudah dicari font apa yang diinginkan dan didownload file .tff. Kemudian perlu ditambahkan pada package.json

“rnpm”: {
“assets”: [
“./src/assets/fonts/”
]
}

Setelah ditambahkan kode tersebut kemudian pada command line dijalankan react-native link sehingga file tff dapat dilink kepada android dan juga ios agar dapat digunakan. Setelah itu untuk menggunakannya caranya dengan mengganti fontFamily pada style dengan nama yang tertera pada .tffnya

Selain itu saya juga mencoba untuk membuat form untuk penambahan data. Untuk hal ini saya mencoba dengan menggunakan state yang dipakai diseluruh TextInput

contohnya :

<TextInput
placeholder=”Input Judul yang Menarik!”
onChangeText={text => this.setState({title: text})}
/>

Untuk pembuatan input dengan data numerik juga dapat ditambahkan pada TextInput berupa keyboardType=’numeric’

Pada awal kode juga perlu dibuat state awalnya contohnya :

constructor(props) {
super(props);
this.itemsRef = firebase.database().ref().child(‘items’);
this.state = {
imgSource: ‘’,
location: ‘’,
price: ‘’,
title: ‘’,
weight: ‘’,
};
}

Pada kode diatas dibuat state dengan beberapa isi yang diperlukan untuk menambahkan data dan setelah itu pada setiap TextInput akan diganti setiap kali ada perubahan pada TextInput. Kemudian setelah selesai melakukan input maka akan ada button yang digunakan untuk memasukkan data kedalam firebase.

this.itemsRef.push({
imgSource: this.state.imgSource,
location: this.state.location,
price: this.state.price,
title: this.state.title,
weight: this.state.weight
});