Native 개발29 React-Native : toast 메세지 구현하기 (react-native-easy-toast) React Native를 사용하다 보면 Toast 메세지를 사용해야할 때가 있습니다. Toast 메세지는 안드로이드 개발을 할 때 한번쯤은 접해봤을 텐데요 React-native에서도 쉽게 Toast 메세지를 사용할수 있는 라이브러리가 있습니다. react-native-easy-toast 라는 라이브러리 인데요 이를 이용하면 쉽게 Toast 메세지를 구현할수 있습니다. react-native-easy-toast 설치 아래와 같이 설치합니다. npm i --save react-native-easy-toast react-native-easy-toast 사용법 사용법은 무척 간단합니다. 요즘 Hooks를 쓰는 방법이 일반화되어있으니, React Hooks를 기준으로 설명드리겠습니다. 먼저 Toast에 대한 값.. 2021. 6. 14. React Native : splash 화면 적용하기 React Native에서 데모 앱을 만드는데 Splash를 구현해야 할 일이 생겼습니다. React Native에서 splash를 적용하는 방법에 대해 알아보겠습니다. 1-1) Splash 구현을 위한 준비 단계 (Android) React Native에서 Splash를 구현하기 위해서는 react-native-splash-screen 라는 npm 라이브러리를 사용하는 것이 편리합니다. 1. react-native-splash-screen 라이브러리 설치 (공통) npm i react-native-splash-screen --save 2. android/app/src/main/ 맨 하단에 있는 MainActivity.java 파일 수정하기 (Android) package com.lottoproject;.. 2021. 5. 25. React Native : AsyncStorage 쉽게 사용해보기. 앱 개발을 할때 데이터를 저장할때 저장소에 대해서 고민을 많이 합니다. 보통 Component 내부의 State에 저장을 하거나 Component의 데이터의 State를 중앙집중적으로 관리하기 위해서 Redux를 사용하기도 하죠 ㅎㅎ 하지만 React-Native에서는 Screen의 Component의 State등에 데이터를 담아서 저장하면 문제점이 조금 있습니다. State는 앱이 꺼지거나, Screen의 이동이 일어나면 값이 보장되지 않고 사라질수 있기 때문입니다. 따라서 앱이 꺼져도 써야하는 데이터의 경우 Local 데이터베이스에 저장하여야하는데요, 보통 유저정보를 저장한다거나, JWT토큰저장, 유저가 기록한 메모를 저장 하는데에 사용했었습니다. React Native에서 Local Database.. 2020. 8. 23. React Native : 버튼, TextInput 등에 box-shadow 주는 방법 React Native에서 box-shadow주기 react-native에서 버튼등에 box-shadow를 주고싶을 때가 있습니다. 그럴때는 RN에서 shadowColor, shadowOffset, shadowOpacity, shadowRadius, elevation 속성을 사용하여 box-shadow를 주면 됩니다. 아래 사이트를 이용하면 좀 더 편리하게 box-shadow 스타일링을 할 수 있습니다. :) https://ethercreative.github.io/react-native-shadow-generator/ 다음은 제가 textInput을 box-shadow로 만든 예제입니다. { setInputText(text); }} onSubmitEditing={Keyboard.dismiss} ref .. 2020. 7. 21. React-Native : qrcode 스캐너 이용하기 React-Native로 QR코드 인식 카메라 구현해보기 React-Native로 개발하던중 qrcode를 사용할 일이있어서, 해당 react-native-qrcode-scanner라는 라이브러리를 찾게 되었습니다.. 외국문서는 많이 있지만 한글로 된 문서는 많이 없는것 같아서 구현하고 테스트하는데 시간이 생각보다 걸리더라구요.. 아래 방법으로 구현하면 실제로 예제는 구동시킬수 있는것 같아서 간단하게 메모를 해보았습니다. ~ 1. react-native-qrcode-scanner 라이브러리 설치 및 의존성 라이브러리 설치 npm install react-native-camera npm install react-native-qrcode-scanner npm install react-native-permis.. 2020. 7. 19. 안드로이드 - 햇갈리는 Toolbar와 ActionBar 정리 안드로이드의 ToolBar ActionBar 안드로이드를 개발할때 항상 햇깔렸던 것중에 하나인 Toolbar와 Actionbar에 대해서 한번 정리를 해보겠습니다. ActionBar와 ToolBar의 개념 및 차이점 과거 안드로이드는 ActionBar가 기본으로 존재하였고 그것을 커스터마이징 해서 각 앱에 맞게 변경해서 사용하였습니다. 툴바는 안드로이드 5.0 (API Level 21)부터 추가된 위젯(Widget)으로 앱에서 가장 중요한 액션 또는 자주 사용되는 액션들을 제공하는 앱바(AppBar)를 만들때 사용됩니다. 예전에는 AppBar를 만들때 ActionBar클래스를 사용하여 만들어졌는데 그래서 AppBar를 ActionBar라고 부르기도 하며 아직까지 많은 곳에서 이 두 용어를 혼용해서 사용합.. 2019. 9. 20. 안드로이드 - framelayout의 곂친 레이아웃에서 이벤트 클릭 중복 막기 안드로이드상에서 framelayout에 여러 컨텐츠를 넣고 배치할때 가끔 button 또는 layout 클릭이벤트가 중복되어 (즉 상위 컨테이너 이벤트가 하위 컨테이너로 전달되는 경우) 엄청 곤란할 때가 많습니다. 저는 실제로 다이어리 예제 앱을 만들다가 이런 경우가 발생했었는데요.. ㅠ 파란부분에서 캐러셀뷰 이미지 뷰 클릭이벤트를 구현하였고 이 이벤트가 왼쪽 상단 노란부분의 뒤로가기 버튼과 곂치는 일이 발생하였습니다. 그결과 왼쪽 상단 뒤로가기 버튼을 클릭했을 때에도 사진 업로드 팝업이 뜨게 되는 일이 발생하게 되었습니다. 이에 대한 해결법은 매우 간단합니다. // 상단의 TopMenu가 클릭될때 뒤쪽의 캐러셀도 같이 터치되는 동작을 막기위한 코드 RelativeLayout rlTopMenu; rlTo.. 2019. 8. 20. Lombok 설치시 transformClassesWithDexBuilderForDebug 에러 Android studio 3.1.2 버전에서 gradle 4.10.1 버전으로 앱을 만들고 있던중 Lombok을 적용할 일이 생겼다. compileOnly "org.projectlombok:lombok:1.18.4" annotationProcessor "org.projectlombok:lombok:1.18.4" 위와 같은 형식으로 Lombok을 적용하였는데 다음과 같은 에러가 발생하였다. lombok 1.x.x throws transformClassesWithDexBuilderForDebug 원인은 Java8이 잠재적으로 .class file의 사이즈를 줄이는데 mothod count까지 줄이면서 문제가 발생하는것 같다는 의견이 있었다. 정확한 원인은 파악하지 못했다. gradle.properties에.. 2019. 8. 7. 안드로이드 - 거주지 입력 - 동주소까지 입력받기 (노가다) 안드로이드 동주소 입력받기 안드로이드에서 거주지를 입력하는 화면을 만들고 싶을 때가 있습니다. 주소 검색 API를 쓰는것도 한가지 방법이지만, 만약 동주소까지만 입력받고 싶다면 주소검색 API를 쓰는것이 무겁기도 하고, 목적에 맞지 않는 API 사용일 것입니다. 저는 한가지 방법으로 안드로이드의 res/values/arrays.xml에 - 행정자치구역 - 시 / 군 / 구 - 동주소 (서울시일경우에만) 데이터를 입력한 뒤에 해당 값을 Spinner를 통해 사용자들이 선택하도록 구현해 보았습니다. 눈물의 노가다. 여기서는 해당 arrays.xml 파일을 블로그에 공유하고 간단히 사용법을 메모하려고 합니다. 구현방법 구현하기전에 필요한 값들로는 스피너 3개 ArrayAdapter 3개 res/values/a.. 2019. 6. 24. 안드로이드 - versionCode 와 versionName 안드로이드의 앱 정보 중에서 버전코드와 버전이름이 있습니다. 버전 코드 (versionCode) google Play에 공개 할때 사용하는 것으로 이전보다 높으면 앱을 갱신하게 됩니다. 이전보다 높으면 앱을 갱신하게 됩니다. 앱을 사용하는 유저는 업데이트 정보가 뜨게 됩니다. 버전 이름 (versionName) 버전 이름은 버전 코드와 달리 유저가 확인할 수 있는 정보로 앱 갱신에 영향을 주지 않습니다. 버전 이름은 보통 3자리로 구성되며 다음과 같은 의미가 있습니다. 이것은 정답이 없으므로 상황에 맞게 의미를 부여해 주면 됩니다. android:versionName = "1.0.0" 첫번째 번호 : 컨셉이나 앱이 지향하는 기본 디자인이 변경된 경우 두번째 번호 : 기능 추가나 사양이 변경된 경우 세번째.. 2019. 4. 10. 이전 1 2 3 다음
