본문 바로가기

모바일 앱/React Native25

[React Native] TextInput의 기본 패딩 없애기 React Native에서 TextInput을 사용해보시면 기본적으로 패딩값이 적용되어 있다는 것을 아실 겁니다. photoCaption:{ backgroundColor:'#F9F9F9', color:'#3C3C3E', fontSize:13, paddingLeft:8, marginTop:8, fontFamily:'NotoSans-DemiLight', lineHeight:23, height:30 }, 이것은 제가 작업하던 소스 코드의 일부인데요, 이 style을 TextInput에 적용하였더니 아래와 같은 결과가 나왔습니다. 보시면 TextInput에 height를 적용한 상황인데, 글자가 잘리시는 것을 볼 수 있습니다. TextInput에 디폴트로 패딩 값이 들어있어서 그런 건데, padding값을 없애.. 2021. 6. 17.
[React Native] borderStyle 적용되지 않는 경우 지난 번에 작업 중에 아래와 같은 레이아웃을 구현해야하는 경우가 있었습니다. 단순히 borderStyle을 dashed로 지정해주면 되는 문제였는데요, 적용이 되지 않았습니다. 문제를 찾아보니 borderRadius 값을 추가해주어야 borderStyle dotted 혹은 dashed가 지정된다고 합니다. 따라서 아래와 같이 구현을 할 수 있습니다. 이 때 borderRadius 값은 꼭 1이 아니고 다른 값이어도 됩니다. 참고 https://stackoverflow.com/questions/48258084/borderstyle-not-working-in-android-react-native/67277224#67277224 borderStyle not working in android - react-na.. 2021. 5. 26.
[React Native] TextInput returnKeyType이 적용이 되지 않는 경우 얼마 전 프로젝트를 진행할 때 textInput에서 returnKeyType을 적용해야하는 경우가 있어 적용을 했습니다. returnKeyType은 키보드 우측 하단에 있는 버튼을 어떤 타입으로 할 건지를 결정하는 prop입니다. 아래 링크와 사진을 참고하시면 이해에 도움이 될 것입니다. https://reactnative.dev/docs/textinput#returnkeytype TextInput · React Native A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-cap.. 2021. 5. 24.
[React Native] 안드로이드 gradle clean React Native에서 빌드를 할 때 안드로이드 쪽에서 문제가 발생하면 아래 명령어를 입력해보시는 것을 추천드립니다. cmd 창이나 터미널 창에서 프로젝트 경로로 이동하신 이후 cd android gradlew clean 안드로이드에서 gradle의 캐시를 초기화하는 명령어로 알고 있는데요, 안드로이드 폴더에서 어떤 사항을 변경하셨을 때 오류가 터진 경우, 혹은 모듈을 다운받았는데 잘 실행이 되지 않는 경우, 저는 이 명령어를 실행해 오류를 해결한 경험이 있습니다. 2021. 5. 24.