网站制作方案要点,上海网站开发外包公司,oa办公系统如何使用,个人博客网页素材前言
这csdn真的是服了#xff0c;图片里有个二维码就直接变成违规图片了。至于效果的话#xff0c;自己运行一下看看吧。
生成
flutter中生成二维码可以使用 qr_flutter。
官方文档 https://pub-web.flutter-io.cn/packages/qr_flutter
安装
flutter pub add qr_flutt…前言
这csdn真的是服了图片里有个二维码就直接变成违规图片了。至于效果的话自己运行一下看看吧。
生成
flutter中生成二维码可以使用 qr_flutter。
官方文档 https://pub-web.flutter-io.cn/packages/qr_flutter
安装
flutter pub add qr_flutter示例
示例1
QrImageView(data: https://pub-web.flutter-io.cn/packages/qr_flutter, // 数据version: QrVersions.auto, // 版本选择自适应size: 200.0, // 大小),示例2
QrImageView(data: https://pub-web.flutter-io.cn/packages/qr_flutter, // 数据version: QrVersions.auto, // 版本选择自适应size: 200.0, // 大小embeddedImage: const AssetImage(lib/assets/image/flutter.png), // 图片embeddedImageStyle: const QrEmbeddedImageStyle( // 设置图像样式size: Size(40, 40),),),官方提供的方式无法在图片周围生成间隙。但其实我们可以使用堆叠组件来实现。
Stack(children: [QrImageView(data: qrData, // 数据version: QrVersions.auto, // 版本选择自适应size: 200.0, // 大小),Positioned(top: 0,left: 0,right: 0,bottom: 0,child: Center(child: Container(width: 30,height: 30,margin: const EdgeInsets.all(5),padding: const EdgeInsets.all(5),decoration: BoxDecoration(borderRadius: BorderRadius.circular(5),color: Colors.white,),child: Image.asset(lib/assets/abc.png),),))],
)注意 要保证二维码的信息量足够多也就是二维码本身的内容多也不要太多图片也不要太大。如果二维码的信息丢失过多会导致无法识别二维码。
读取
flutter中读取二维码可以使用qr_code_scanner。
官方网站 添加链接描述
安装
flutter pub add qr_code_scanner问题 在进行真机运行时报错了
uses-sdk:minSdkVersion 16 cannot be smaller than version 20 declared in library [:qr_code_scanner]原因是qr_code_scanner库要求的最低Android SDK版本为20。可以打开项目的android/app/build.gradle文件找到minSdkVersion并将其修改为20或更高的值
补充 这里再使用vibration库该库可以处理振动。当扫描成功后再振动一下更加的友好。
官方文档https://pub-web.flutter-io.cn/packages/vibration
class MyHomePage extends StatefulWidget {const MyHomePage({super.key, required this.title});final String title;overrideStateMyHomePage createState() _MyHomePageState();
}class _MyHomePageState extends StateMyHomePage {// 创建一个全局的keyfinal GlobalKey qrKey GlobalKey(debugLabel: QR);// 结果、控制器Barcode? result;QRViewController? controller;overridevoid reassemble() {super.reassemble();if (controller?.pauseCamera ! null) {controller!.pauseCamera();} else {controller!.resumeCamera();}}overridevoid dispose() {super.dispose();controller?.dispose();}overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(backgroundColor: Theme.of(context).colorScheme.inversePrimary,title: Text(widget.title),),body: Column(children: Widget[Expanded(flex: 5,child: QRView(key: qrKey,onQRViewCreated: _onQRViewCreated,// 中间的扫描区域也可以不要加上看着更舒服overlay: QrScannerOverlayShape(borderColor: Colors.red,borderRadius: 10,borderLength: 30,borderWidth: 10,cutOutSize: 300)),),Expanded(flex: 1,child: Center(child: (result ! null)? Text(Barcode Type: ${describeEnum(result!.format)} Data: ${result!.code}): const Text(Scan a code),),)],),);}void _onQRViewCreated(QRViewController controller) {this.controller controller;controller.scannedDataStream.listen((scanData) {// 默认振动500msVibration.vibrate();setState(() {result scanData;});});}
}
