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
76
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
130
Migrate to Gradle version catalog and convention plugins
tatocaster
3
1.7k
Make Codebases Secure with OWASP
tatocaster
0
170
Secure Coding Standards
tatocaster
0
120
ტანგო ანდროიდთან
tatocaster
0
180
Adopting Huawei Mobile Services
tatocaster
0
47
Android UI Testing & Challenges
tatocaster
1
67
Reverse & Inject - droidcon
tatocaster
3
230
mobile DevOps
tatocaster
1
82
Other Decks in Programming
See All in Programming
GraphQL あるいは React における自律的なデータ取得について
quramy
11
3k
マイグレーションコード自作して File-Based Routing に自動移行!! ~250 ページの歴史的経緯を添えて~
cut0
1
260
A New Era of Testing
mannodermaus
2
510
実践!難読化ガイド
mitchan
0
200
GraphQLの魅力を引き出すAndroidクライアント実装
morux2
3
660
Rubyのobject_id
qnighy
6
1.3k
Go Code Generation at newmo / 2024-08-27 #newmo_layerx_go
genkey6
0
560
GenU導入でCDKに初挑戦し、悪戦苦闘した話
hideg
0
160
ECMAScript、Web標準の型はどう管理されているか / How ECMAScript and Web standards types are maintained
petamoriken
3
390
状態管理ライブラリZustandの導入から運用まで
k1tikurisu
3
470
Scala におけるコンパイラエラーとの付き合い方
chencmd
2
430
Jakarta EE meets AI
ivargrimstad
0
380
Featured
See All Featured
KATA
mclloyd
27
13k
How to name files
jennybc
75
98k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
225
22k
Making Projects Easy
brettharned
113
5.8k
Typedesign – Prime Four
hannesfritz
39
2.3k
Fantastic passwords and where to find them - at NoRuKo
philnash
48
2.8k
Designing for Performance
lara
604
68k
Six Lessons from altMBA
skipperchong
26
3.4k
4 Signs Your Business is Dying
shpigford
179
21k
Git: the NoSQL Database
bkeepers
PRO
425
64k
A Philosophy of Restraint
colly
202
16k
The Pragmatic Product Professional
lauravandoore
31
6.2k
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