[안드로이드 스튜디오] 프로필 사진 등록 기능

안드로이드 스튜디오에서 이미지를 가져오는 코딩에 대해 설명하겠습니다.

여러가지 공식문서를 참고하였습니다.

 

이미지를 가져오기전, 안드로이드 스튜디오에서는 어떻게 이미지를 저장하고 가져오는지에 대해서 간략하게 설명하겠습니다.

 

시작전 개념참고)

 

URI

공식문서:Uri  |  Android Developers

Uri는 추상적개념입니다. 저장된 데이터에서 //를 사용해여 위치를 지정하여 가져오는 겁니다.

예를 들어, 갤러리에서 이미지를 가져온 경우, 해당 이미지의 URI는 "content://media/external/images/media/1234"와 같은 형식일 수 있습니다.

안드로이드에서 이미지를 가져오는 과정에서 URI를 사용하는 이유는 안드로이드의 보안 및 데이터 관리를 위해서입니다.

갤러리에서 이미지를 가져올 때 갤러리 앱이 이미지의 URI를 반환하면, 해당 이미지가 저장된 실제 위치를 몰라도 안드로이드 시스템이 이미지를 가져와서 앱에 제공할 수 있게 됩니다.

일상속 URI c://user/download

c://user/document/kakaoTalk/20240405_239481920

 

Bitmap

그래픽 이미지를 나타내는 클래스입니다. 안드로이드에서는 Bitmap 클래스를 사용하여 이미지 데이터를 처리하고 화면에 표시합니다.

안드로이드 공식문서 :Bitmap  |  Android Developers

Bitmap  |  Android Developers

Bitmap에 대한 간단한코드를 사용하자면:

그래픽 이미지를 나타내는 클래스입니다. 안드로이드에서는 Bitmap 클래스를 사용하여 이미지 데이터를 처리하고 화면에 표시합니다.

안드로이드 공식문서 :Bitmap  |  Android Developers

 

