Introduction of the Facebook’s Fresco

Transcript

1. Introduction of the Facebook’s Fresco CyberAgent, Inc. ߱໼ େ஍

2. About Me wasabeef @wasabeef_jp

3. About Fresco • Image Manager • Streaming • Animations •

   Drawing • Loading

4. Quick Start

5. Adding Fresco to your Project dependencies { // your app's

   other dependencies compile 'com.facebook.fresco:fresco:0.2.0+' }

6. Adding Fresco to your Project public class MainApplication extends Application

   { ! @Override public void onCreate() { super.onCreate(); Fresco.initialize(this); } }

7. Adding Fresco to your Project <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> !

   <com.facebook.drawee.view.SimpleDraweeView android:id="@+id/image" android:layout_width="300dp" android:layout_height="300dp"/> ! </RelativeLayout>

8. Adding Fresco to your Project public class MainActivity extends ActionBarActivity

   { ! @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ! SimpleDraweeView drawee = (SimpleDraweeView) findViewById(R.id.image); ! Uri uri = Uri.parse(“http://bit.ly/1PDoTv2"); drawee.setImageURI(uri); } }

9. Supported URIs 5ZQF 4DIFNF 'FUDI
   NFUIPE
   VTFE 'JMF
   PO
   OFUXPSL http://, https:// HttpURLConnection or

   network layer 'JMF
   PO
   EFWJDF pMF 'JMF*OQVU4USFBN $POUFOU
   QSPWJEFS DPOUFOU $POUFOU3FTPMWFS "TTFU
   JO
   BQQ BTTFU "TTFU.BOBHFS 3FTPVSDF
   JO
   BQQ SFT 3FTPVSDFTPQFO3BX3FTPVSDF

10. Concepts • DraweeView • DraweeHierarchy • DraweeController • The Image

    Pipeline

11. Drawee Guide

12. Using Drawees in XML <com.facebook.drawee.view.SimpleDraweeView android:id="@+id/my_image_view" android:layout_width="20dp" android:layout_height="20dp" fresco:fadeDuration="300" fresco:actualImageScaleType="focusCrop"

    fresco:placeholderImage="@color/wait_color" fresco:placeholderImageScaleType="fitCenter" fresco:failureImage="@drawable/error" fresco:failureImageScaleType="centerInside" fresco:retryImage="@drawable/retrying" fresco:retryImageScaleType="centerCrop" fresco:progressBarImage="@drawable/progress_bar" fresco:progressBarImageScaleType="centerInside" fresco:progressBarAutoRotateInterval="1000" fresco:backgroundImage="@color/blue" fresco:overlayImage="@drawable/watermark" fresco:pressedStateOverlayImage="@color/red" fresco:roundAsCircle="false" fresco:roundedCornerRadius="1dp" fresco:roundTopLeft="true" fresco:roundTopRight="false" fresco:roundBottomLeft="false" fresco:roundBottomRight="true" fresco:roundWithOverlayColor="@color/corner_color" fresco:roundingBorderWidth="2dp" fresco:roundingBorderColor=“@color/border_color"/>

13. Animated Images • Fresco supports animated GIF and WebP images.

    • Control of animation

14. Resizing and Rotating public class ResizeOptions { public final int

    width; public final int height; ! public ResizeOptions(int width, int height) { /** **/ } }

15. Listening to Download Events public interface ControllerListener<INFO> { void onSubmit(String

    var1, Object var2); ! void onFinalImageSet(String var1, INFO var2, Animatable var3); ! void onIntermediateImageSet(String var1, INFO var2); ! void onIntermediateImageFailed(String var1, Throwable var2); ! void onFailure(String var1, Throwable var2); ! void onRelease(String var1); }

16. Modifying the Image public interface Postprocessor { void process(Bitmap var1);

    ! String getName(); } public interface Postprocessor { ! void process(Bitmap var1); ! String getName(); }

17. Image Pipeline Guide

18. Modifying the Image public interface Postprocessor { void process(Bitmap var1);

    ! String getName(); }

19. Configuring the Image Pipeline • Progressive JPEGs • Configuring the

    disk cache • Keeping cache stats

20. Third Party Libraries

21. Using Other Network Layers public interface Postprocessor { void process(Bitmap

    var1); ! String getName(); } dependencies { // your app's other dependencies compile ‘com.facebook.fresco:fresco:0.2.0+’ compile ‘com.facebook.fresco:imagepipeline-okhttp:0.2.0+' }

22. Using Other Image Loaders public interface Postprocessor { void process(Bitmap

    var1); ! String getName(); } dependencies { // your app's other dependencies compile ‘com.facebook.fresco:fresco:0.2.0+’ compile ‘com.facebook.fresco:drawee-volley:0.2.0+' }

23. Thanks.