Glide - 이미지 로드 라이브러리를 달아보자

 

 https://moonggi-dev-story.tistory.com/15

간단하게 RecyclerView 를 달아보자

해당 내용에 이어서 Glide 이미지 로드 라이브러리를 이용해 이미지 URL 가져와 적용을 간단하게 해보자.

---

1. 라이브러리 적용

   https://github.com/bumptech/glide

bumptech/glide

에서 gradle.build 내용을 가져와 적용한다.

dependencies
{
    implementation 'com.github.bumptech.glide:glide:4.11.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.11.0'
}

 

2. 퍼미션 추가 (인터넷 관련)

   * Oreo 버전 이후로는 http 인터넷 주소에 접근을 불허함 (https 만가능)
     Manifaest 에서 application 태그상에 android:usesClearTextTraffic = true 로 사용 해야함

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.recylcerviewproject">

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

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:usesCleartextTraffic="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>



3. 이미지 URL 정보 데이터 추가 (이전 블로그 내용에서 추가)

mList.add(Data("제목1","타이틀1","https://lh3.googleusercontent.com/proxy/9OvaTKXt1zImq1I5ArHW9uIeE7QYHEsdJjXfgDM-DUxO0OIfSH04kYgHy60e9fponW-hsoxjMEub7DZVLwdozop1IL9qB3a_l2WlYiYK8NdKERdLGON41NJv"))
mList.add(Data("제목2","타이틀2","https://newsimg.hankookilbo.com/cms/articlerelease/2020/04/13/202004131342724692_1.jpg"))
mList.add(Data("제목3","타이틀3","https://lh3.googleusercontent.com/proxy/A4fNR7qSSrmY78KGwxEUGgwROdqZpJyTMNbh9mSV1yicrIdhXW4nB-NHN07GFtyHEq0ZQB2Wni0_dA5993cfrEB6lXV-ql834gT4MTOws0TElgqrUSSWi6rtdW8G8dk"))
mList.add(Data("제목4","타이틀4","https://img4.yna.co.kr/photo/cms/2019/05/02/02/PCM20190502000402370_P2.jpg"))
mList.add(Data("제목5","타이틀5","https://img.seoul.co.kr/img/upload/2020/02/27/SSI_20200227142304_V.jpg"))

 

4. Glide 이미지뷰 적용

   imgeview 사용할때 Gilde.with~.load~.into 절만 추가하면 끝.

class ViewHolder (itemView: View? ) : RecyclerView.ViewHolder(itemView!!){

        val viewImg = itemView?.findViewById<ImageView>(R.id.imgUrl)
        val contentTxt = itemView?.findViewById<TextView>(R.id.contentTxt)
        val titleTxt  = itemView?.findViewById<TextView>(R.id.titleTxt)

        fun bind(itemData : Data? , context: Context){

            viewImg?.let { Glide.with(context).load(itemData!!.imgUrl).into(it) }
            contentTxt?.text = itemData!!.content
            titleTxt?.text = itemData!!.title
        }
    }

 

5. 결과 (👍)