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
84
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
150
Migrate to Gradle version catalog and convention plugins
tatocaster
3
1.8k
Make Codebases Secure with OWASP
tatocaster
0
180
Secure Coding Standards
tatocaster
0
140
ტანგო ანდროიდთან
tatocaster
0
220
Adopting Huawei Mobile Services
tatocaster
0
55
Android UI Testing & Challenges
tatocaster
1
90
Reverse & Inject - droidcon
tatocaster
3
280
mobile DevOps
tatocaster
1
120
Other Decks in Programming
See All in Programming
Blueskyのプラグインを作ってみた
hakkadaikon
1
290
Building an Application with TDD, DDD and Hexagonal Architecture - Isn't it a bit too much?
mufrid
0
370
少数精鋭エンジニアがフルスタック力を磨く理由 -そしてAI時代へ-
rebase_engineering
0
130
型付け力を強化するための Hoogle のすゝめ / Boosting Your Type Mastery with Hoogle
guvalif
1
230
推論された型の移植性エラーTS2742に挑む
teamlab
PRO
0
150
Practical Domain-Driven Design - Workshop at NDC 2025
mufrid
0
130
RubyKaigi Hack Space in Tokyo & 函館最速 "予習" 会 / RubyKaigi Hack Space in Tokyo & The Fastest Briefing of RubyKaigi 2026 in Hakodate
moznion
1
130
TypeScript Language Service Plugin で CSS Modules の開発体験を改善する
mizdra
PRO
3
2.4k
Cursor Meetup Tokyo ゲノミクスとCursor: 進化と制約のあいだ
koido
1
320
Parallel::Pipesの紹介
skaji
2
870
『Python → TypeScript』オンボーディング奮闘記
takumi_tatsuno
1
140
Passkeys for Java Developers
ynojima
0
200
Featured
See All Featured
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.6k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
25
2.8k
VelocityConf: Rendering Performance Case Studies
addyosmani
329
24k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.6k
Site-Speed That Sticks
csswizardry
7
590
Done Done
chrislema
184
16k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
42
2.3k
How to Think Like a Performance Engineer
csswizardry
23
1.6k
Documentation Writing (for coders)
carmenintech
71
4.8k
Six Lessons from altMBA
skipperchong
28
3.8k
The Cult of Friendly URLs
andyhume
78
6.4k
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