[已使用其他插件,这个插件长久不更新]
flutter项目中使用到了二维码扫描,尝试了很多插件,有的很简陋,简陋到扫描页面无法自定义,有的很详尽,使用起来很麻烦。一个一个的尝试,终于遇到了一个满意的插件:scan。
先上效果图:
scan使用起来非常方便,也很容易自定义扫描页面,非常棒!
使用步骤开启:
1.在pubspec.yaml文件中引入插件:
scan: ^1.5.0
images_picker: ^1.2.9
permission_handler: ^8.3.0
2.开始自定义扫描页面
class ScanPage extends StatelessWidget {
final String phoneNumber;
ScanPage({Key? key, required this.phoneNumber}) : super(key: key);
IconData lightIcon = Icons.flash_on;
final ScanController _controller = ScanController();
void getResult(String result, BuildContext context){
//TODO
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: IAppBar(
"扫码"
),
body: Stack(
children: [ScanView(
controller: _controller,
scanLineColor: Color(0xFF4759DA),
onCapture: (data) {
_controller.pause();
getResult(data,context);
},
),
Positioned(
left: WH.w(100),
bottom: WH.w(100),
child: StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return MaterialButton(
child: Icon(lightIcon,size: WH.w(80),color: Color(0xFF4759DA),),
onPressed: (){
_controller.toggleTorchMode();
if (lightIcon == Icons.flash_on){
lightIcon = Icons.flash_off;
}else {
lightIcon = Icons.flash_on;
}
setState((){});
}
);
},
),
),
Positioned(
right: WH.w(100),
bottom: WH.w(100),
child: MaterialButton(
child: Icon(Icons.image,size: WH.w(80),color: Color(0xFF4759DA),),
onPressed: () async {
List<Media>? res = await ImagesPicker.pick(
count: 1,
maxSize: 1024
);
if (res != null) {
_controller.pause();
Media image = res.first;
String? result = await Scan.parse(image.path);
if(result != null){
getResult(result,context);
}
}
}
),
),
]
),
);
}
}
3.遇到小bug,这样第一次进入询问权限的时候,会卡顿,导致第一次扫码会黑屏,于是,我进入之前就开始请求权限,有权限后我再进入扫描页面。这个用的是permission_handler插件。
scan() async {
var status = await Permission.camera.request();
if(status.isGranted){
App.go(
context,
ScanPage(widget.countyCode,widget.phoneNumber)
);
}
}
这样,既方便,又好看。真是个不错的插件,为插件作者打call!
插件地址:
https://pub.dev/packages/scan/install