天天看点

译文----- JetpackCompose List列表(实验API)

这部分内容在原文中, 是Sticky Header 和 Grids 两部分, 原文官方标注了 experimental(实验阶段), 这意味着这部分API随时会修改,甚至是删除, 所以慎用

If you’ve used the RecyclerView widget, you’ll know that it animates item changes automatically. The Lazy layouts do not yet provide that functionality, which means that item changes cause an instant ‘snap’. You can follow this bug to track any changes for this feature.

如果你用过<code>RecyclerView</code>组件, 那么你肯定知道它能自动设置item改变的动画. 但是懒加载布局(基本上就是<code>LazyColumn</code>和<code>LazyRow</code>) 还没有提供相关函数, 这意味着item像是闪烁一样改变内容(此处翻译读着不顺), 你可以持续关注这个bug在将来的修复情况

Caution: Experimental APIs can change in the future or may be removed entirely.

此功能为实验性质, 在将来API可能会改变 或者完全删除

The ‘sticky header’ pattern is helpful when displaying lists of grouped data. Below you can see an example of a ‘contacts list’, grouped by each contact’s initial:

'粘性头部'样式 有助于实现分组列表数据的展示, 如下所示是'联系人列表'的示例, 按照联系人的首字母进行分组

To achieve a sticky header with LazyColumn, you can use the experimental stickyHeader() function, providing the header content

要使用<code>LazyColumn</code>实现一个粘性头,可以使用实验性的<code>stickyHeader()</code>函数,提供头内容

To achieve a list with multiple headers, like the ‘contacts list’ example above, you could do:

要实现具有多个标题的列表,如上面的“联系人列表”示例,可以执行以下操作:

The LazyVerticalGrid composable provides experimental support for displaying items in a grid.

目前<code>LazyVerticalGrid</code>这个还在实验性质的组件 可以展示 <code>"grid"</code>样式的items

The cells parameter controls how cells are formed into columns. The following example displays items in a grid, using <code>GridCells.Adaptive</code> to set each column to be at least <code>128.dp</code> wide:

<code>cells</code>参数控制每列样式. 下面的示例,使用网格<code>GridCells.Adaptive</code>将每列设置为最小宽度为<code>128.dp</code>

If you know the exact amount of columns to be used, you can instead provide an instance of <code>GridCells.Fixed</code> containing the number of required columns

如果您知道要使用的列的确切数量,则可以直接通过<code>GridCells.Fixed</code>设置列的数目