flutter InkWell与水波纹

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final title = 'InkWell Demo';

    return MaterialApp(
      title: title,
      home: MyHomePage(title: title),
    );
  }
}

class MyHomePage extends StatelessWidget {
  final String title;

  MyHomePage({Key key, this.title}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          MyInkWellButton(),
          Builder(
            //如果 build 函数返回一个 Scaffold 对象,则由于 Scaffold 对象是这个 Widget 的子对象,
            // 所以使用这个 build 的 BuildContext 参数是不能查找到 ScaffoldState 对象的,
            // 这个时候,通过在 Scaffold 中使用一个 Builder 来提供一个新的 BuildConext :
            // Create an inner BuildContext so that the onPressed methods
            // can refer to the Scaffold with Scaffold.of().
            builder: (BuildContext context) {
              return Center(
                child: RaisedButton(
                  child: Text('RaisedButton'),
                  onPressed: () {
                    Scaffold.of(context).showSnackBar(SnackBar(
                      content: Text('Tap RaisedButton'),
                    ));
                  },
                ),
              );
            },
          ),
          Builder(
            //如果 build 函数返回一个 Scaffold 对象,则由于 Scaffold 对象是这个 Widget 的子对象,
            // 所以使用这个 build 的 BuildContext 参数是不能查找到 ScaffoldState 对象的,
            // 这个时候,通过在 Scaffold 中使用一个 Builder 来提供一个新的 BuildConext :
            // Create an inner BuildContext so that the onPressed methods
            // can refer to the Scaffold with Scaffold.of().
            builder: (BuildContext context) {
              return Center(
                child: FlatButton(
                  child: Text('FlatButton'),
                  onPressed: () {
                    Scaffold.of(context).showSnackBar(SnackBar(
                      content: Text('Tap FlatButton'),
                    ));
                  },
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}

class MyInkWellButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    //触摸水波效果:
    //1.创建一个可点击的Widget。
    //2.将它包裹在一个InkWell中来管理点击回调和水波动画。
    return InkWell(
      onTap: () {
        Scaffold.of(context).showSnackBar(SnackBar(
          content: Text('Tap MyInkWellButton'),
        ));
      },
      child: Container(
        padding: EdgeInsets.all(12.0),
        child: Text('MyInkWellButton'),
      ),
    );
  }
}

你可能感兴趣的:(flutter)