Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Introduction of the Facebook’s Fresco
Search
Daichi Furiya (Wasabeef)
April 14, 2015
Programming
2
3.1k
Introduction of the Facebook’s Fresco
An Android library for managing images and the memory they use.
Daichi Furiya (Wasabeef)
April 14, 2015
Tweet
Share
More Decks by Daichi Furiya (Wasabeef)
See All by Daichi Furiya (Wasabeef)
About Flutter Architecture
wasabeef
0
150
2023 Flutter/Dart Summary
wasabeef
0
42
I/O Extended 2023 - Dart と Flutter の新機能
wasabeef
0
140
I/O Extended 2023 - Flutter 活用事例
wasabeef
11
2.7k
What it Takes to be a Flutter Developer
wasabeef
0
150
FlutterKaigi 2022 Keynote
wasabeef
1
540
Flutter Hooks を使ったアプリ開発 / App Development with the Flutter Hooks
wasabeef
2
1.3k
Flutter 2021 の振り返りと今後のアプリ開発に向けて / Looking back on Flutter 2021 and for future app development.
wasabeef
4
2.1k
Flutter Hooks, sometimes Jetpack Compose
wasabeef
3
1.7k
Other Decks in Programming
See All in Programming
Universal Linksの実装方法と陥りがちな罠
kaitokudou
1
220
Jakarta Concurrencyによる並行処理プログラミングの始め方 (JJUG CCC 2024 Fall)
tnagao7
1
230
gopls を改造したら開発生産性が高まった
satorunooshie
8
240
【Kaigi on Rails 2024】YOUTRUST スポンサーLT
krpk1900
1
250
Pinia Colada が実現するスマートな非同期処理
naokihaba
2
160
qmuntal/stateless のススメ
sgash708
0
120
Snowflake x dbtで作るセキュアでアジャイルなデータ基盤
tsoshiro
2
430
弊社の「意識チョット低いアーキテクチャ」10選
texmeijin
5
23k
VR HMDとしてのVision Pro+ゲーム開発について
yasei_no_otoko
0
100
Webの技術スタックで マルチプラットフォームアプリ開発を可能にするElixirDesktopの紹介
thehaigo
2
930
AWS IaCの注目アップデート 2024年10月版
konokenj
3
3.1k
offers_20241022_imakiire.pdf
imakurusu
2
360
Featured
See All Featured
The World Runs on Bad Software
bkeepers
PRO
65
11k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
355
29k
Intergalactic Javascript Robots from Outer Space
tanoku
268
27k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Happy Clients
brianwarren
97
6.7k
Producing Creativity
orderedlist
PRO
341
39k
Why Our Code Smells
bkeepers
PRO
334
57k
How to Think Like a Performance Engineer
csswizardry
19
1.1k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.6k
Docker and Python
trallard
40
3.1k
Into the Great Unknown - MozCon
thekraken
31
1.5k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.1k
Transcript
Introduction of the Facebook’s Fresco CyberAgent, Inc. ߱ େ
About Me wasabeef @wasabeef_jp
About Fresco • Image Manager • Streaming • Animations •
Drawing • Loading
Quick Start
Adding Fresco to your Project dependencies { // your app's
other dependencies compile 'com.facebook.fresco:fresco:0.2.0+' }
Adding Fresco to your Project public class MainApplication extends Application
{ ! @Override public void onCreate() { super.onCreate(); Fresco.initialize(this); } }
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>
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); } }
Supported URIs 5ZQF 4DIFNF 'FUDINFUIPEVTFE 'JMFPOOFUXPSL http://, https:// HttpURLConnection or
network layer 'JMFPOEFWJDF pMF 'JMF*OQVU4USFBN $POUFOUQSPWJEFS DPOUFOU $POUFOU3FTPMWFS "TTFUJOBQQ BTTFU "TTFU.BOBHFS 3FTPVSDFJOBQQ SFT 3FTPVSDFTPQFO3BX3FTPVSDF
Concepts • DraweeView • DraweeHierarchy • DraweeController • The Image
Pipeline
Drawee Guide
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"/>
Animated Images • Fresco supports animated GIF and WebP images.
• Control of animation
Resizing and Rotating public class ResizeOptions { public final int
width; public final int height; ! public ResizeOptions(int width, int height) { /** **/ } }
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); }
Modifying the Image public interface Postprocessor { void process(Bitmap var1);
! String getName(); } public interface Postprocessor { ! void process(Bitmap var1); ! String getName(); }
Image Pipeline Guide
Modifying the Image public interface Postprocessor { void process(Bitmap var1);
! String getName(); }
Configuring the Image Pipeline • Progressive JPEGs • Configuring the
disk cache • Keeping cache stats
Third Party Libraries
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+' }
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+' }
Thanks.