Use the open-source framework Fresco in Android to process images,

Source: Internet
Author: User
Tags webp

Use the open-source framework Fresco in Android to process images,

This article is original blog, reproduced please indicate the original link: http://www.cnblogs.com/panhouye/p/6278116.html

For the advantages of Fresco, Google is preferred. It is too strong and too good. I cannot accommodate this blog. Today I will give you a brief introduction to the use of Fresco and some attributes.

Fresco is a powerful image loading component. After using it, you don't need to worry about loading and displaying images! Android and later versions are supported.

This article is original blog, reproduced please indicate the original link: http://www.cnblogs.com/panhouye/p/6278116.html

The official website details some features of Fresco. For the first time, I was shocked. Https://www.fresco-cn.org/

2016 Fresco's latest source code analysis: https://github.com/desmond1121/Fresco-Source-Analysis

Comparison with other common image cache frameworks

(1) Volley provides a new control NetworkImageView to replace the traditional ImageView. If your project is a relatively small project, or the requirement is not high, this library can be used for simple processing. It is an open-source Library released by Google 2013 I/O. Using this library for image processing does not provide any image processing operations, so it can be used for fine-grained data connections.

(2) Universal-Image-Loader is an early Image cache component, which has been praised by developers and used in many old applications.

(3) Picasso and Glide, without doubt Glide wins

(4) Fresco, as a rookie, is very prominent in terms of Memory Management (three-level cache), progressive rendering of images, loading of Gif images and Webp images. (Also my favorite)

Common basic attributes involved

(1) layout_width and layout_height do not support warp_Content, but you can set the aspect ratio through setAspectRetio ();

(2) fadeDuration () fade out time;

(3) actualImageScaleType sets image scaling. foucscdrop is usually used. This attribute value uses an algorithm to place the portrait in the middle.

(4) placeholderImage: placeholderImageScaleType

(5) faiturelmagescateType

(6) retrylmage loading failed, prompting the user to click retrylmagescateType

(7) progressBarImage indicates that the user is loading and has nothing to do with the progress. progressBarlmagescateType

(8) interval between automatic rotation of the progressBarAutoRotateInterval Image

(9) backgroundImage background

(10) overlayImage stacked Graph

(11) stacked image when pressedStateOverlayImage is pressed

(12) Whether roundAsCircle involves circles

(13) roundedCornerRadius rounded corner

(14) roundTopLeft, roundTopRight ..... Set the four corners and different radius respectively. After the value is set to true, you can set the angle using the setConnersRadii () method of RoundingParams in the code.

(15) Overlapping color of the roundWithOverlayColor border

(16) roundingBorderWidth Border Width

(17) roundingBorderColor border color

The following is a simple demonstration of how to use Fresco to load network images:

The demo effect is as follows (You guessed it, and you have your own yuzhao ):

Step 1: import dependency packages

Similar to the previous android-image-indicator-master project, AndroidStudio2.2 is still used this time. Add the following code directly under dependencies in build. gradle:

1 compile 'com.facebook.fresco:fresco:0.12.0'

You can also add the following dependencies based on your project requirements:

