开发技巧之 (Flutter) Dart扩展方法的使用

#Tips (Flutter)Dart扩展方法的应用

在kotlin中,我们可以通过编写自己的扩展方法,来复用一些常用的方法调用,这样能够快速的进行迭代开发,并且用起来也舒服,在Dart中有没有这样的方法可以操作呢,答案当然是有咯 ,但是这也只有在dart2.7版本才能够使用。

如果大家用Flutter开发, 可以看看自己的dart版本是否能够支持扩展方法呢。

flutter --version

参考链接:extension-methods

例1-字符串打印

比如我们要打印日志之类的方法,我们传统的方法就是这样

print("this is log");

但是有了扩展方法以后 我们能怎么做呢,

"this is log".print();

相当于就是

字符串.print()

这样做是不是很方便呢。 接下来我们就看下具体怎么实现的。

开发技巧之 (Flutter) Dart扩展方法的使用_第1张图片

是不是很简单呢,想要实现这样的扩展 只需要用这么用就行了

extension [可选参数  (填入你的名称) ] on 目标扩展类 

再来看一个类似的扩展String方法的 比如我们要把单词的第一个字符大写,那么我们就可以写这样一个扩展方法

例2-将字符串的第一个字符大写

开发技巧之 (Flutter) Dart扩展方法的使用_第2张图片

完整代码如下

void main() {
  print("this is log");
  
    "this is log".log();
    
    "xiaxiayige".toUpperCasForFirst().log();
  
  

  
}


extension  costom_string on String{
  
  void log(){
    print("log---> $this ");
  }
  
  
  String toUpperCasForFirst(){
    
    return "${this[0].toUpperCase()}${this.substring(1)}" ;
  }
  
}

打印结果

this is log
log---> this is log 
log---> Xiaxiayige 

在线验证:

https://dartpad.dev/

Flutter 例子-居中显示

接下来我们来写一个Flutter的例子,在Flutter中我们经常会用到的一个控件就是Center,必须包裹在上层,那么我们现在可以通过这种扩展方法,来实现居中的一个扩展方法了。

我们想要的效果

控件.center() / Widget.center()

看看我们原来的使用

class FilePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(

      child: Center(child: Text("text")),

    );
  }
}

现在的使用,首先添加扩展方法

extension costom_widget on Widget{
  Widget center(){
    return Center(
      child: this,
    );
  }
}

然后使用

class FilePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text("text").center(),
    );
  }
}

通过这种方式 我们不但可以减少层级的显示,使用起来更方便。

结束

怎么样,这种扩展方法是不是很喜欢呢,如果你通过flutter --version 发现你的dart版本低于2.7 那么可以试试使用flutter upgrade升级你的版本试试。
更多的使用大家可以去自行扩展哦。

注意

扩展虽好,但是不要滥用哦,如果有很多地方重复的写法,建议使用扩展方法来减少重复代码的编写。

你可能感兴趣的:(开发技巧,Flutter,flutter,dart)