two FilledTextField in a row, focusing 2nd one not the first one
focusable={false}
autoFocus={false}
autoCorrect={false}
these properties are also not working for the same
<View
style={[
styles.container,
this.state.hasFocus ? styles.active : null,
errorMessage ? styles.bottomBorder : null,
]}>
<View key="CountryCode" style={countryCodeStyle}>
<TouchableOpacity
onPress={() => onPressCountry()}
activeOpacity={0.5}>
<FilledTextField
{...this.props}
ref={ref => (this.countryInputRef = ref)}
key="CountryCode"
defaultValue={countryCode}
label={placeholderCode}
value={countryCode}
lineWidth={0}
fontSize={FontsSize.font12}
labelFontSize={FontsSize.font10}
inputContainerStyle={[
this.state.hasFocus ? styles.inputText : styles.inputTextBlur,
]}
lineType={'none'}
selectionColor={colors.FROLY}
labelOffset={{y0: -3}}
labelTextStyle={styles.labelTextStyle}
baseColor={colors.COMET}
tintColor={colors.COMET}
error={errorMessage}
onChangeText={text =>
handleChangeText(text.replace(/[^0-9]/g, ''))
}
onFocus={this.onFocusCountryCode}
onBlur={this.onBlurCountryCode}
titleTextStyle={styles.labelTextStyle}
disabledLineWidth={0}
editable={false}
keyboardType="numeric"
/>
</TouchableOpacity>
<View style={{position: 'absolute', end: 0}}>
<TouchableOpacity onPress={() => onPressCountry()}>
<Image
source={Assets.ic_down_arrow}
style={styles.selectIcon}
/>
</TouchableOpacity>
</View>
</View>
<View
key="MobileNumber"
style={{flex: 0.8}}
focusable={false}
onStartShouldSetResponder={() => false}>
<FilledTextField
key="MobileNumber"
{...this.props}
ref={ref => (this.inputRef = ref)}
label={label}
value={value}
lineWidth={0.5}
fontSize={FontsSize.font12}
labelFontSize={FontsSize.font10}
inputContainerStyle={[
this.state.hasFocus ? styles.inputText : styles.inputTextBlur,
]}
lineType={'none'}
pointerEvents={pointerEvent}
selectionColor={colors.FROLY}
labelOffset={{y0: -3}}
labelTextStyle={styles.labelTextStyle}
baseColor={colors.COMET}
tintColor={colors.COMET}
error={errorMessage}
onChangeText={text =>
handleChangeText(text.replace(/[^0-9]/g, ''))
}
onFocus={this.onFocusCallback}
onBlur={this.onBlurBack}
titleTextStyle={styles.labelTextStyle}
editable={isEditable}
keyboardType="numeric"
/>
</View>
</View>
Demo : https://www.loom.com/share/647d830245e147de9ab0c75a2d376cb7
two FilledTextField in a row, focusing 2nd one not the first one
these properties are also not working for the same
Demo : https://www.loom.com/share/647d830245e147de9ab0c75a2d376cb7