web-ridge / react-native-paper-dates

Smooth and fast cross platform Material Design date and time picker for React Native Paper
https://www.reactnativepaperdates.com
MIT License
667 stars 173 forks source link

App Crashes immediately upon opening picker #68

Closed FrankieJLyons closed 3 years ago

FrankieJLyons commented 3 years ago

Hello

Whenever I go to open the date picker the app crashes immediately, I don't get time to read the error that RN throws, but the header says 'Unrecognized font family Material Design Icons'

Here's the relevant code:

import React, {Component} from 'react';
import {Text, View} from 'react-native';
import {TextInput, Button} from 'react-native-paper';
import {DatePickerModal} from 'react-native-paper-dates';
import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';

// Libraries

// Custom Styles
import sScroll from '../assets/styles/sScroll';
import sBackground from '../assets/styles/sBackground';
import sContainer from '../assets/styles/sContainer';
import sImage from '../assets/styles/sImage';
import sText from '../assets/styles/sText';
import sColor from '../assets/styles/sColor';

// Custom Theme
import {TextInputTheme, ButtonTheme} from '../assets/themes/tCustom';

export default class RegisterScreen extends Component {
  constructor(prop) {
    super(prop);

    this.state = {
      firstName: '',
      lastName: '',
      email: '',
      password: '',
      confirm: '',
      dob: '',
      weight: '',
      height: '',
      sex: '',
      showDate: false,
    };
  }

  render() {
    let {
      firstName,
      lastName,
      email,
      password,
      confirm,
      dob,
      weight,
      height,
      sex,
      showDate,
    } = this.state;

    return (
      <KeyboardAwareScrollView
        style={sScroll.container}
        contentContainerStyle={sScroll.content}
        enableOnAndroid={true}
        extraHeight={64}
        showsVerticalScrollIndicator={false}
        ref={ref => (this.scrollRef = ref)}>
        <Text style={sText.header}>Register</Text>

        <View style={sContainer.input}>
          <TextInput
            label="First Name"
            value={firstName}
            onChangeText={text => this.setState({firstName: text})}
            mode="outlined"
            style={sText.input}
            theme={TextInputTheme}
            // Error Handling
            ////error={error_fields.indexOf('name') !== -1 ? '1' : ''}
            // Refs
            // no ref
            onSubmitEditing={() => this.ti2.focus()}
            blurOnSubmit={false}
            // Extra's
            autoCapitalize={'words'}
            autoCorrect={false}
            keyboardType={'default'}
            returnKeyType={'next'}
          />
        </View>

        <View style={sContainer.input}>
          <Button
            theme={ButtonTheme}
            mode="contained"
            style={{width: '50%'}}
            onPress={() => {
              this.setState({showDate: true});
            }}>
            Date of Birth
          </Button>
        </View>

        <DatePickerModal
          // locale={'en'} optional, default: automatic
          mode="single"
          visible={showDate}
          onDismiss={() => {
            this.setState({showDate: false});
          }}
          date={undefined}
          onConfirm={params => {
            this.setState({showDate: false, dob: params.date});
          }}
          // validRange={{
          //   startDate: new Date(2021, 1, 2),  // optional
          //   endDate: new Date(), // optional
          // }}
          // onChange={} // same props as onConfirm but triggered without confirmed by user
          // saveLabel="Save" // optional
          // label="Select date" // optional
          // animationType="slide" // optional, default is 'slide' on ios/android and 'none' on web
        />
      </KeyboardAwareScrollView>
    );
  }
}
FrankieJLyons commented 3 years ago

https://medium.com/@vimniky/how-to-use-vector-icons-in-your-react-native-project-8212ac6a8f06

Fixed the issue following this guide, it was an iOS project issue essentially