介绍 Trio | 第三部分
By: Eli Hart, Ben Schwab, and Yvonne Wong
作者: Eli Hart,Ben Schwab,和Yvonne Wong
Trio is Airbnb’s framework for Jetpack Compose screen architecture in Android. It’s built on top of Mavericks, Airbnb’s open source state management library for Jetpack. In this blog post series, we’ve been breaking down how Trio works to help explain our design decisions, in the hopes that other teams might benefit from aspects of our approach.
Trio 是 Airbnb 在 Android 上使用 Jetpack Compose 屏幕架构的框架。它是建立在 Mavericks 之上的,Mavericks 是 Airbnb 的 Jetpack 开源状态管理库。在这个博客系列中,我们一直在解析 Trio 的工作原理,以帮助解释我们的设计决策,希望其他团队能从我们的方法中受益。
We recommend starting with Part 1, about Trio’s architecture, and then reading Part 2, about how navigation works in Trio, before you dive into this article. In this third and final part of our series, we’ll discuss how Props in Trio allow for simplified, type-safe communication between ViewModels. We’ll also share an update on the current adoption of Trio at Airbnb and what’s next.
我们建议先阅读关于Trio架构的第1部分,然后再阅读关于Trio中导航工作原理的第2部分,然后再深入阅读本文。在我们系列文章的第三部分中,我们将讨论Trio中的Props如何实现简化、类型安全的ViewModel之间的通信。我们还将分享Trio在Airbnb的当前采用情况以及接下来的计划。
Trio Props
Trio Props
To better understand Props, let’s look at an example of a simple Message Inbox screen, composed of two Trios side by side. There is a List Trio on the left, showing inbox messages, and a Details Trio on the right, showing the full text of a selected message.
为了更好地理解Props,让我们看一个简单的消息收件箱屏幕的例子,由两个并排的Trios组成。左侧是一个列表Trio,显示收件箱消息,右侧是一个详情Trio,显示所选消息的完整文本。
The two Trios are wrapped by a parent screen, which is responsible for instantiating the two children, passing along data to them, and positioning them in the UI. As you might recall from Part 2, Trios can be stored in State; the parent’s State includes both the message data as well as the child Trios.
这两个Trio被一个父屏幕包装,负责实例化这两个子屏幕,将数据传递给它们,并将它们定位在UI中。正如您可能还记得的第2部分,Trio可以存储在State中;父级的State包括消息数据和子Trio。
data class ParentState(
val inboxMessages: List<Message>,
val selectedMessage: Message?,
val messageListScreen: Trio<ListProps>,
val messageDetai...