List.generate-生成一个列表

import 'package:flutter/material.dart';

void main() {
  //根据索引生成一个列表
  List<Widget> bts=List.generate(10, (index) => ElevatedButton(onPressed: (){}, child: Text("第$index个按钮")));
  Column column=Column(children: [
    Text("按钮头部",style: TextStyle(fontSize: 30),),
    ...bts//解包
  ],);

  runApp(MaterialApp(home: Center(child: Scaffold(body: column,),),));
}

Isolate.run()-执行耗时的任务

可以使用Isolate来进行密集运算，降低UI的延迟。
async关键字依旧会占用主线程的CPU资源、还是使用了主线程的事件循环。Isolate会建立新的线程，可以充分发挥多核CPU的优势。
Isolate拥有独立的内存，主线程也是一个Isolate.Isolate彼此之间通过消息来传递信息。传递的对象会进行深拷贝，不可变对象除外。如果只是需要运行之后返回结果那么使用run方法就行，需要多次传递消息的话得进一步学习定制isolate,当然，也可以试试worker_manager插件。

  Isolate.run(() {
  print('i am isolate');
  return 1;
  }).then((rt) {
    print("the return is $rt");
  });

SegmentedButton-多选按钮

可以设置多选、单选、是否允许不选。


class _MyAppState extends State<MyApp> {
  Set<int> selected={3};
  void change(Set<int> slct){
    setState(() {
      selected=slct;
    });
  }
  @override
  Widget build(BuildContext context) {
  var w=  SegmentedButton<int>(
    onSelectionChanged:change ,
    selectedIcon: Icon(Icons.panorama_wide_angle_select),
    showSelectedIcon: false,
    emptySelectionAllowed: true,
    multiSelectionEnabled:true,segments: List.generate(10, (index) {
      return ButtonSegment(value: index,label: Text("选项-$index",style: TextStyle(fontSize: 30),));
    }), selected: selected,);
    return Scaffold(body: w,);
  }
}

DropdownMenu-在大量的选项中选择

可以设置搜索和过滤功能，适用于大量的选项


class _MyAppState extends State<MyApp> {
  Color selected=Colors.blue;
  void change(Color? slct){
    if(slct ==null)return;
    setState(() {
      selected=slct!;
    });
  }
  @override
  Widget build(BuildContext context) {
  Widget w=  DropdownMenu(
    label: Text("颜色",style: TextStyle(fontSize: 25),),
    textStyle: TextStyle(fontSize: 30),
    enableFilter: false,
      width: 500.0,
      onSelected:change ,
      enableSearch: true,
      helperText: "这是一段帮助文字",
      hintText: "这是一段提示文字",
      initialSelection: selected,
      dropdownMenuEntries: <DropdownMenuEntry<Color>>[
    DropdownMenuEntry(value: Colors.black, label: "black"),
    DropdownMenuEntry(value: Colors.green, label: "green"),
    DropdownMenuEntry(value: Colors.yellow, label: "yellow"),
    DropdownMenuEntry(value: Colors.blue, label: "blue"),
    DropdownMenuEntry(value: Colors.purple, label: "purple")
  ]);
  w=Center(child: w,);
    return Scaffold(body: w,backgroundColor: selected,);
  }
}

Opacity-控制子组件透明度的组件

AnimatedOpacity的duration含义是当使用setstate函数改变opacity的值时，组件的透明度会从原来的透明度在这个时间内缓慢向新的透明度变化。


class _MyAppState extends State<MyApp> {
 double opct=1.0;
 double anmt=1.0;
  @override
  Widget build(BuildContext context) {

  Widget w=  Opacity(opacity: opct,child: Text("我爱编程,$opct",style: TextStyle(fontSize: 30),),);
  w=Column(children: [w,AnimatedOpacity(opacity: anmt, duration: Duration(seconds: 3),child:
    Text("世界和平",style: TextStyle(fontSize: 40),),)],);
  w=Center(child: w,);
    return Scaffold(body: w,floatingActionButton: FloatingActionButton(child:Text("透明度$opct"),onPressed: (){
      setState(() {
        if(opct==0.0){
          opct=1;
        }
        else {
          opct-=0.1;
        }
        anmt=0;
      });
    },),);
  }
}

AnimatedContainer-动画型容器，动画改变容器的各个属性

包括常见的属性，高度宽度背景颜色啥的


class _MyAppState extends State<MyApp> {
double wid=600;
double h=600;
Color c=Colors.red;
  @override
  Widget build(BuildContext context) {

  Widget w=AnimatedContainer(duration: Duration(seconds: 3)
    ,width: wid
    ,height: h,
    color: c,child: Icon(Icons.ac_unit)
  ,);

  return Scaffold(body: Center(child: w,),floatingActionButton: FloatingActionButton(onPressed: (){
   setState(() {
     if(c==Colors.red){
       c=Colors.blue;
       wid=100;
       h=100;
     }
     else {
       wid=600;
       h=600;
       c=Colors.red;
     }
   });
  },),);

  }
}

Wrap-将子组件自动换行，可以横向或纵向

Expanded-尽可能占用最多的空间

SafeArea-避免内容被通知栏遮挡

FutureBuilder-加载数据的时候显示提示信息

FloatingActionButton-位置可以变化的底部按钮


class _MyAppState extends State<MyApp> {

  Future<String> loadData()async{
    await Future.delayed(Duration(seconds: 3));
    return "LOAD FINISHED" ;
  }
  late Future<String> ft;
  void initState(){
    super.initState();
    ft=loadData();
  }
  Color bkc=Colors.red;
  @override
  Widget build(BuildContext context) {


    return Scaffold(
      body: Center(child: FutureBuilder(future: ft, initialData:"LOADING",builder: (ct,snapshot){
        String rs="加载中";
        String?data=snapshot.data;
        if(snapshot.connectionState==ConnectionState.done){
          rs="加载已经完成";
          bkc=Colors.green;

        }
        return Text("State:{$rs}  data:{$data}",style: TextStyle(fontSize: 50,backgroundColor: bkc),);
      }),),
      bottomNavigationBar:BottomAppBar(color:Colors.yellow,child: Container(height: 50,),),
      floatingActionButton: FloatingActionButton(onPressed: (){},
    child: Icon(Icons.add),),floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,);
  }
}

FadeTransition-淡入或者淡出的动画

通过设置begin和end的值可以实现淡入或者淡出。
需要使用SingleTickerProviderStateMixin类的一个实例。
通过controller.forward(from: 0.0)启动动画，根据需要设置from的值


class _MyAppState extends State<MyApp> with SingleTickerProviderStateMixin {
late AnimationController controller;
late Animation<double> animation;
  void initState(){

    controller=AnimationController(duration: Duration(seconds: 10),
        vsync: this);
    animation=Tween(begin: 0.0,end: 1.0).animate(controller);
  }

  @override
  Widget build(BuildContext context) {
  //controller.forward();
  return Scaffold(
    floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    floatingActionButton: FloatingActionButton(onPressed: (){

        controller.forward(from: 0.0);

    },),
    body: Center(child: FadeTransition(opacity: animation,
    child: Text("世界和平",style: TextStyle(fontSize: 100),),),),);
  }
}