본문 바로가기
programming/Android

[안드로이드/Kotlin] 인스타그램 클론코딩 - 2 (게시물 업로드, 프로필사진 등록)

by 몽구스_ 2021. 5. 27.
728x90

 

게시물 업로드하기

 

사진 업로드 방법은 두가지가 있다.

나는 첫번째 방법으로 했다.

//방법1.구글 권장
    fun contentUpload(){
        var timestamp = SimpleDateFormat("yyyyMMdd_HHmmss").format(Date())
        var imageFileName = "IMAGE_" + timestamp + "_.png"

        var storageRef = storage?.reference?.child("images")?.child(imageFileName)

        storageRef?.putFile(photoUri!!)?.continueWithTask{ task: Task<UploadTask.TaskSnapshot> ->
            return@continueWithTask storageRef.downloadUrl
        }?.addOnSuccessListener { uri ->
            var contentDTO = ContentDTO()

            contentDTO.imageUrl = uri.toString()
            contentDTO.uid = auth?.currentUser?.uid
            contentDTO.userId = auth?.currentUser?.email
            contentDTO.exlain = addphoto_edit_explain.text.toString()
            contentDTO.timestamp = System.currentTimeMillis()

            firestore?.collection("images")?.add(contentDTO)

            setResult(Activity.RESULT_OK)

            finish()
        }
//방법2.Callback method
//        storageRef?.putFile(photoUri!!)?.addOnSuccessListener {
//            storageRef.downloadUrl.addOnSuccessListener { uri ->
//                var contentDTO = ContentDTO()
//
//                contentDTO.imageUrl = uri.toString()
//                contentDTO.uid = auth?.currentUser?.uid
//                contentDTO.userId = auth?.currentUser?.email
//                contentDTO.exlain = addphoto_edit_explain.text.toString()
//                contentDTO.timestamp = System.currentTimeMillis()
//
//                firestore?.collection("images")?.document()?.set(contentDTO)
//
//                setResult(Activity.RESULT_OK)
//
//                finish()
//            }
//        }

ContentDTO 모델을 만들어주고 Firebase에 저장해준다.

 

 

Firebase > Firestore Database > images 에서 저장된 사진을 확인할 수 있다.

그밑에 profileImages는 프로필 사진이다.

 

 

 

 

프로필 사진 설정하기

프로필 사진 변경은 프로필 부분을 클릭하면 바로 앨범이 나오게 했다.

ACTION_PICK이 앨범을 띄워준다.

 

fragmentView?.account_iv_profile?.setOnClickListener{
            var photoPickerIntent = Intent(Intent.ACTION_PICK)
            photoPickerIntent.type = "image/*"
            activity?.startActivityForResult(photoPickerIntent, PICK_PROFILE_FROM_ALBUM)
        }

 

 

선택한 프로필사진이 나오게 하는 방법은 이 메소드이다.

fun getProfileImage(){
        firestore?.collection("profileImages")?.document(uid!!)?.addSnapshotListener{
            documentSnapshot, firebaseFirestoreException ->
            if(documentSnapshot == null) return@addSnapshotListener
            if(documentSnapshot.data != null){
                var url = documentSnapshot?.data!!["image"]
                Glide.with(activity!!).load(url).apply(RequestOptions().circleCrop()).into(fragmentView?.account_iv_profile!!)
            }
        }
    }

 

이를 활용하여 홈 화면에서도 사진과 올린 사람의 프로필 사진을 보여주었다.

하다보면 코드가 반복된다는 것을 알 수 있다.

 

 

 

홈화면 게시글에 프로필 사진 띄우기

 

 

//사용자아이디
viewHolder.detailviewitem_profile_tv.text = contentDTOs!![position].userId

//올린 이미지
Glide.with(holder.itemView.context).load(contentDTOs!![position].imageUrl).into(viewHolder.detailviewitem_imageview_content)

//사진 설명(게시글 내용)
viewHolder.detailviewitem_explain_tv.text = contentDTOs!![position].exlain

//좋아요 수
viewHolder.detailviewitem_favoritecounter_tv.text = "Likes " + contentDTOs!![position].favoriteCount

//프로필이미지
firestore?.collection("profileImages")?.document(contentDTOs!![position].uid!!)?.addSnapshotListener{
    documentSnapshot, firebaseFirestoreException ->
    if(documentSnapshot == null) return@addSnapshotListener
    if(documentSnapshot.data != null){
        var url = documentSnapshot?.data!!["image"]
        Glide.with(holder.itemView.context).load(url).apply(RequestOptions().circleCrop()).into(viewHolder.detailviewitem_profile_image)
    }
}

firestore?.collection으로 지정해주고 contentDTOs!![position].uid!!을 사용한다.

UserFragment 에서 프로필 사진을 보여주는 getProfileImage() 부분을 응용하면 된다.

 

 

 

 



인스타그램 클론코딩 - 1 (로그인)

https://it-mongoose.tistory.com/103


 

댓글