• 리액트 네이티브(React Native) 사용기 21편 - ListView 원하는 Row로 Scroll하기

    리액트 네이티브(React Native), Expo로 인스타그램(Instagram)을 구현하는 부분에서 ListView에서 원하는 Row로 스크롤해야할 필요가 있었고, 해당 부분에 대한 글을 써본다. 일단, ListView에는 scrollToRow와 같은 기능이 없고 scrollTo를 사용해야 한다. 즉, x, y의 위치를 알아야지만 가능하다. 즉, Row의 x, y좌표를 알아내야한다는 것이다. 다행히, View에는 onLayout이라는 옵션이 있는데 이를 이용하면 해당 View의 위치와 크기를...


  • 리액트 네이티브(React Native) 사용기 20편 - Profile화면 구현하기 1편

    Profile화면 구현하기 2편 보기. 리액트 네이티브(React Native), Expo로 이전 글까지 구현한 부분에서 Profile화면에서 ListView에 관해서 조금 썼는데 아예 Profile화면의 구현을 순서대로 써 보려고 한다. Top navigation bar의 구현. Top navigation bar의 터치 구현. Overlay화면 구현. 1. Top navigation bar 구현. 일단 drop_down, drop_up 이미지를 구하도록 하자. CreateUserScreen에서 사용자를 몇 명추가하도록...


  • 안드로이드 커스텀 뷰 1편.(CustomView in Android 1st).

    클래스업(ClassUp)에서도 그렇고 다른 앱을 만들 때에도 그렇지만 내가 원하는 뷰를 따로 만들고 싶은 경우가 있다. 즉, 커스텀 뷰(CustomView)를 만들어야 하는 상황이 있다. 보통 커스텀 뷰(CustomView)를 만드는 상황은 아래와 같다. 기존에 존재하는 뷰에 기능적인 부분을 조금 더 구현할 때. 기존에 존재하는 뷰에 커스텀한 속성을 넣고 싶을 때. 여러 뷰를 통합해서 하나의...


  • 리액트 네이티브(React Native) 사용기 19편 - ListView로 인스타그램 Profile화면 구현하기

    리액트 네이티브(React Native), Expo로 이전 글까지 구현한 부분에서 이제 ProfileScreen을 구현할 것이다. 일단 인스타그램의 프로필 화면의 특징을 조금 살펴보자. 화면 전체가 스크롤 된다. 사용자 프로필 내용에 관련된 뷰와 사용자가 작성한 컨텐츠를 보여주는 뷰로 나뉜다. 중간에 3개의 버튼을 누르면 컨텐츠가 보이는 모습이 Gird, List 등으로 바뀐다. 일단 크게 이렇게 살펴볼 수...


  • 리액트 네이티브(React Native) 사용기 레이아웃 편

    최근 업데이트 : 3, 4, 5, 6 : 2019-03-28 02:57:00. 리액트 네이티브(React Native), Expo로 구현하다가 레이아웃 관련 부분에서 잊지말아야 하는 것들(?)을 꾸준히 생길 때마다 업데이트 하면서 기록하려고 한다. flex와 flexDirection : 그냥 뷰의 비율과 배치 방향이라고 생각하면 쉬운 것 같다. <View style={{flex: 1, flexDirection: 'column'}}> <View style={{flex: 1, backgroundColor: '#0000ff'}}...