Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Introduction of the Facebook’s Fresco
Search
Daichi Furiya (Wasabeef)
April 14, 2015
Programming
3.3k
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
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.9k
About Flutter Architecture
wasabeef
1
330
2023 Flutter/Dart Summary
wasabeef
0
140
I/O Extended 2023 - Dart と Flutter の新機能
wasabeef
0
250
I/O Extended 2023 - Flutter 活用事例
wasabeef
10
3.1k
What it Takes to be a Flutter Developer
wasabeef
0
270
FlutterKaigi 2022 Keynote
wasabeef
1
760
Flutter Hooks を使ったアプリ開発 / App Development with the Flutter Hooks
wasabeef
2
1.6k
Flutter 2021 の振り返りと今後のアプリ開発に向けて / Looking back on Flutter 2021 and for future app development.
wasabeef
4
2.3k
Other Decks in Programming
See All in Programming
App Intentsのビルドプロセスを支える技術
kntkymt
0
380
AIエージェント時代のコードレビューを設計する
nogu66
6
2.7k
XHTMLが残したもの
yosuke_furukawa
PRO
2
810
海上で動くGoサーバー: goroutineとchannelでさばく航行データストリーム
atsuki_seo
0
720
Java 27新機能 / Java 27 new features
kishida
2
150
AI に Inclusive UI を書かせよう — Design Rules Skill で Compose UI を作り直す
theoriatec2024
1
490
AIは賢い。でも実行環境は? CLIおじさんがAI時代に伝えたいこと ~ CLIおじさんがAI時代に伝えたいこと ~
curekoshimizu
1
240
アクセシビリティから考える情報設計
high_g_engineer
0
380
thread_parallel_with_free-threaded_Python_and_NumPy.pdf
riku_sakamoto
0
340
Augmenting AI with the Power of Jakarta EE
ivargrimstad
0
110
Vibes Containers 〜AIで変わるコンテナ設計と運用〜
tkikuc
3
550
更なる可用性を求めて、5年間運用したKotlinのアプリケーションをGoでリプレイスする話
ken_tunc
0
270
Featured
See All Featured
What does AI have to do with Human Rights?
axbom
PRO
1
2.4k
The #1 spot is gone: here's how to win anyway
tamaranovitovic
4
1.2k
HDC tutorial
michielstock
2
870
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
1k
The Invisible Side of Design
smashingmag
301
52k
Being A Developer After 40
akosma
91
590k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
3k
Introduction to Domain-Driven Design and Collaborative software design
baasie
1
990
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
280
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
540
Building Flexible Design Systems
yeseniaperezcruz
330
41k
It's Worth the Effort
3n
188
29k
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.