chapter 11.4 - 이미지 관련 라이브러리 활용 - PhotoView

PhotoView - 이미지를 확대 / 축소를 지원하는 라이브러리입니다.

scr로 설정된 이미지를 확대 / 축소하는 것입니다.

 

설명을 위해 이전 글을 참고하겠습니다.

 

2021.06.14 - [안드로이드/클래스101 - 비전공자들을 위한 나만의 안드로이드 앱 만들기] - chapter 11.3 - 이미지 관련 라이브러리 활용 -CircleImageView

 

 

 

이미지를 확대 / 축소하기 위해서 id를 설정하겠습니다. 18번 줄과 같습니다.

 

프로필 사진을 크게 보기 위해서 사진을 눌렀을 경우 새로운 액티비티로 이동해서 확대 / 축소를 하겠습니다.

 

사진을 눌렀을 경우 이동할 새로운 액티비티를 만들겠습니다.

 

새로 만든 액티비티의 xml은 배경은 검은색으로 프로필 사진만 있는 화면으로 만들겠습니다.

 

코드를 작성하는 곳은 MainActivity.kt입니다.

이미지를 누르면 새로운 액티비티로 이동하는 코드를 작성하겠습니다.

13번 줄과 같이 이미지에도 setOnClickListener 이벤트를 작성할 수 있습니다.

이미지를 눌렀을 경우 화면을 이동하겠습니다. 17, 18번 줄과 같습니다.

 

2021.04.29 - [안드로이드/클래스101 - 비전공자들을 위한 나만의 안드로이드 앱 만들기] - chapter 5.3 - 여러 화면 활용하기 - Intent(화면 전환)

 

이미지를 이동했지만 아직 이미지를 확대 / 축소는 할 수 없습니다.

기능을 활용하기 위해 라이브러리를 이용합니다.

 

구글에 원하는 키워드만 검색하면 github 사이트에 라이브러리가 나옵니다.

 

https://github.com/Baseflow/PhotoView

 

라이브러리 활용하는 것은 이전 글을 통해 자세하게 설명되어있습니다.

 

2021.06.14 - [안드로이드/클래스101 - 비전공자들을 위한 나만의 안드로이드 앱 만들기] - chapter 11.1 - 라이브러리

 

라이브러리를 활용하기 위해 우선 라이센스를 확인합니다.

 

설치하는 방법을 보겠습니다.

 

Gradle Scripts > build.gradle(Project:~) > repositories에 적어줍니다. 

이 곳은 라이브러리를 확장하기 위해 검색하는 범위를 설정하는 곳입니다.

maven { url "https://www.jitpack.io" }

코드의 경우 기존에 있는 것을 지우고 적는 것이 아니라 추가하는 것입니다.

이 곳에서 작성할 때에는 위, 아래 2군데를 다 적어주어야 합니다.

 

Gradle Scripts > build.gradle(Module:~) > dependencies에 적어줍니다. 

implementation 'com.github.chrisbanes:PhotoView:latest.release.here'

여기까지 작성을 하고 sync now를 눌러줘야 하지만 적용이 되지 않습니다.

그 이유는 파란색 상자 안의 노란색 상자를 보면 영어로 최신 버전을 이곳에 작성하라고 적혀있습니다.

다른 라이브러리의 경우 다 숫자로 적혀있습니다. 이와 마찬가지로 노란색 상자도 최신 버전으로 적어주어야 합니다.

최신 버전의 경우 사이트에 적혀있습니다. 위 파란색 상자를 보면 됩니다.

 

저 숫자에 맞게 고쳐서 sync now를 해주면 됩니다.

 

이전 CircleImageView에 비하면 라이브러리 설치가 복잡한 경우입니다.

하지만 라이브러리 설치법 중에서 이 정도 난이도가 가장 복잡한 수준이라고 보시면 됩니다.

이처럼 Gradle이 들어오면서 라이브러리 설치는 간단해졌습니다.

 

 

사용법을 보겠습니다.

이전 코드의 11번 줄의 ImageView 태그를 PhotoView로 바꾸어 줍니다.

 

 

 

이처럼 라이브러리 설치만 하였을 뿐 코틀린으로 따로 코드를 작성하지 않아도 이러한 기능을 사용할 수 있습니다.

라이브러리를 얼마나 잘 알고 있으며, 활용하느냐에 따라 코드를 작성하는 시간이 단축됩니다.