Flutter笔记 - Switch/MaterialButto

iOS样式的Switch按钮

截屏2022-11-05 17.11.36.png

            CupertinoSwitch(value: isSwichFlag, onChanged: (value) {
              setState(() {
                isSwichFlag = value;
              });
            }, activeColor: Colors.red,),

按钮的简单应用MaterialButton，加圆角、边框、去阴影等

MaterialButton(
                onPressed: () {},
                child: Text("按钮"),
                color: Colors.red,
                elevation: 0.0, // 去掉阴影
                padding: EdgeInsets.all(0),
                height: 40,
                minWidth: 40,
                shape: RoundedRectangleBorder( // 圆角、边框
                  borderRadius: BorderRadius.circular(10),
                  side: BorderSide(
                    color: Colors.blue,
                    width: 1
                  )
                  // borderRadius: BorderRadius.only(topLeft: Radius.circular(15),topRight: Radius.circular(10),bottomLeft: Radius.circular(9)),
                ),
              ),

全局主题 - 在程序入口

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "标题",
      theme: ThemeData(
          primarySwatch: Colors.green,
          splashColor: Colors.transparent,
          highlightColor: Colors.transparent,
          canvasColor: Colors.white, // 统一的页面背景色
      ),
      home: XMMainPage()
    );
  }
}

局部主题的使用 - 在具体的page页面

Widget build(BuildContext context) {
    return Theme( // 这里设置的主题会覆盖全局主题。不设置的属性就用全局的
      data: Theme.of(context).copyWith(
        primaryColor: Colors.red,
      ),
      child: Scaffold(
        appBar: AppBar(
          title: Text("我的"),
        ),