flutter - button

OutlineButton

/*
  OutlineButton({
    Key key,
    @required VoidCallback onPressed,
    ButtonTextTheme textTheme,  //按钮上字体主题
    Color textColor,  //字体颜色
    Color disabledTextColor, //按钮禁用时候文字的颜色
    Color color,  //按钮背景颜色
    Color highlightColor,//点击或者toch控件高亮的时候显示在控件上面，水波纹下面的颜色
    Color splashColor, //水波纹的颜色
    double highlightElevation,//高亮时候的阴影
    this.borderSide,//按钮边框
    this.disabledBorderColor, //按钮禁用时边框的颜色
    this.highlightedBorderColor,//高亮时边框的颜色
    EdgeInsetsGeometry padding,//边距
    ShapeBorder shape, //设置shape
    Clip clipBehavior = Clip.none,
    Widget child,
  }) 
*/

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('button'),
        ),
        body: Center(
          child: Column(
            children: <Widget>[
              OutlineButton(onPressed: (){
                print('OutlineButton');
              },
                child: Text('OutlineButton'),
              ),
              OutlineButton(
                  onPressed: (){
                    
                  },
                child: Text('OutlineButton--2'),
                  textTheme:ButtonTextTheme.primary,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(20.0),
                ),
                borderSide: BorderSide(color: Colors.amber),
              ),

            ],
          ),
        )
      )
    );
  }
}

FloatingActionButton

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('button'),
        ),
        body: Center(
          child: Column(
            children: <Widget>[
              FloatingActionButton(
                child: Text('FloatingActionButton'),
                foregroundColor: Colors.red,
                isExtended: true,
              ),
            ],
          ),
        )
      )
    );
  }
}

RaisedButton

RaisedButton(
            color: Colors.blueAccent,
            //按钮的背景颜色
            padding: EdgeInsets.all(15.0),
            //按钮距离里面内容的内边距
            textColor: Colors.white,
            //文字的颜色
            textTheme: ButtonTextTheme.normal,
            //按钮的主题
            onHighlightChanged: (bool b) {
              //水波纹高亮变化回调
            },
            disabledTextColor: Colors.black54,
            //按钮禁用时候文字的颜色
            disabledColor: Colors.black54,
            //按钮被禁用的时候显示的颜色
            highlightColor: Colors.green,
            //点击或者toch控件高亮的时候显示在控件上面，水波纹下面的颜色
            splashColor: Colors.amberAccent,
            //水波纹的颜色
            colorBrightness: Brightness.light,
            //按钮主题高亮
            elevation: 10.0,
            //按钮下面的阴影
            highlightElevation: 10.0,
            //高亮时候的阴影
            disabledElevation: 10.0,
            //按下的时候的阴影
            shape: new RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(20.0)),
            //设置形状
            onPressed: () {},
            child: new Text("RaisedButton"),
          ),

RaisedButton、FlatButton、OutlineButton、MaterialButton

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('button'),
        ),
        body: Center(
          child: Column(
            children: <Widget>[
              OutlineButton(onPressed: (){
                print('OutlineButton');
              },
                child: Text('OutlineButton'),
              ),
              OutlineButton(
                  onPressed: (){

                  },
                child: Text('OutlineButton--2'),
                  textTheme:ButtonTextTheme.primary,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(20.0),
                ),
                borderSide: BorderSide(color: Colors.amber),
              ),
              FloatingActionButton(
                child: Text('FloatingActionButton'),
                foregroundColor: Colors.red,
                isExtended: true,
              ),
              RaisedButton(onPressed: (){},
                child: Text('RaisedButton'),
              ),
              FlatButton(onPressed: null, child: Text('FlatButton')),
              MaterialButton(child: Text('Material'),),
              RawMaterialButton(onPressed: null,child: Text('RawMaterialButton'),),
              SizedBox(height: 20,child: Text('属性使用'),),
              RaisedButton(onPressed: (){},
                color: Colors.amberAccent,
//                child: Text('RaisedButton',style: TextStyle(color: Colors.black),),
                child: Text('RaisedButton'),
                padding: EdgeInsets.all(20),
                textColor: Colors.red,
                textTheme: ButtonTextTheme.accent,
                disabledColor: Colors.green,
                elevation: 10.0,
                highlightColor: Colors.purple,
              ),
            ],
          ),
        )
      )
    );
  }
}