[ANDROID] โหลดรูปง่ายๆ แค่พลิกฝ่ามือ ด้วยศิลปินอัจฉริยะ Picasso


สวัสดีชาว Android
          วันนี้ผมจะมาพูดถึง Android Library ตัวหนึ่งที่มีความสามารถช่วยในการโหลดรูป และ ทำการ cache รูปให้เราด้วยโค้ดสั้นๆ ง่ายๆ ซึ่งหากพูดถึง Android library ที่ช่วยในการโหลดรูปก็คงจะไม่มีใครไม่รู้จัก Android library ที่ชื่อว่า Picasso นั่นเอง
          แต่สำหรับนักพัฒนาที่ยังไม่เคยรู้จักหรือเคยได้ยินก็อาจจะเกิดเกิดคำถามว่า มันง่ายจริงๆหรอ? โม้หรือเปล่า? เอาเป็นว่าเรามาดูโค้ดกันเลยดีกว่า
Picasso.with(context).load("URL ของรูป").into(imageView);
จากโค้ดด้านบน คือ การโหลดรูปจาก URL ที่ต้องการมาแสดงที่ ImageView บน Android นั่นเอง เห็นไหมละครับว่าง่ายมั่กๆ ไม่ได้โม้

มาดูวิธีใช้กันดีกว่า

สิ่งที่จะขาดไม่ได้เลยก็ คือ เพิ่ม dependencies ใน build.gradle ครับ
compile 'com.squareup.picasso:picasso:2.5.2'
วิธีใช้งานเบื้องต้นก็ตามโค้ดด้านบนที่ยกตัวอย่างเลย หรือ ใครอยากจะเอาไปใช้โหลดรูปใน Adapter ก็ยังได้
@Override
public void getView(int position, View convertView, ViewGroup parent) {
  SquaredImageView view = (SquaredImageView) convertView;
  if (view == null) {
    view = new SquaredImageView(context);
  }
  String url = getItem(position);

  Picasso.with(context).load(url).into(view);
}
บร๊ะ!! ง่ายแท้ แต่เดี๋ยวก่อนนนนนน ยังไม่หมดเท่านั้นนะครับ เราสามารถ resize รูปได้อีกด้วย ทำยังไงหละ ?? อยากรู้ต้องตามไปดู ....
Picasso.with(context)
  .load(url)
  .resize(50, 50)
  .centerCrop()
  .into(imageView);
อีกอย่างหนึ่งที่ผมชอบเลย คือ สามารถใส่ placeholder(แสดงรูปก่อนโหลด) กับ error(แสดงรูปถ้าหากโหลดรูปไม่สำเร็จ) ได้ด้วย
Picasso.with(context)
    .load(url)
    .placeholder(R.drawable.user_placeholder)
    .error(R.drawable.user_placeholder_error)
    .into(imageView);;
จะเห็นได้ว่า นอกจากจะสามารถโหลดรูปจาก URL ได้แล้ว ยังสามารถโหลดรูปจาก resource ได้อีกต่างหากนะครับ อะไรจะดีขนาดนั้นนนนน
Picasso.with(context).load(R.drawable.landing_screen).into(imageView1);
Picasso.with(context).load("file:///android_asset/DvpvklR.png").into(imageView2);
Picasso.with(context).load(new File(...)).into(imageView3);

ซึ่งจริงๆ แล้วความสามารถของ Picasso ยังไม่หมดเพียงเท่านี้นะครับ ยังมีการแสดงง Debug Indicator, การ Transform รูป และการจัดการกับ Cache เป็นต้น หากสนใจสามารถเข้าไปดูรายละเอียดเพิ่มเติมได้ที่ลิงค์อ้างอิงข้างล่างบทความได้เลยครับ :)

ก่อนจะลากันในวันนี้ขอแนะนำบทความของ พี่เนย เรื่อง ทำความรู้จัก Glide ไลบรารี่โหลดภาพคู่แข่ง Picasso ที่กูเกิ้ลแนะนำให้ใช้ มีดีอย่างไรมาดูกัน! ภายในบทความจะเป็นการเปรียบเทียบกันหมัดต่อหมัด ระหว่าง Library 2 คือ Glide และ Picasso ซึ่งเป็น library ที่ช่วยในการโหลดรูปนั่นเองครับ .... อยากจะบอกว่าละเอียดยิบยิ่งกว่าบทความของผมด้านบนเสียอีก แนะนำเลยว่าต้องอ่านครับ!!

สำหรับวันนี้ลาไปก่อน สวัสดีครับ

ลิงค์อ้างอิง

Picasso : http://square.github.io/picasso/
พี่เนย : ทำความรู้จัก Glide ไลบรารี่โหลดภาพคู่แข่ง Picasso ที่กูเกิ้ลแนะนำให้ใช้ มีดีอย่างไรมาดูกัน!

Teeranai P

Developer ตัวน้อยๆ ที่หลงใหลในโลกของการพัฒนา Software. รักการเขียนโปรแกรมเป็นอันดับ 2 รองลงมาจากการนอน