(출처:[안드로이드 스튜디오 정리#7-3] Bitmap :: 세민짱의 블로그 (tistory.com))

현재 저희가 사용할 코드는 몇개 없습니다.

setImageBitmap()은 이미지뷰를 지정된 BItmap값으로 변환하는 코딩입니다.

뒤에 Global.img as Bitmap이 붙은 경우는 현재 Global img가 uri 즉 String상태여서 변환을 시켜준겁니다.

예시코드(chatGpt)

 

drawabesourse를 통해 bitmap을 이용할 수 있습니다.

그것과 getBitmap()을 사용하였습니다. getBitmap은 URI를 Bitmap으로 변환시켜줍니다.

아래링크에서 구조만 참고하실 수 있습니다

How to get Bitmap from an Uri?

 

동그란 이미지 뷰 만들기

1. build.gradle dependencies 추가

implementation 'de.hdodenhof:circleimageview:3.1.0' //Circle ImageView

 

2. XML 추가

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/circle_iv"
        android:layout_width="10dp"
        android:layout_height="10dp"
        android:src="@drawable/test_img"
        />

 

이미 만들어졌다면 코드 상단에 있는 ImageView부분을 <de.hdodenhof.circleimageview.CircleImageView로 변경해주시면 됩니다

 

우선 이미지를 가져오려면 다음과 같은 동작을 연속적으로 해야합니다.

 

 

1. 버튼클릭

oncreate()생명주기 부분에

val profileButton = findViewById<Button>(R.id.profileButton)
profileButton.setOnClickListner{
	Gallery()
}

 

우선 setOnClickListner로 버튼 작동기능을 넣고 안에는 openGallery 함수를 넣어줄겁니다.

이 Gallery 함수는 onCreate에서 벗어나, private fun에 넣을겁니다.

갤러리를 불러오는 것을 onCreate에 넣어버리면 선택을 해서 갤러리가 열리는 게 아니라, 시작하자 마자 바로 갤러리가 시작되기 때문입니다.

 

2. 외부장소에서 이미지 가져오기(갤러리열기) + 이미지 선택

갤러리를 intent로 불러오기 전에 Mainfest에 갤러리를 열 수 있는 권한을 작성해줘야합니다

<uses-permisson android:name = "android.permission.READ_MEDIA_IMAGES"/>

그리고 난 다음에 갤러리를 여는 함수를 Gallery()에 넣어줄겁니다.

*OnCreate에서 벗어나고, private fun으로 따로 삽입을 하셔야합니다.

private fun Gallery(){
	val intent = Intent(Intent.ACTION_PICK, MediaStore.Images.Media.EXTERNAL_CONTENT_URI)
    intent.type = "image/*"
    startActivityForResult(intent, 1)
}

Intent를 이용해 갤러리를 열겁니다. Intent.ACTION_PICK 액션을 사용하면 다른 앱에서 이미지 또는 비디오를 선택할 수 있는 인터페이스가 표시됩니다. 여기에서 MediaStore.Images.Media.EXTERNAL_CONTENT_URI로 오게 됩니다.

intent.type을 이미지로 한번 걸러서, 완전히 이미지 타입만 들어오게 작성했습니다. 3번줄은 빠져도 무관합니다.

 

(intent, 1)에서 1은 사진 지정갯수 입니다. 프로필 사진만 불러올거기 때문에 1을 삽입했습니다.

 

일반파일/갤러리/이미지코드

 

안드로이드 스튜디오 공식문서에서 보면 아래내용을 확인할 수 있습니다.

공유 저장소 미디어 파일에 액세스  |  Android Developers

 

추가참고자료

 

 

미디어 저장소를 불러오는 형식인데 지금 저희가 불러올건 이미지라서

MediaStore.Images.Media.EXTERNAL_CONTENT_URI로 지정되있는 상태입니다.

EXTERNAL_CONTENT_URI는 외부 저장소에서 가져온 미디어입니다.

미디어저장소 → 이미지→ 미디어종류의 외부저장소에서 가져온 URI라고 완성이됩니다.

 

만일 다른 파일을 가져오고 싶다면 Image부분을 아래에 나와있는 것으로 변경하면 됩니다.

예시 - DCIM, Movies등등

 

 

 

 

3. 프로필 사진 적용 및 저장

안드로이드 생명주기 onCreate에서 벗어나 Result로 넘어올겁니다.
왜냐하면 onCreate 부분에서 이 코드를 작성하면 안됩니다. create에서 생성된 버튼을 눌렀을 시 갤러리를 intent로 넘어간 상태에서 다시 onCreate을 넘어오면 초기화가 되거나 오류가 발생하기 때문입니다. 그렇기 떄문에 onResult코드를 만들어 거기에 코드를 작성해야합니다.

 

사실 여기에서 Uri만 받아들여 이용이 가능하나, 데이터베이스로 넘어갈때 이상하게 트러블 슈팅이 심해 bitmap으로 변환을 한번 거쳐서 사용해야합니다.

override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivitiyResult(requestCode, resultCode, data)
    val select: Uri? = data?.data
    val image = MediaStore.Images.Media.getBitmap(contentResolver, select)
    
    Global.img = image //데이터베이스에 저장
    val profile = findViewById<ImageView>(R.id.userImage) //프로필에 사진 적용
    profile.setImageBitmap(image)
}

 

여기에서 DataClass를 따로 구축해야하는데, 거기에는 아래 코드만 삽입하면 됩니다.

팀원분께서 만들어주신 코딩입니다.

object Global {
  var img:Any? = null
}

 

 

4. 다른 Activity에서 선택된 이미지 사용

val ivUser = findViewById<ImageView>(profile)

if (Global.img != null) {
  ivUser.setImageBitmap(Global.img as Bitmap)
} else {
  ivUser.setImageResource(R.drawable.basic)
}

제가 여기에서 null 말고도 다양하게 처리를 해봤지만 Null이 가장 오류가 안나고 다른 앱 기능들과 부딪히지 않았습니다. Uri를 String으로 저장해서 isNullorEmpty()도 사용해봤는데 Stack이 유지가 안되고 계속해서 앱이 자동종료를 하게 됩니다.

setImageBitmap(global.img as Bitmap)으로 처리하면 저장된 데이터를 bitmap으로 불러올 수 있습니다. Bitmap으로 저장이 되었으니, Bitmap으로 불러오는 겁니다.

setImageURI, setImageView도 있습니다.

 

기본기능으로만 구현한거라서 현업에 사용하기에는 다소 무리가 있을 수 있습니다. 

 

이로서 마치겠습니다. 감사합니다.