•App

[안드로이드&코틀린] 뮤직플레이어#1, exoPlayer를 통해 노래 재생, 그룹 만들기, drawable id 재정의, model mapper만들기, 리사이클러뷰 어댑터

# 완성작 간단한 뮤직플레이어다. 간단하지만 어려웠다. ViewModel의 개념이 들어가면서 깊게 다루지는 않았지만 꽤나 헷갈리는게 많았다. api를 통해 받아온 노래들을 통해 앱을 구성했다. 레트로핏 통신이나, 리사이클러뷰를 구성하는 자세한 방법들은 생략하도록 하겠다. # 공부한 내용 이번강의에서는 DTO, ENTITY, MODEL, MAPPER 등으로 분리시켰다. DTO는 API호출을 통해 받아온 데이터들, 엔티티는 받아온 데이터들의 1:1 DB와 매칭되는 값, MODEL은 앱내에서 쓰이는 데이터들이라고 했다. 이러한 MODEL을 MAPPER를 통해서 생성해 냈다. drawble에서 id값으로 재정의 해주는 방법 그룹 만들기 모델 맵퍼 만들기 리스트 어댑터 만들기 플레이어 만들기 setMusicLis..

[안드로이드&코틀린] 유튜브#2, 모션레이아웃 커스텀, ExoPlayer, 액티비티에서 프래그먼트 함수 가져오기, 안드로이드 onTouchEvent, 터치이벤트 분리하기

[안드로이드&코틀린] 유튜브#1, 모션레이아웃(MotionLayout)을 통해 스와이프 구현, 레이아웃 스와이 # 미리보기 우리가 많이 보는 유튜브에서는, 현재 재생중인 동영상이 밑에 작게 나오고 막대를 끌어올리면 전체화면으로 전환이 되는 모션이 보인다. 볼때마다 어떻게 구현하는건가 싶은 생각 devforyou.tistory.com 나의 귀여운 미니미 유튜브를 완성시켰다. 어찌저찌 나름의 기능은 비슷하다고 생각한다. 로컬에 동영상을 가지고 있는게 아닌 서버에서 동영상을 가져와서 보여주는 형태이다. 사실 그 작업 자체는 어렵지 않지만, 이번 강의에서 하단 프래그먼트 스와이프를 동작하는게 꽤나 어려웠다. 역시 프론트든 클라이언트든, 이런 디자인적인요소가 어렵구나 느낀다..! # 동영상 Mock API 만들기..

[안드로이드&코틀린] 유튜브#1, 모션레이아웃(MotionLayout)을 통해 스와이프 구현, 레이아웃 스와이프, 유튜브 플레이어, 프래그먼트, 프레임레이아웃

# 미리보기 우리가 많이 보는 유튜브에서는, 현재 재생중인 동영상이 밑에 작게 나오고 막대를 끌어올리면 전체화면으로 전환이 되는 모션이 보인다. 볼때마다 어떻게 구현하는건가 싶은 생각이 들었는데, 해답은 MotionLayout을 사용하면 됐다. 레이아웃하나 구성하는데 생각보다 어려웠다. 처음 해보는 거기 때문에 자세히 기록해 두어야 할 것 같다. 동영상을 끌어 스와이프 하면 바텀 내비게이션 바가 아래로 내려가는 것에 주목하자. # 레이아웃 구성 레이아웃은 위처럼 구성된다. [영상+제목+버튼]이 담기는 뷰는 frameLayout으로 안에 프래그먼트를 넣어준다. 스크롤에 반응하는건 모션레이아웃을 사용하면 된다. 1부터 100을 만드는 느낌은 아니고, 모션에 따른 크기 지정을 모션레이아웃을 활용하면 쉽게 할 ..

[안드로이드&코틀린] 에어비앤비#3, 공유하기 기능, 마커 클릭시 viewPager전환, viewPager전환시 마커 표시, locationButton, 위치 권한 받기

[안드로이드&코틀린] 에어비앤비#2, Mocky로 임시 API 만들기, Glide에서 CenterCrop사용하기, Glide로 corne [안드로이드&코틀린] 에어비앤비#1, 네이버 mapAPI 사용하기, 코디네이터(CoordinatorLayout)레이아웃, bo 에어비앤비와 유사한 앱을 만들어보았다. BottomSheetDialog 역할을 하는 view와 네이버 mapAPI, viewpag.. devforyou.tistory.com # 공유하기 기능 private val housePageApdater = HouseViewPagerAdapter(pageClickedCallback = { val intent = Intent().apply { action = Intent.ACTION_SEND putExtra..

[안드로이드&코틀린] 에어비앤비#2, Mocky로 임시 API 만들기, Glide에서 CenterCrop사용하기, Glide로 corner radius주기 ,dp값 px로 바꾸기

[안드로이드&코틀린] 에어비앤비#1, 네이버 mapAPI 사용하기, 코디네이터(CoordinatorLayout)레이아웃, bo 에어비앤비와 유사한 앱을 만들어보았다. BottomSheetDialog 역할을 하는 view와 네이버 mapAPI, viewpager2등을 사용했다. 무엇보다 안드로이드 실제 디바이스를 당근마켓에서 구입해서 하고있는데, 빠릿 devforyou.tistory.com 이번에는 간단하게 테스트용 API를 Json형식으로 만든 후 사용하는 방법과, 글라이드와 레트로핏을 사용하여 받아오는걸 해보도록 하겠다. # Mocky 아래 페이지에 들어간다. Mocky: The world's easiest & fastest tool to mock your APIs designer.mocky.io NE..

[안드로이드&코틀린] 에어비앤비#1, 네이버 mapAPI 사용하기, 코디네이터(CoordinatorLayout)레이아웃, bottomSheet레이아웃 만들기

에어비앤비와 유사한 앱을 만들어보았다. BottomSheetDialog 역할을 하는 view와 네이버 mapAPI, viewpager2등을 사용했다. 무엇보다 안드로이드 실제 디바이스를 당근마켓에서 구입해서 하고있는데, 빠릿빠릿하니 왠지 공부하는게 더 재밌어졌다. 버벅이는게 없어서 그런가.. 돈이 좋다! 구현 기능은, 임시로 구현한 mock서버에서 api통신을 통해 데이터를 가져와 map위에 마커를 찍어주고, 공유하기 기능, viewpager전환 또는 마커 클릭시 서로과 상호작용을 하도록 했다. # 공부내용 정리 1. 네이버 API 연동 및 현재위치 마커찍기 2. 코디네이터레이아웃, 레이아웃 include 3. bottomSheet layout 만들기 4. Mock으로 임시 데이터 API만들기 5. Gl..