Flutter:在ListView Builder中使用Hero动画

时间:2019-08-09 05:28:49

标签: android ios flutter dart

我正在构建 List ListView.builder )和 Detail 屏幕。 英雄用于在选定小部件(使用 pushedReplacement )时对某些部分进行动画处理。

我注意到,当我从 Detail 屏幕移到 List 屏幕时,如果所选的小部件是 end / tail / last 小部件, ListView ,则动画将不会运行。

因为 ListView.builder 仅呈现 first / head 可见元素,所以我认为 Hero 不知道小部件的位置。

那么,我该如何解决这个问题?并不是那么关键,但这几天困扰着我。

2 个答案:

答案 0 :(得分:0)

您需要为每个列表构建器元素提供唯一的标记

Hero(
       tag: snapshot.data.documents[index]['category'],
       child: // your child ,
    ),

答案 1 :(得分:0)

Hero小部件通过其标签标识要设置动画的元素。 tag属性必须是唯一的才能使此工作有效。因此,您可以做的是:

  1. 使每个英雄的标签唯一。喜欢,

    - hosts: Switch connection: local become: yes tasks: - name: run show version on remote devices ios_command: commands: - show version - show interfaces

  2. 在单击时将索引传递到详细屏幕。喜欢,

    ListView.builder ( itemCount: litems.length, itemBuilder: (BuildContext context, int index) { return Hero( tag: "some_name"+index.toString(), child: SomeChild(); ); } )

  3. 在详细屏幕上的
  4. 使用接收到的索引创建标签。喜欢,

    Navigator.push(context, MaterialPageRoute( builder: (BuildContext context) => DetailedScreen(index) ) );

希望它会对您有所帮助。