Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone



Clound SSD Virtual Server

Android and Glide (Image Loader LIB:Library)

Android and Glide (Image Loader LIB:Library) สำหรับ Image Loader Library ตัวหนึ่งที่น่าสนใจคือ Glide โดย Library ตัวนี้คล้าย ๆ กับ Picasso มากกว่า 90% รูปแบบการเขียนก็แทบจะเหมือนกันทุกประการ วัตถุประสงค์ก็คือจัดการการแสดงผลรูปภาพแก้ไขปัญหา OutofMemory ช่วยให้การเขียนแสดงรูปภาพบน ImageView สะดวกสุด ๆ ความสามารถของ Glide สามารถอ้างถึงแหล่งของ Image Resource จากแหล่งต่าง ๆ ได้เช่น Drawable, Asset, Storage (SD card) , Internet URL สามารถแปลงเป็น Bitmap แล้วค่อยนำไปใช้งานได้ มีรูปแบบการใช้งานง่ายมาก โดยความสามารถเด่น ๆ ของมันที่เกี่ยวข้องคือ การทำแคชรูปภาพทั้งบน Disk Storage และ Memory , การ Resize ลดขนาดของภาพ ลด memory ที่ใช้ การทำงานได้อย่างรวดเร็ว และความสามารถที่สามารถใช้งานบนพวก Adapter เมื่อใช้งานร่วมกับ ListView , GridView ได้อย่างมีประสิทธิภาพ เพราะมีการ Re-use ภาพที่ได้โหลดมาแล้วให้โหลดต่อจากภาพเดิมไม่ให้โหลดภาพเดิมซ้ำ ๆ



Android and Glide


ส่วนข้อแตกต่างระหว่าง Glide กับ Picasso คือ Glide รองรับการทำงานทั้ง Context, Activity, Fragment และ FragmentActivity ความสามารถในการ Life-cycle จากการ Pause สามารถมา Resume เพื่อดาวน์โหลดต่อได้ สามารถโหลดรุปภาพได้เร็วมากกว่า Picasso แต่ระดับควาคมชัดตัว Picasso ยังสามารถทำได้ดีกว่า และสิ่งที่ Glide เหนือกว่า Picasso อีกข้อหนึ่งคือรองรับไฟล์ GIF ในรูปแบบของไฟล์เคลื่อนไหวได้

สำหรับตัวอย่างและ Code นี้รองรับการเขียนทั้งบนโปรแกรม Eclipse และ Android Studio

Download Glide


รุปแบบการเข้าถึง Resource จากแหล่งต่าง ๆ
Glide.with(context).load(ImageURI).into(imageView);
ImageURI คือ Image Resource เช่น Drawable, Asset, Storage (SD card) , Internet URL

Android and Glide

การติดตั้งสามารถดาวน์โหลดไฟล์ .JAR แล้วนำไป Import ลงใน Eclipse หรือ Android Studio

กรณีใช้บน Android Studio เพิ่ม build.gradle
compile 'com.github.bumptech.glide:glide:3.6.1'
compile 'com.android.support:support-v4:19.1.0'
อาจจะต้องตรวจสอบเวอร์ชั่นจากเว็บไซต์

ใน AndroidManifest.xml เพิ่ม Permission ดังนี้
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />


ขั้นตอนการเรียกใช้

Android and Glide

สร้าง Layout และ ImageView แบบง่าย ๆ

activity_main.xml
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="0.39"
        android:src="@drawable/ic_launcher" />

</TableLayout>









การเรียกรูปภาพจาก Resource
//*** Display Images
Glide.with(this).load(R.drawable.picture).into(imageView); // URIs from drawable


Code เต็ม ๆ
package com.myapp;

import android.os.Bundle;
import android.os.StrictMode;

import android.app.Activity;
import android.view.Menu;
import android.widget.ImageView;

public class MainActivity extends Activity {

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

        // Permission StrictMode
        if (android.os.Build.VERSION.SDK_INT > 9) {
            StrictMode.ThreadPolicy policy = new StrictMode.ThreadPolicy.Builder().permitAll().build();
            StrictMode.setThreadPolicy(policy);
        }
		
		// *** ImageView
		ImageView imageView = (ImageView) findViewById(R.id.imageView);
		 
		//*** Display Images
		Glide.with(this).load(R.drawable.picture).into(imageView); // URIs from drawable
		 
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}



Example 1 : การเรียก Image Resource จาก drawable

Android and Glide

		// *** ImageView
		ImageView imageView = (ImageView) findViewById(R.id.imageView);
		 
		//*** Display Images
		Glide.with(this).load(R.drawable.picture).into(imageView); // URIs from drawable

Android and Glide



Example 2 : การเรียก Image Resource จาก Asset

Android and Glide

		// *** ImageView
		ImageView imageView = (ImageView) findViewById(R.id.imageView);
		 
		//*** Display Images
		Glide.with(this).load("file:///android_asset/picture.jpg").into(imageView); // URIs from asset

Android and Glide








Example 3 : การเรียก Image Resource จาก SD Card

