[Flutter]リップルエフェクトを無効にする方法

どうも、ちょげ(@chogetarou)です。

リップルエフェクトを無効にする方法を紹介します。

方法

全て

全てのリップルエフェクトを無効にするには、「MaterialApp」の引数「theme」を使います。

まず、引数「theme」に指定する「ThemeData」を指定します。

そして、「ThemeData」の引数「splashColor」を「Colors.transparent」に設定します。

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
        splashColor: Colors.transparent,
      ),
      home: Scaffold(
        body: Test(),
      ),
    );
  }

１部

１部のリップルエフェクトを無効にするには、「Theme」を使います。

「Theme」の「child」にリップルエフェクトを無効にするウェジェットを指定します。

そして、「Theme」の引数「data」に指定する「ThemeData」の「splashColor」プロパティを「Colors.transparent」に指定します。

Theme(
  data: ThemeData(
    splashColor: Colors.transparent,
  ),
  child: /* ウェジェット */
),

まとめ

ThemeDataクラスの「splashColor」プロパティを「Colors.transparent」にすることで、リップルエフェクトを無効にすることが出来ます。