Flutter 冷门组件

一、Checkbox

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class selectCheckBox extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return MyState();
  }
}

class MyState extends State {
  List flag =[false,false,false] ;
  List select=['张三','李四'];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('用户注册'),
        centerTitle: true,
      ),
      body: Row(
        children: <Widget>[
          Text('选择你的名字撒：   '),
          Text(select[0]),
          Checkbox(
            value: flag[0],
            tristate: true,
            activeColor: Colors.red,
            checkColor: Colors.black,
            hoverColor: Colors.pink,
            focusColor: Colors.yellow,
            onChanged: (value) {
              //setState更新值
              setState(() {
                flag[0] = value!;
              });
            },
          ),
          Text(select[1]),
          Checkbox(
            value: flag[1],
            onChanged: (value) {
              //setState更新值
              setState(() {
                flag[1] = value!;
              });
            },
          ),
          Text(select[2]),
          Checkbox(
            value: flag[2],
            onChanged: (value) {
              //setState更新值
              setState(() {
                flag[2] = value!;
              });
            },
          ),
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          String info="你选择的阵营是：";
          for(int i=0;i<flag.length;i++){
            if(flag[i]) {/*如果选项被选中*/
              info = info + select[i]+' ';
            }
          }print(info);
        },
        tooltip: 'Increment',
        child: Icon(Icons.save),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.endTop, //浮标的位置
    );
  }
}

CheckBox

二、PhysicalModel

设置阴影、圆角

   PhysicalModel(
              color: Colors.orange,
              elevation: 40.0,
              // borderRadius: BorderRadius.circular(100),
              shape: BoxShape.circle,
              child: FlutterLogo(size: 200,),
            ),            

三、PhysicalShape

设置特殊形状的图

    PhysicalShape(
              clipper: sanJiaoClipper(),
              color: Colors.blue,
              child: FlutterLogo(size: 200,),
            ),

绘制三角形

class sanJiaoClipper extends CustomClipper<Path>{
  @override
  Path getClip(Size size) {
    // TODO: implement getClip
    return Path()
      ..moveTo(0.0,size.height)
      ..lineTo(size.width/2.0, 0.0)
      ..lineTo(size.width, size.height)
      ..close();
  }

  @override
  bool shouldReclip(covariant CustomClipper<Path> oldClipper) {
    // TODO: implement shouldReclip
    throw UnimplementedError();
  }
}

4、ListWheelScrollView

滑动的pick

child: ListWheelScrollView.useDelegate(
             itemExtent: 150,
             childDelegate: ListWheelChildBuilderDelegate(
                 builder: (context, index) {
                   return Container(
                     margin: EdgeInsets.symmetric(vertical: 10, horizontal: 30),
                     color: Colors.primaries[index % 10],
                     alignment: Alignment.center,
                     child: Text('$index'),
                   );
                 },
                 childCount: 100),
           ),

image.png