The best code scanning plug-in of flutter

best code scanning plug-in plug

For a long time ,Flutter All lack a simple and easy to use , Powerful QR code 、 Bar code scanning library , Need to be able to support both camera scanning code , It can also support local image code recognition . To solve this problem , I investigated the original scanning Ecology , Select the powerful HUAWEI ScanKit SDK, It was Flutter Package of plug-in .

Huawei's ScanKit SDK Support both Android, Also support iOS, At the same time, it also has the function of scanning code interface and library selection , It's very suitable to introduce Flutter The world .

Warehouse address : flutter_scankit

Chinese document

This is a code scanner Flutter plug-in unit , It is HUAWEI ScanKit SDK Of Flutter package .HUAWEI ScanKit It's a powerful library , Easy to use , The recognition rate of fuzzy smudge code is high , Code recognition speed is super fast .

Thanks to Huawei's ability to accumulate in the field of computer vision ,Scan Kit It can realize the detection and automatic amplification of long distance code or small code , At the same time, aiming at common complex code scanning scenarios ( Like reflection 、 Dark light 、 Stain 、 Fuzzy 、 cylinder ) It has done targeted identification optimization , Improve code scanning success rate and user experience .

  • Android
  • iOS

Sweep code

Scan Kit Support scanning 13 It's a global mainstream code system . If your application only deals with some specific code formats , You can also refer to custom type in the interface to speed up code scanning . Supported code formats :

  • One dimensional code :EAN-8、EAN-13、UPC-A、UPC-E、Codabar、Code 39、Code 93、Code 128、ITF-14
  • QR code :QR Code、Data Matrix、PDF417、Aztec

Support camera scan code and local image code recognition .


  1. Configure permissions
  2. Processing permission requests
  3. call API

Configure permissions


Add the following to ios/Runner/Info.plist in

<string> Explain to the user why you need this permission </string>
<string> Explain to the user why you need this permission </string>
 Copy code 

Be careful , Replace <string></string> Content of the label , Give the user a reason to need the permission .

Android doesn't need to be configured !

Permission request

stay Flutter in , You need a plug-in library to handle permissions , Here's another plug-in library I recommend :flutter_easy_permission, For detailed configuration, please see here .

open ios/Podfile file , Add the following configuration :

target 'Runner' do
flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
# Add the library of permissions you need here
pod 'LBXPermission/Camera'
pod 'LBXPermission/Photo'
 Copy code 

Then execute the command to install .

call API

 void initState() {
scanKit = FlutterScankit()
..addResultListen((val) {
// Return recognition results 
debugPrint("scanning result:$val");
onGranted: (requestCode, perms,perm) {
onDenied: (requestCode, perms,perm, isPermanent) {});
 Copy code 

Scan the code:

 // If you don't have permission, request 
if (!await FlutterEasyPermission.has(perms: _permissions,permsGroup: _permissionGroup)) {
FlutterEasyPermission.request(perms: _permissions,permsGroup: _permissionGroup);
} else {
// If you have permission, call 
Future<void> startScan() async {
try {
await scanKit.startScan(scanTypes: [ScanTypes.ALL]);
} on PlatformException {}
 Copy code 

About FlutterEasyPermission Usage of , Please check out here .


A complete example , Please have a look at here .


SDK It supports custom code scanning UI, But the plug-in has not been deeply packaged yet , Unable to support custom page , I'm going to take a little space later , Deep encapsulation through external texture , Support directly in Flutter Widget Layer custom scan interface .

Plug-in development

If you are right about Flutter I'm interested in plug-in development content , You can go to my online school to check 《Flutter Full plank development - Advanced 》 Curriculum , Exclusive in-depth analysis of the whole network about Flutter All aspects of plug-in development , The actual combat explains many cases ( Contains the plug-in development process )

Welcome to the official account : The way of programming is from 0 To 1

本文为[The way of programming from 0 to 1]所创,转载请带上原文链接,感谢

  1. Why did gitlab choose vue.js?
  2. HTTP-RPC: 轻量跨平台REST服务
  3. 继全面采用Node.js以后,PayPal分享大幅度踩坑GraphQL心得 - Mark Stuart
  4. vue组件化开发实战之滚动/轮播的实现
  5. Http-rpc: lightweight cross platform rest Service
  6. Following the full adoption of node.js, PayPal shares a great deal of graphql experience mark Stuart
  7. Implementation of rolling / carousel in Vue component development
  8. CSS是什么?这一篇全解,绝对有你想要的
  9. What is CSS? This is a complete solution, there is absolutely what you want
  10. 04-HTML5常用标签-HTML5极速入门
  11. 04-html5 common tags
  12. WEB前端全套零基础视频教程+软件2021最新编程视频
  13. Web front end full set of zero basic video tutorial + software 2021 latest programming video
  14. 使用Node, Mongo, React, Redux实现Token认证
  15. Using node, Mongo, react and Redux to realize token authentication
  16. 体面编码之CSS和HTML
  17. CSS and HTML for decent coding
  18. 使用Playwright基于多浏览器进行javascript自动化测试的简单教程- Applitools
  19. A simple tutorial for JavaScript automatic testing based on multi browser using playwright - applitools
  20. Minimum distance to target element
  21. 浅谈 React 中的 XSS 攻击
  22. XSS attack in react
  23. 自学前端教程整理,附不容错过的前端100篇文章合集
  24. Self taught front-end tutorial collation, with a collection of 100 front-end articles that can not be missed
  25. 使用OpenTracing跟踪Go中的HTTP请求延迟
  26. Using opentracing to track HTTP request latency in go
  27. Encapsulating databinding allows you to write less than 10000 lines of code
  28. 03-HTML5标签-HTML5极速入门
  29. 03-html5 tag-html5 quick start
  30. LayUI - 极易上手拿来即用的前端 UI 框架
  31. Layui - easy to use front end UI framework
  32. Interpretation of lodash source code (1)
  33. Why is the first parameter of node family callback error?
  34. 报告:JavaScript 开发者达1380 万,C#超越 PHP,Rust 增长最快
  35. Report: Javascript developers reach 13.8 million, C surpasses PHP, and rust grows fastest
  36. 小白前端入门笔记(10),怎么设置网站内部的超链接?
  37. How to set up hyperlinks inside the website?
  38. Using node and socket to realize online chat room
  39. The core competitiveness of Vue: data bidirectional binding
  40. React configuration agent
  41. CSS layout
  42. Application scenario explanation of Vue dynamic component
  43. Redux learning notes 04 -- using multiple reducers to manage data
  44. After three months of typescript writing, what have I learned?
  45. Node family - what is a callback?
  46. React -- a simple implementation of render & create element
  47. JS learning simple usage of jquery
  48. Seamless love
  49. 小白前端入门笔记(12),设置哑链接
  50. Small white front-end entry notes (12), set dumb links
  51. Vue2. X opens composition API and TSX
  52. Interview record and thinking of social recruitment for one and a half years (Alibaba, Tencent, baidu offer)
  53. Flex learning notes
  54. The most essential closure article in the eastern hemisphere
  55. 2021-05-03 hot news
  56. Sword finger offer -- reverse order pair in array (JS Implementation)
  57. Working process of scaffold
  58. Use decorator mode to strengthen your fetch
  59. [JS] scope (Introduction)
  60. Employment information statistics network (interface document)