跳至主要內容
目錄

預設多點觸控捲動

目錄

摘要

#

現在 ScrollBehavior 允許或禁止捲動速度受到螢幕上指標數量的影響。預設情況下，ScrollBehavior.multitouchDragStrategy 會阻止多個指標同時與可捲動元件互動，進而影響捲動速度。

背景

#

在此變更之前，每當有指標拖曳 Scrollable widget 時，捲動速度都會增加。這與和 Flutter 應用程式互動時的平台預期不符。

現在，繼承的 ScrollBehavior 會根據 ScrollBehavior.multitouchDragStrategy 的指定，管理多個指標如何影響捲動 widget。這個列舉 MultitouchDragStrategy 也可以設定為先前的行為。

變更說明

#

這項變更修正了透過使用多個手指拖曳來增加捲動速度的意外能力。

如果您在應用程式中依賴先前的行為，則有幾種方法可以控制和設定此功能。

  • 擴充 ScrollBehavior、MaterialScrollBehavior 或 CupertinoScrollBehavior 以修改預設行為，覆寫 ScrollBehavior.multitouchDragStrategy。

    • 使用您自己的 ScrollBehavior，您可以透過設定 MaterialApp.scrollBehavior 或 CupertinoApp.scrollBehavior 將其應用於整個應用程式。
    • 或者，如果您希望僅將其應用於特定的 widget，請在有問題的 widget 上方新增一個具有自訂 ScrollBehavior 的 ScrollConfiguration。

您的可捲動 widget 隨後會繼承並反映此行為。

  • 除了建立您自己的 ScrollBehavior 之外，變更預設行為的另一種方法是複製現有的 ScrollBehavior，並設定不同的 multitouchDragStrategy。
    • 在您的 widget 樹狀結構中建立一個 ScrollConfiguration，並使用 copyWith 在目前的內容中提供現有 ScrollBehavior 的修改副本。

為了容納新的設定，DragGestureRecognizer 也已更新，以在其他拖曳內容中支援 MultitouchDragStrategy。

遷移指南

#

為您的應用程式設定自訂的 ScrollBehavior

#

遷移前的程式碼

dart
MaterialApp(
  // ...
);

遷移後的程式碼

dart
class MyCustomScrollBehavior extends MaterialScrollBehavior {
  // Override behavior methods and getters like multitouchDragStrategy
  @override
  MultitouchDragStrategy getMultitouchDragStrategy(BuildContext context) => MultitouchDragStrategy.sumAllPointers;
}

// Set ScrollBehavior for an entire application.
MaterialApp(
  scrollBehavior: MyCustomScrollBehavior(),
  // ...
);

為特定的 widget 設定自訂的 ScrollBehavior

#

遷移前的程式碼

dart
final ScrollController controller = ScrollController();
ListView.builder(
  controller: controller,
  itemBuilder: (BuildContext context, int index) {
    return Text('Item $index');
  },
);

遷移後的程式碼

dart
class MyCustomScrollBehavior extends MaterialScrollBehavior {
  // Override behavior methods and getters like multitouchDragStrategy
  @override
  MultitouchDragStrategy getMultitouchDragStrategy(BuildContext context) => MultitouchDragStrategy.sumAllPointers;
}

// ScrollBehavior can be set for a specific widget.
final ScrollController controller = ScrollController();
ScrollConfiguration(
  behavior: MyCustomScrollBehavior(),
  child: ListView.builder(
    controller: controller,
    itemBuilder: (BuildContext context, int index) {
      return Text('Item $index');
    },
  ),
);

複製並修改現有的 ScrollBehavior

#

遷移前的程式碼

dart
final ScrollController controller = ScrollController();
ListView.builder(
  controller: controller,
  itemBuilder: (BuildContext context, int index) {
    return Text('Item $index');
  },
);

遷移後的程式碼

dart
// ScrollBehavior can be copied and adjusted.
final ScrollController controller = ScrollController();
ScrollConfiguration(
  behavior: ScrollConfiguration.of(context).copyWith(
    multitouchDragStrategy: MultitouchDragStrategy.sumAllPointers,
  ),
  child: ListView.builder(
    controller: controller,
    itemBuilder: (BuildContext context, int index) {
      return Text('Item $index');
    },
  ),
);

時間軸

#

於版本中實作：3.18.0-4.0.pre
在穩定版本中：3.19.0

參考資料

#

API 文件

相關議題

相關的 PR

除非另有說明，否則本網站上的文件反映了 Flutter 的最新穩定版本。頁面最後更新於 2024-07-16。 檢視來源 或 回報問題。