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
3.3k
2
Share
Introduction of the Facebook’s Fresco
An Android library for managing images and the memory they use.
Daichi Furiya (Wasabeef)
April 14, 2015
More Decks by Daichi Furiya (Wasabeef)
See All by Daichi Furiya (Wasabeef)
DevFest Tokyo 2025 - Flutter のアプリアーキテクチャ現在地点
wasabeef
6
2.7k
About Flutter Architecture
wasabeef
1
310
2023 Flutter/Dart Summary
wasabeef
0
130
I/O Extended 2023 - Dart と Flutter の新機能
wasabeef
0
230
I/O Extended 2023 - Flutter 活用事例
wasabeef
10
3.1k
What it Takes to be a Flutter Developer
wasabeef
0
240
FlutterKaigi 2022 Keynote
wasabeef
1
710
Flutter Hooks を使ったアプリ開発 / App Development with the Flutter Hooks
wasabeef
2
1.5k
Flutter 2021 の振り返りと今後のアプリ開発に向けて / Looking back on Flutter 2021 and for future app development.
wasabeef
4
2.2k
Other Decks in Programming
See All in Programming
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
520
Cache-moi si tu peux : patterns et pièges du cache en production - Devoxx France 2026 - Conférence
slecache
0
330
Claude Code × Gemini × Ebitengine ゲーム制作素人WebエンジニアがGoでゲームを作った話
webzawa
0
220
AI-DLC Deep Dive
yuukiyo
9
5.6k
サークル参加から学ぶ、小さな事業の回し方
yuzneri
0
130
GitHubCopilotCLIをはじめよう.pdf
htkym
0
320
書籍「ユーザーストーリーマッピング」が私のバイブル
asumikam
4
480
Back to the roots of date
jinroq
0
730
過去のレビュー知見をSkillsで資産化した話
pkshadeck
PRO
1
1.5k
セグメントとターゲットを意識するプロポーザルの書き方 〜採択の鍵は、誰に刺すかを見極めるマーケティング戦略にある〜
m3m0r7
PRO
0
750
HTML-Aware ERB: The Path to Reactive Rendering @ RubyKaigi 2026, Hakodate, Japan
marcoroth
0
650
UaaL×Androidアプリのメモリ計測 — Memory Profilerの先へ
rio432
0
120
Featured
See All Featured
Automating Front-end Workflow
addyosmani
1370
200k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
9.9k
We Are The Robots
honzajavorek
0
220
Testing 201, or: Great Expectations
jmmastey
46
8.1k
Efficient Content Optimization with Google Search Console & Apps Script
katarinadahlin
PRO
1
540
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.5k
Google's AI Overviews - The New Search
badams
0
1k
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
530
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9k
A Guide to Academic Writing Using Generative AI - A Workshop
ks91
PRO
1
290
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.