728x90
반응형

자동완성검색 2

[자동완성검색] UI-Kitten Autocomplete 사용하기 / 응용편

✔️ 필요성 지난번에 UI Kitten Autocomplete를 통해 React Native에서 자동완성검색창을 만드는 기본편을 따라해보았다면 이번에는 내가 나의 취향에 맞춰서 꾸며서 응용을 해볼 수 있다. [자동완성검색] UI Kitten Autocomplete 사용하기 / 기본편 ✔️ 필요성 react-native-autocomplete-dropdown도 충분히 좋은 라이브러리인데 renderItem method를 사용해서 그릴 경우 autocomplete이 안되는 충격적인 에러가 있어서 급하게 UI Kitten에서 제공하는 것으로.. sezzled.tistory.com 응용을 할 때 가장 중심이 되는 부분은 renderItem 즉 검색을 했을 때 결과가 나오는 옵션창이 지금까지 일반적인 것이 아니라..

[자동완성검색] UI-Kitten Autocomplete 키보드에 따라 옵션창 위치 바꾸기

✔️ 필요성 React Native로 개발하다보면 (앱을 개발하다보면) 웹이랑 다르게 신경써야할 부분이 키보드이다. 키보드가 올라오면 화면의 약 1/3을 가리게 되는 데 이 때 어떻게 해야할 지 신경써야한다는 것이다. 검색창처럼 검색 결과가 검색창 아래로 내려오는 경우 더 신경이 쓰이는데, 이를 위해 앱을 보면 대체로 검색창은 가장 상단에 위치하는 것이 국룰이다. ✔️ 문제 해결 UI Kitten Autocomplete에서는 이에 대응하기 위해서 옵션창의 위치를 바꿀 수 있다. 검색 결과(옵션)이 나오는 부분이 원래 검색창 아래에 있는데 키보드를 인지하면 위로 바꿔주는 것이다. 키보드를 인지하기 위해서 react-native에서 제공하는 Keyboard.addListener를 사용했다. const [pl..

728x90
반응형