flutter开发中的几个小技巧

1,062 阅读2分钟

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。

今天我会与大家分享flutter开发中的几个小技巧

关于排序:如何根据函数返回的值对dart中的List进行排序

void main(){
  List<POJO> pojo = [POJO(5), POJO(3),POJO(7),POJO(1)];
// fill list
​
pojo..sort((a, b) => a.id.compareTo(b.id));
  for(var i in pojo){
    print(i.id);      // prints list in sorted order i.e 1 3 5 7
  }
​
}
​
class POJO {
  int id;
​
  POJO(this.id);
}

关于android:Flutter TabBarView不断调用构建器

我的tabBar有一个StatelessWidget小部件,其中包含2个statefulWidgets。事实是,当单击管理器以查看我的所有选项卡时(默认情况下在我的第一个选项卡上登陆),tab1小部件生成器一直被调用。

我已经尝试了这两种方法,但是它们没有用:

扑朔迷离的多标签页/页面视图

将Flutter切换到选项卡将重新加载小部件并运行FutureBuilder

这真的很烦人,因为在某些小部件中,我需要发出一些http请求,并且它们也一直被调用。

这是我的tab1页面,它是一个stateFulWidget

body:  TabBarView(
        children: <Widget>[
          Tab1Page(),
          Tab2Page(),

这是我的调试器的打印记录:

Widget build(BuildContext context) {
// TODO: implement build
print("tab1: Builder");
return ScopedModelDescendant<MainModel>(
  builder: (BuildContext context, Widget child, MainModel model) {
    List<SolicitudDto> listadoSolicitudesAprobadas =
        model.obtenerSolicitudesPendientes();
​
    return Scaffold(
      body: ListView(
        children: <Widget>[
          _buildCards(context, listadoSolicitudesAprobadas)
        ],
      ),
    );
  },
);

enter

相关讨论


如果要在TabBarView中保留屏幕状态,可以在State类中使用名为AutomaticKeepAliveClientMixin的mixin类。

此后,您必须重写wantKeepAlive方法并返回true。

您可以尝试通过这种方式来避免每次切换选项卡时都请求数据

 //global variable at your state class
​
  List<SolicitudDto> listadoSolicitudesAprobadas;
​
​
  Widget build(BuildContext context) {
  // TODO: implement build
  print("tab1: Builder");
  return ScopedModelDescendant<MainModel>(
    builder: (BuildContext context, Widget child, MainModel model) {
         if (listadoSolicitudesAprobadas == null){
          listadoSolicitudesAprobadas =   model.obtenerSolicitudesPendientes();
        }
​
      return Scaffold(
        body: ListView(
          children: <Widget>[
            _buildCards(context, listadoSolicitudesAprobadas)
          ],
        ),
      );
    },
  );

Flutter使垂直appBar

在应用程序中,我想在不同页面中创建一个具有自定义标题的垂直appBar:

您可以使用RotatedBox旋转AppBar,但是您将无法使用Scaffold中的AppBar参数,因为该参数需要水平的。

class VerticalAppBar extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RotatedBox(
      quarterTurns: 3,
      child: AppBar(
        primary: false,
        title: Text('My Bar'),
      ),
    );
  }
}