如何在 Flutter 中更改英雄動畫的持續時間但有參數

Question

這是我的代碼作為要點（我在 dartpad.dev 中的代碼的交互式版本）

快速概述我試圖用這個應用程序做什么：

我有兩頁/我想在 TextField 中輸入一個字符串的地方，它會同時開始出現在appBar ，還有另一個按鈕，當您按下時，會將您帶到另一個頁面（ Home小部件），但帶有text你在/頁面中寫的。 我想這種轉變要像英雄動畫，其中從文本appBar的/頁flies成body的Info

我以前使用

Navigator.pushNamed(context, "Info", arguments: {"text": myController.text});

路由到新頁面並傳遞我想在那里顯示的文本。我能夠做到，但即使在配置文件模式下，動畫也太快了

但是我從這個問題中得到的答案是使用

Navigator.push(
  context,
  PageRouteBuilder(
      transitionDuration: Duration(seconds: 2),
      pageBuilder: (_, __, ___) => Page2())
      ),

但問題是， Navigator.push(context, PageRouteBuilder( ... ) )不允許您傳遞參數，我絕對希望能夠做到這一點。

Answer 1

如果您可以使用PageRouteBuilder 類控制過渡動畫，那么您唯一關心的就是傳遞數據。 現在，我敢肯定，您已經錯過了這一點，這是：

將數據作為 Flutter 類的參數傳遞。 你不必真的喜歡這樣的東西總是arguments: {} 。

現在，我的意思是，Flutter 中的每個類都可以接受數據作為參數，你是怎么做到的。

• 創建一個接受參數的內容[你已經完成了]
• 使用時在類中傳遞數據，在我們的例子中Info(pass_it_here) [現在必須完成]

我們如何在代碼中實現這一點？

因此，您只需要在轉換時傳遞如下所述的數據即可。 您的 Info 類正在接受數據。 所以你需要做的就是實現你想要的，這個：

Navigator.push(
  context,
  PageRouteBuilder(
      transitionDuration: Duration(seconds: 2),
      pageBuilder: (_, __, ___) => Info(text: myController.text) // <-- here is the magic
  )
)

建議：

如果您正在為類定義參數，讓我們僅以Info為例，請將其聲明為 final。 我知道您將更改數據，但您可以將內容復制到局部變量，然后做任何您想做的事情。

例子

class Info extends StatefulWidget {
  final String text;  // <-- Declare this as final
  
  Info({this.text});

  @override
  _InfoState createState() => _InfoState();
}

在主類中使用@immutable 數據：

class _InfoState extends State<Info> {
   // here how you are just copying the data to the local variable
   // var _myText = widget.text;
   String _myText = "";

   // or you can do this via @initState
   @override
   void initState(){
     super.initState();

     _myText = widget.text;
   }

   // Now use your variable _myText however you want
}