1 dependencies {2 // 3 compile 'com. facebook. fresco: animated-base-support: 0.12.0 '4 // supports GIF animations. You need to add 5 compile 'com. facebook. fresco: animated-gif: 0.12.0 '6 // supports WebP (static graph + animation). You need to add 7 compile 'com. facebook. fresco: animated-webp: 0.12.0 '8 compile 'com. facebook. fresco: webpsupport: 0.12.0 '9 // only supports WebP static graphs. You need to add 10 compile 'com. facebook. fresco: webpsupport: 0.12.0 '11}
Step 2: Add network Permissions

Because network images are loaded, you must add network permissions in the AndroidManifest. xml configuration file:

1 <uses-permission android:name="android.permission.INTERNET"/>
Step 3: Initialize the Fresco class

Before loading an image, you must initialize the Fresco class. You only need to call Fresco. initialize once to complete initialization. The following describes how to call the initialization method in MainActivity and Application respectively.

(1) initialize the Application call (recommended)

1 [MyApplication.java]2 public class MyApplication extends Application {3     @Override4     public void onCreate() {5         super.onCreate();6         Fresco.initialize(this);7     }8 }

After completing the preceding work, you must specify the Application class in AndroidManifest. xml.

(2) Call initialization in MainActivity

It should be noted that initialization is required before setContentView.

1 package com. mly. panhouye. frescodemo; 2 import android. OS. bundle; 3 import android. support. v7.app. appCompatActivity; 4 import com. facebook. drawee. backends. pipeline. fresco; 5 public class MainActivity extends AppCompatActivity {6 @ Override 7 protected void onCreate (Bundle savedInstanceState) {8 super. onCreate (savedInstanceState); 9 Fresco. initialize (this); // You Need to initialize 10 setContentView (R. layout. activity_main); 11} 12}
Step 4: layout xml layout File

Before layout, add a namespace to the xml file.

1 xmlns:fresco="http://schemas.android.com/apk/res-auto"

To implement the Circular image and border line in the demo effect, you only need to add three lines of code (for the attribute function, see the previous article ):

1 fresco:roundAsCircle="true"2  fresco:roundingBorderWidth="3dp"3  fresco:roundingBorderColor="@color/colorAccent"

The specific layout file is as follows. In this demonstration, click the start image to load and use SimpleDraweeView (Note: layout_width/height does not support wrap_content ):

1 <? Xml version = "1.0" encoding = "UTF-8"?> 2 <RelativeLayout xmlns: android = "http://schemas.android.com/apk/res/android" 3 xmlns: tools = "http://schemas.android.com/tools" 4 xmlns: fresco = "http://schemas.android.com/apk/res-auto" 5 android: id = "@ + id/activity_main" 6 android: layout_width = "match_parent" 7 android: layout_height = "match_parent" 8 tools: context = "com. mly. panhouye. frescodemo. mainActivity "> 9 <Button10 android: layout_width =" wrap_content "11 android: layout_height =" wrap_content "12 android: layout_below =" @ + id/my_image_view "13 android: layout_centerHorizontal = "true" 14 android: text = "loading network images" 15 android: onClick = "loadInternetImage" 16 android: layout_marginTop = "12dp" 17 android: id = "@ + id/button"/> 18 <com. facebook. drawee. view. simpleDraweeView19 android: id = "@ + id/my_image_view" 20 android: layout_width = "400dp" 21 android: layout_height = "400dp" 22 fresco: placeholderImage = "@ mipmap/ic_launcher" 23 android: layout_alignParentTop = "true" 24 android: layout_centerHorizontal = "true"/> 25 </RelativeLayout>
Step 5: java implementation code
1 package com. mly. panhouye. frescodemo; 2 import android.net. uri; 3 import android. OS. bundle; 4 import android. support. v7.app. appCompatActivity; 5 import android. view. view; 6 import com. facebook. drawee. backends. pipeline. fresco; 7 import com. facebook. drawee. view. simpleDraweeView; 8 public class MainActivity extends AppCompatActivity {9 @ Override10 protected void onCreate (Bundle savedInstanceState ){ 11 super. onCreate (savedInstanceState); 12 Fresco. initialize (this); // You Need to initialize 13 setContentView (R. layout. activity_main); 14} 15 // click the event to load the network image code 16 public void loadInternetImage (View view) {17 Uri uri = Uri. parse ("http://r.photo.store.qq.com/psb? /V12kkHqD1CWRD4/meykwt0nxu0stibfzfjwd7ajksdet6k1. Vaqmq2vps! /R/dKMAAAAAAAAA "); 18 SimpleDraweeView draweeView = (SimpleDraweeView) findViewById (R. id. my_image_view); 19 draweeView. setImageURI (uri); 20} 21}

For the rest, Fresco will do it for you, for example, displaying the bitmap until it is loaded, downloading the image, caching the image, removing the image from the memory when it is no longer displayed, and so on.

After reading this article, you can combine my previous profile picture settings blog, "set a user profile by accessing a local album or camera in Android". Let's try it.

This article only introduces Fresco's most basic usage methods. You can visit the official website to try other functions.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.