<View style={{
  marginBottom: 10,
  marginHorizontal: 50,
  width: 820,
  flexDirection: 'row'
  // flex: 1,
  // // display: 'none',
  // flexDirection: 'row',
  // justifyContent: ''
  // borderRightWidth: 1
}}>
    <View style={{ flex: 1 }}>
      {/* <Form style={styles.input}> */}
      {this.state.form.map(row => {
        if (row.type === 'text') {
            return (
                <Item style={{ height: 80 }}>
                    <Label style={{ fontSize: 20, width: 190 }}>{row.name_of_field}</Label>
                    <Label style={{ fontSize: 20 }}>:</Label>
                    <TextInput
                        style={{ fontSize: 18 }}
                        placeholder={row.name_of_field}
                        value={this.state.form_values[row.name_of_field]}
                        onChangeText={(text) => {
                            this.setState({
                                form_values: {
                                    ...this.state.form_values,
                                    [row.name_of_field]: text
                                }
                            });
                        }}
                    />
                </Item>)
        } else if (row.type === 'number') {
            return (
                <Item style={{ height: 80 }}>
                    <Label style={{ fontSize: 20, width: 190 }}>{row.name_of_field}</Label>
                    <Label style={{ fontSize: 20 }}>:</Label>
                    <TextInput
                        style={{ fontSize: 18 }}
                        keyboardType='numeric'
                        placeholder={row.name_of_field}
                        value={this.state.form_values[row.name_of_field]}
                        onChangeText={(text) => {
                            this.setState({
                                form_values: {
                                    ...this.state.form_values,
                                    [row.name_of_field]: text
                                }
                            });
                        }}
                    />
                </Item>)
        }
        else if (row.type === 'photo') {
            const { avatarSource } = this.state
            return (
                <View>
                    <Item>
                        <Label style={{ fontSize: 20, width: 190 }}>Photo</Label>
                        <Label style={{ fontSize: 20 }}>:</Label>
                        <View>
                            <Button style={{ backgroundColor: 'blue', alignItems: 'center', justifyContent: 'center', margin: 7 }} onPress={this.uploadPic}>
                                <Text>CAPTURE</Text>
                            </Button>
                        </View>
                    </Item>
                </View>
            )
        }
        else if (row.type === 'signature') {
            // alert(row.type);
            return (
                <Item>
                    <View>
                        <Label style={{ margin: 3 }}>Silahkan Tanda Tangan Dibawah Ini :</Label>
                        <View style={{ borderWidth: 0.8, borderTopWidth: 0.5 }}>
                            <SignatureCapture
                                style={styles.signature}
                                ref="sign"
                                onSaveEvent={this._onSaveEvent}
                                onDragEvent={this._onDragEvent}
                                saveImageFileInExtStorage={true}
                                showNativeButtons={false}
                                showTitleLabel={false} />
                        </View>
                        <View
                            style={{
                                flex: 1,
                                flexDirection: "row"
                            }}>
                            <TouchableOpacity
                                style={styles.buttonStyle}
                                onPress={() => {
                                    this.saveSign()
                                }}>
                                <Text style={{ color: '#fff' }}>Save</Text>
                            </TouchableOpacity>
                            <TouchableOpacity
                                style={styles.buttonStyle}
                                onPress={() => {
                                    this.resetSign()
                                }}>
                                <Text style={{ color: '#fff' }}>Reset</Text>
                            </TouchableOpacity>
                        </View>
                    </View>
                </Item>)
        }
    })}
  </View>
  <View  style={{ flex: 1 }}>
    {avatarSource && (
        <Image
            source={{ uri: avatarSource.uri }}
            style={{ width: 140, height: 110, margin: 5 }}
        />
    )}
  </View>
</View>