0904. 공부

1. TS

export type RootStackParamList = {
  SignIn: undefined;
  SignUp: undefined;
}

type SignInScreenProps = NativeStackScreenProps<RootStackParamList, 'SignIn'>;

function SignIn({navigation}: SignInScreenProps) {
  const toSignUp = useCallback(() => {
      navigation.navigate('SignUp');
  }, [navigation]);
  return ...
}

위와 같은 방법으로, navigation에는 내가 미리 지정한 값만 들어갈 수 있다

 

2. keyboardAvoidingView

<KeyboardAvoidingView behavior='position' >

KeyboardAvoidingView 태그에 behavior: position을 줌으로써,

 

입력창을 클릭했을 때 입력창이 키보드에 가리지 않도록 해줄 수 있으나

 

키보드가 올라와도 입력창이 가리지 않음에도 화면을 상단으로 움직이는 불편함이 있어서

 

keyboard-aware-scroll-view 라이브러리를 사용한다고 한다

 

3. TextInput 

autoComplete(only android) -> sms-otp라고 설정을 준다면, 문자로 날아온 인증번호 같은 것들을 자동완성 해준다

clearButtonMode(only ios) -> 오른쪽 끝 x 클릭 시, 내용 다 날아가게 해줌

secureTextEntry -> 비밀번호 안보이게

 

 

4. hairlineWidth

1보다 작지만, 눈에 보이는 width값을 다음과 같이 줄 수 있다

const styles = StyleSheet.create({
  row: {
    borderBottomWidth: StyleSheet.hairlineWidth
  }
})