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
Facebook Litho
Search
Merab Tato Kutalia
May 04, 2017
Programming
2
85
Facebook Litho
Droid Up 7.0 , 2017 talk about Facebook Litho
Merab Tato Kutalia
May 04, 2017
Tweet
Share
More Decks by Merab Tato Kutalia
See All by Merab Tato Kutalia
What's new in Android 14?
tatocaster
0
160
Migrate to Gradle version catalog and convention plugins
tatocaster
3
1.9k
Make Codebases Secure with OWASP
tatocaster
0
190
Secure Coding Standards
tatocaster
0
150
ტანგო ანდროიდთან
tatocaster
0
260
Adopting Huawei Mobile Services
tatocaster
0
62
Android UI Testing & Challenges
tatocaster
1
110
Reverse & Inject - droidcon
tatocaster
3
300
mobile DevOps
tatocaster
1
130
Other Decks in Programming
See All in Programming
CSC305 Lecture 06
javiergs
PRO
0
250
『毎日の移動』を支えるGoバックエンド内製開発
yutautsugi
2
250
Range on Rails ―「多重範囲型」という新たな選択肢が、複雑ロジックを劇的にシンプルにしたワケ
rizap_tech
0
6.7k
NixOS + Kubernetesで構築する自宅サーバーのすべて
ichi_h3
0
1.1k
What Spring Developers Should Know About Jakarta EE
ivargrimstad
0
260
コードとあなたと私の距離 / The Distance Between Code, You, and I
hiro_y
0
170
オープンソースソフトウェアへの解像度🔬
utam0k
16
3k
なぜあの開発者はDevRelに伴走し続けるのか / Why Does That Developer Keep Running Alongside DevRel?
nrslib
3
410
Server Side Kotlin Meetup vol.16: 内部動作を理解して ハイパフォーマンスなサーバサイド Kotlin アプリケーションを書こう
ternbusty
3
220
Goで実践するドメイン駆動開発 AIと歩み始めた新規プロダクト開発の現在地
imkaoru
4
860
他言語経験者が Golangci-lint を最初のコーディングメンターにした話 / How Golangci-lint Became My First Coding Mentor: A Story from a Polyglot Programmer
uma31
0
240
Pull-Requestの内容を1クリックで動作確認可能にするワークフロー
natmark
2
520
Featured
See All Featured
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.9k
Docker and Python
trallard
46
3.6k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
10
600
Site-Speed That Sticks
csswizardry
13
910
KATA
mclloyd
PRO
32
15k
Thoughts on Productivity
jonyablonski
70
4.9k
Build your cross-platform service in a week with App Engine
jlugia
232
18k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
Transcript
Facebook Litho A declarative UI framework for Android
Tato Kutalia tatocaster tatocaster.me github.com/tatocaster twitter.com/@tatokutalia
Litho’s History
Litho’s History iOS Platform, now known as Texture(Pinterest).
Litho Appeared @ Facebook F8 primarily built to implement complex
scrollable UIs based on RecyclerView.
Litho - View flattening - Declarative - AsyncLayout - Recycling
- Good Debugging Tools a declarative framework for building efficient UIs
Litho uses Yoga, also by Facebook cross-platform layout engine Everything
is a component immutable inputs knowns as Props React Terminology
Litho Core Elements State Props LayoutSpec - groups existing components
together in an immutable layout tree. MountSpec - defines a component that can render views or drawables.
Litho Recycler
Litho Touch and Click @LayoutSpec class ListItemSpec { @OnCreateLayout static
ComponentLayout onCreateLayout( ComponentContext c, @Prop(optional = true, resType = ResType.DIMEN_OFFSET) int shadowRadius, @Prop int color, @Prop String title, @Prop String subtitle) { return Column.create(c) .paddingDip(ALL, 16) .backgroundColor(color) .child( Text.create(c) .text(title) .textSizeSp(40)) .child( Text.create(c) .text(subtitle) .textStyle(ITALIC) .textSizeSp(20)) .clickHandler(ListItem.onClick(c)) .build(); } @OnEvent(ClickEvent.class) static void onClick(ComponentContext c, @FromEvent View view, @Prop OnListItemClickListener listener) { listener.onListItemClick(view); }
Litho Custom View
Litho Install // Litho compile 'com.facebook.litho:litho-core:0.2.0' compile 'com.facebook.litho:litho-widget:0.2.0' provided 'com.facebook.litho:litho-annotations:0.2.0'
annotationProcessor 'com.facebook.litho:litho-processor:0.2.0' // SoLoader compile 'com.facebook.soloader:soloader:0.2.0' // Optional // For debugging debugCompile 'com.facebook.litho:litho-stetho:0.2.0' //stetho itself compile 'com.facebook.stetho:stetho:1.5.0'
Litho Summary and Demo