Confirm and cancel buttons

[MartXXIII]

Issue

Hello, Thanks for the great library but I have a problem with the latest React Native version. The text of the confirm and cancel buttons is not displayed.

Expected Behavior

Text should be displayed in buttons.

Code

import React, { Component } from 'react'
import { View } from 'react-native'
import DatePicker from 'react-native-datepicker'

export default class MyDatePicker extends Component {
    constructor(props){
        super(props)
        this.state = {date:"2016-05-15"}
    }

    render(){
        return (
            <View style={{marginTop: 100}}>
            <DatePicker
                style={{width: 200}}
                date={this.state.date}
                mode="date"
                placeholder="select date"
                format="YYYY-MM-DD"
                minDate="2016-05-01"
                maxDate="2016-06-01"
                confirmBtnText="Confirm"
                cancelBtnText="Cancel"
                customStyles={{
                    dateIcon: {
                        position: 'absolute',
                        left: 0,
                        top: 4,
                        marginLeft: 0
                    },
                    dateInput: {
                        marginLeft: 36
                    }
                    // ... You can check the source to find the other keys.
                }}
                onDateChange={(date) => {this.setState({date: date})}}
            />
            </View>
        )
    }
}

Environment

1. react-native -v: "0.54.2"
2. node -v: v9.8.0
3. npm -v: 5.6.0
4. yarn --version: 1.5.1
5. target platform: iOS
6. operating system: OSX

[jeffbonasso]

I figured out a workaround for this using the current build, although it should be updated in the library. Using Toggle Inspector in the debug tools you will see there is just no height for the text of the TouchableHighlight buttons. You can actually click on them. Because the library allows customStyles, I added the following to the CustomStyles property after the dateInput object when creating a <DatePicker> component...

,
btnTextConfirm: {
   height: 20
},
btnTextCancel: {
   height: 20
}

[ghost]

I figured out a workaround

@jeffbonasso you are a hero

[safciplak]

hi guys i can't it i added

                                        placeHolderText={this.state.birthday ? this.state.birthday : strings('SELECT')}
                                        minimumDate={new Date(1900, 1, 1)}
                                        maximumDate={new Date(new Date().getFullYear() - 18, 12, 1)}
                                        locale={"tr"}
                                        confirmBtnText="Confirm"
                                        cancelBtnText="Cancel"
                                        timeZoneOffsetInMinutes={undefined}
                                        modalTransparent={true}
                                        animationType={"fade"}
                                        androidMode={"default"}
                                        customStyles={{btnTextConfirm: {
                                                height: 20
                                            },
                                            btnTextCancel: {
                                                height: 20
                                            }}}
                                        textStyle={{color: "green"}}
                                        placeHolderTextStyle={{color: this.state.birthday ? "green" : "#d3d3d3"}}
                                        onDateChange={this.setDate}
                                    />```


something like that but not works

[jeffbonasso-ambifi]

If it helps this is what my entire customStyles object looks like...

customStyles={{
  dateIcon: {
    position: 'absolute',
    left: 0,
    top: 4,
    marginLeft: 0
  },
  dateInput: {
    marginLeft: 36
  },
  btnTextConfirm: {
    height: 20
  },
  btnTextCancel: {
    height: 20
  }
}}

[safciplak]

thank you for suggest. it doesn't work still i'm not sure. devdependencies : "metro-react-native-babel-preset": "^0.56.0", dependencies: "native-base": "^2.13.5",

[ALIHASSAN65]

still not showing the button's text of confirm and cancel

[RiyaNainwani]

1+