Android and Glide

		// *** ImageView
		ImageView imageView = (ImageView) findViewById(R.id.imageView);
		 
		//*** Display Images	
		String SDPath = "/storage/sdcard0/mypicture/picture.jpg"; // URIs from SD card
		Glide.with(this).load(new File(SDPath)).into(imageView);


หรือ
		// *** ImageView
		ImageView imageView = (ImageView) findViewById(R.id.imageView);
		 
		//*** Display Images	
		String SDPath = Environment.getExternalStorageDirectory() + "/mypicture/picture.jpg"; // URIs from SD card
		Glide.with(this).load(new File(SDPath)).into(imageView);

Android and Glide



Example 4 : การเรียก Image Resource จาก HTTP (Internet)

Android and Glide

       
		// *** ImageView
		ImageView imageView = (ImageView) findViewById(R.id.imageView);
		 
		//*** Display Images	
		Glide.with(this).load("https://www.thaicreate.com/mypicture/picture.jpg").into(imageView); // URIs from URL

Android and Glide



Example 5 : การ Resize ลดขนาดของภาพให้มีขนาดตามต้องการ

		// *** ImageView
		ImageView imageView = (ImageView) findViewById(R.id.imageView);

		//*** Display Images
		Glide.with(this)
		  .load("https://www.thaicreate.com/mypicture/picture.jpg")
		  .override(50, 50)
		  .centerCrop()
		  .into(imageView);

Android and Glide



Example 6 : การกำหนด placeholder และ error ในช่วงระหว่างรอโหลดและกรณีที่เกิดข้อผิดพลาด

		// *** ImageView
		ImageView imageView = (ImageView) findViewById(R.id.imageView);

		//*** Display Images
		Glide.with(this)
		  .load("https://www.thaicreate.com/mypicture/picture.jpg")
		  .placeholder(R.drawable.user_placeholder)
		  .error(R.drawable.user_placeholder_error)
		  .into(imageView);




Example 7 : การใช่ร่วมกับ Adapter ในส่วนของ getView เช่น ListView , GridView

// For a simple image list:
@Override
public View getView(int position, View recycled, ViewGroup container) {
    final ImageView myImageView;
    if (recycled == null) {
        myImageView = (ImageView) inflater.inflate(R.layout.my_image_view, container, false);
    } else {
        myImageView = (ImageView) recycled;
    }

    String url = myUrls.get(position);

    Glide.with(myFragment)
        .load(url)
        .centerCrop()
        .placeholder(R.drawable.loading_spinner)
        .crossFade()
        .into(myImageView);

    return myImageView;
}


จากตัวอย่างจะเห็นว่าการใช้งาน Glide ช่วยให้การจัดการกับ Image นั้นง่ายและสะดวกมาก อีกทั้งยังได้มาพร้อมกับประสิทธิภาพของภาพทั้งความคมชัด ประหยัด memory ได้ความรวดเร็วกในการโหลดข้อมูล

   
Share


ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท


ลองใช้ค้นหาข้อมูล


   


Bookmark.   
       
  By : ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ)
  Score Rating :  
  Create/Update Date : 2015-11-22 12:59:00 / 2017-03-26 21:28:06
  Download : No files
 Sponsored Links / Related

 
Android and Universal Image Loader (Image Loader LIB:Library)
Rating :

 
Android and Picasso (Image Loader LIB:Library)
Rating :


ThaiCreate.Com Forum


Comunity Forum Free Web Script
Jobs Freelance Free Uploads
Free Web Hosting Free Tools

สอน PHP ผ่าน Youtube ฟรี
สอน Android การเขียนโปรแกรม Android
สอน Windows Phone การเขียนโปรแกรม Windows Phone 7 และ 8
สอน iOS การเขียนโปรแกรม iPhone, iPad
สอน Java การเขียนโปรแกรม ภาษา Java
สอน Java GUI การเขียนโปรแกรม ภาษา Java GUI
สอน JSP การเขียนโปรแกรม ภาษา Java
สอน jQuery การเขียนโปรแกรม ภาษา jQuery
สอน .Net การเขียนโปรแกรม ภาษา .Net
Free Tutorial
สอน Google Maps Api
สอน Windows Service
สอน Entity Framework
สอน Android
สอน Java เขียน Java
Java GUI Swing
สอน JSP (Web App)
iOS (iPhone,iPad)
Windows Phone
Windows Azure
Windows Store
Laravel Framework
Yii PHP Framework
สอน jQuery
สอน jQuery กับ Ajax
สอน PHP OOP (Vdo)
Ajax Tutorials
SQL Tutorials
สอน SQL (Part 2)
JavaScript Tutorial
Javascript Tips
VBScript Tutorial
VBScript Validation
Microsoft Access
MySQL Tutorials
-- Stored Procedure
MariaDB Database
SQL Server Tutorial
SQL Server 2005
SQL Server 2008
SQL Server 2012
-- Stored Procedure
Oracle Database
-- Stored Procedure
SVN (Subversion)
แนวทางการทำ SEO
ปรับแต่งเว็บให้โหลดเร็ว


Hit Link
   







Load balance : Server 04
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่