๊ด€๋ฆฌ ๋ฉ”๋‰ด

ruriruriya

[Android] ์•ˆ๋“œ๋กœ์ด๋“œ - ์ด๋ฏธ์ง€ ์ฒ˜๋ฆฌ๋ฅผ ์œ„ํ•œ Glide ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์‚ฌ์šฉ๋ฒ• ๋ณธ๋ฌธ

๐Ÿค–Android

[Android] ์•ˆ๋“œ๋กœ์ด๋“œ - ์ด๋ฏธ์ง€ ์ฒ˜๋ฆฌ๋ฅผ ์œ„ํ•œ Glide ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์‚ฌ์šฉ๋ฒ•

๋ฃจ๋ฆฌ์•ผใ…‘ 2024. 1. 3. 00:20
๋ฐ˜์‘ํ˜•

Glide๋Š” ์•ˆ๋“œ๋กœ์ด๋“œ ์•ฑ์—์„œ ์ด๋ฏธ์ง€ ๋กœ๋”ฉ๊ณผ ๋””์Šคํ”Œ๋ ˆ์ด๋ฅผ ์œ„ํ•œ ๊ฐ•๋ ฅํ•œ ์˜คํ”ˆ ์†Œ์Šค ์ด๋ฏธ์ง€ ๋กœ๋”ฉ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ด๋‹ค. ์ด ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋Š” ๋†’์€ ์„ฑ๋Šฅ๊ณผ ์œ ์—ฐ์„ฑ์„ ์ œ๊ณตํ•˜์—ฌ ์•ˆ์ •์ ์œผ๋กœ ์ด๋ฏธ์ง€๋ฅผ ๋กœ๋“œํ•˜๊ณ  ํ‘œ์‹œํ•  ์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ค€๋‹ค.

 

ํŠน์ง•

  • ์ž๋™ ๋ฉ”๋ชจ๋ฆฌ ๋ฐ ๋””์Šคํฌ ์บ์‹ฑ: Glide๋Š” ์ด๋ฏธ์ง€๋ฅผ ์ž๋™์œผ๋กœ ๋ฉ”๋ชจ๋ฆฌ์™€ ๋””์Šคํฌ์— ์บ์‹ฑํ•˜์—ฌ ๋ฐ˜๋ณต์ ์ธ ๋‹ค์šด๋กœ๋“œ๋ฅผ ๋ฐฉ์ง€ํ•˜๊ณ  ์•ฑ ์„ฑ๋Šฅ์„ ํ–ฅ์ƒ์‹œํ‚จ๋‹ค.
  • ์œ ์—ฐํ•œ API: ๊ฐ„๋‹จํ•œ ์ฝ”๋“œ๋กœ ์ด๋ฏธ์ง€ ๋กœ๋”ฉ์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ํ•„์š”์— ๋”ฐ๋ผ ํฌ๊ธฐ ์กฐ์ •, ๋ณ€ํ™˜ ๋ฐ ์• ๋‹ˆ๋ฉ”์ด์…˜ ํšจ๊ณผ๋ฅผ ์‰ฝ๊ฒŒ ์ ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.
  • ๋กœ๋”ฉ ๋ฐ ์—๋Ÿฌ ์ด๋ฏธ์ง€ ์„ค์ •: ์ด๋ฏธ์ง€๊ฐ€ ๋กœ๋”ฉ๋˜๋Š” ๋™์•ˆ ๋ณด์—ฌ์งˆ placeholder ์ด๋ฏธ์ง€์™€ ์ด๋ฏธ์ง€ ๋กœ๋”ฉ ์‹คํŒจ ์‹œ ๋ณด์—ฌ์งˆ ์—๋Ÿฌ ์ด๋ฏธ์ง€๋ฅผ ์„ค์ •ํ•  ์ˆ˜ ์žˆ๋‹ค.
  • ์ด๋ฏธ์ง€ ๋ณ€ํ™˜ ๊ธฐ๋Šฅ: ์ด๋ฏธ์ง€ ํฌ๊ธฐ ์กฐ์ •, ํšŒ์ „, ์ž๋ฅด๊ธฐ, ํ•„ํ„ฐ๋ง ๋“ฑ ๋‹ค์–‘ํ•œ ์ด๋ฏธ์ง€ ๋ณ€ํ™˜ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•œ๋‹ค.
  • ๋ฆฌ์†Œ์Šค ์œ ํ˜• ์ง€์›: ์ธํ„ฐ๋„ท์—์„œ ์ด๋ฏธ์ง€๋ฅผ ๊ฐ€์ ธ์˜ค๋Š” ๊ฒƒ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ๋กœ์ปฌ ํŒŒ์ผ, ๋ฆฌ์†Œ์Šค, ๋น„๋””์˜ค ํ”„๋ ˆ์ž„ ๋ฐ ๋น„๋””์˜ค ์Šคํ‹ธ์—์„œ๋„ ์ด๋ฏธ์ง€๋ฅผ ๋กœ๋“œํ•  ์ˆ˜ ์žˆ๋‹ค.
  • ๋ผ์ด๋ธŒ ์‚ฌ์ดํด ๊ด€๋ฆฌ: ์•กํ‹ฐ๋น„ํ‹ฐ ๋ฐ ํ”„๋ž˜๊ทธ๋จผํŠธ์˜ ๋ผ์ดํ”„์‚ฌ์ดํด์„ ๊ณ ๋ คํ•˜์—ฌ ๋ฉ”๋ชจ๋ฆฌ ๋ˆ„์ˆ˜๋ฅผ ๋ฐฉ์ง€ํ•˜๊ณ  ์ž๋™์œผ๋กœ ์ด๋ฏธ์ง€ ๋กœ๋”ฉ์„ ๊ด€๋ฆฌํ•œ๋‹ค.
  • ์• ๋‹ˆ๋ฉ”์ด์…˜ ๋ฐ ๋ณ€ํ™˜ ์ง€์›: GIF ์ง€์›๊ณผ ํ•จ๊ป˜ ์ด๋ฏธ์ง€ ๋กœ๋”ฉ ๋ฐ ๋””์Šคํ”Œ๋ ˆ์ด ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ๋‹ค.

 

1. Gradle์— Glide ์ถ”๊ฐ€

build.gradle ํŒŒ์ผ์— Glide ์˜์กด์„ฑ์„ ์ถ”๊ฐ€ํ•œ๋‹ค.

dependencies {
    implementation ("com.github.bumptech.glide:glide:4.16.0")
}

 

2. ๊ถŒํ•œ ์ถ”๊ฐ€

AndroidManifest.xml ํŒŒ์ผ์— ์ธํ„ฐ๋„ท ๊ถŒํ•œ์„ ์ถ”๊ฐ€ํ•œ๋‹ค.

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

 

3. java ํŒŒ์ผ์—์„œ Glide ์‚ฌ์šฉ

์ด๋ฏธ์ง€๋ฅผ ๋กœ๋“œํ•˜๊ณ  ํ‘œ์‹œํ•˜๋ ค๋Š” ํ™œ๋™(์˜ˆ: MainActivity)์—์„œ Glide๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.

- ํ™”๋ฉด ์„ค๊ณ„ 

xml์—์„œ ์ด๋ฏธ์ง€๋ทฐ๋ฅผ ๋‚˜์—ดํ•œ๋‹ค.

- java ํŒŒ์ผ ํ™”๋ฉด ์—ฐ๊ฒฐ

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

    ImageView img1;
    ImageView img2;
    ImageView img3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        img1 = findViewById(R.id.img1);
        img2 = findViewById(R.id.img2);
        img3 = findViewById(R.id.img3);
    }
}

 

- Glide ์‚ฌ์šฉ

์™ธ๋ถ€ ์ด๋ฏธ์ง€ url ๋กœ ์ด๋ฏธ์ง€ ๊ฐ€์ ธ์˜ค๊ธฐ

๋จผ์ € ๋งด๋ฒ„๋ณ€์ˆ˜๋กœ ์ด๋ฏธ์ง€ url ์ƒ์ˆ˜ ์„ค์ •

final String imgUrl1 ="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTt6KIqXYTyQGGbIDGbtpI80L8B5eWmhdXaKw8C4kPk1nikU8M7Uv3GFPvQlh1g8V3iMQI&usqp=CAU";
final String imgUrl2 ="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQD8RWFWhKDJDWDg4ko0nwf5wapVU-FIh5jo3qBE2075KNPXVpDL1_wCSi4puPlmHqV94I&usqp=CAU";
final String imgUrl3 ="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTPoAukyCCpbuaMBGJwy8GpkcD4ISM6Xmz8jQ&usqp=CAU";

 

onCreate์—์„œ Glide๋กœ ์ด๋ฏธ์ง€ ๋ถˆ๋Ÿฌ์˜ค๊ธฐ

protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        img1 = findViewById(R.id.img1);
        img2 = findViewById(R.id.img2);
        img3 = findViewById(R.id.img3);

        Glide.with(MainActivity.this).load(imgUrl1).into(img1);
        Glide.with(MainActivity.this).load(imgUrl2).into(img2);
        Glide.with(MainActivity.this).load(imgUrl3).into(img3);
    }

 

4. ์ตœ์ข… ์ฝ”๋“œ/ ํ™”๋ฉด

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ImageView;

import com.bumptech.glide.Glide;

public class MainActivity extends AppCompatActivity {

    ImageView img1;
    ImageView img2;
    ImageView img3;

    // ์ƒ์ˆ˜ ๋ฐ”๊ฟ€ ์ˆ˜ ์—†๋Š” ์ˆซ์ž
    final String imgUrl1 ="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTt6KIqXYTyQGGbIDGbtpI80L8B5eWmhdXaKw8C4kPk1nikU8M7Uv3GFPvQlh1g8V3iMQI&usqp=CAU";
    final String imgUrl2 ="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQD8RWFWhKDJDWDg4ko0nwf5wapVU-FIh5jo3qBE2075KNPXVpDL1_wCSi4puPlmHqV94I&usqp=CAU";
    final String imgUrl3 ="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTPoAukyCCpbuaMBGJwy8GpkcD4ISM6Xmz8jQ&usqp=CAU";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        img1 = findViewById(R.id.img1);
        img2 = findViewById(R.id.img2);
        img3 = findViewById(R.id.img3);

        Glide.with(MainActivity.this).load(imgUrl1).into(img1);
        Glide.with(MainActivity.this).load(imgUrl2).into(img2);
        Glide.with(MainActivity.this).load(imgUrl3).into(img3);
    }
}
Glide ์‚ฌ์šฉ ์ „ / ํ›„
๋ฐ˜์‘ํ˜•