본문 바로가기
도전/플러터(Flutter)

플러터 QR인식 패키지(qr_code_scanner)

by MWT 2023. 1. 13.

QR코드를 활용한 어플을 만들어보고 있다.

https://pub.dev/packages/qr_code_scanner

 

qr_code_scanner | Flutter Package

QR code scanner that can be embedded inside flutter. It uses zxing in Android and MTBBarcode scanner in iOS.

pub.dev

많은 사람들이 사용하는 것 같아 이 패키지를 선택했고, 위 링크의 예제(Example)를 조금만 변형하여 사용해보았다.

 

좋은 점은 QR코드 스캔을 실행할 때 따로 카메라 어플이 켜지는 것이 아니고 하나의 위젯으로서 배치할 수 있다는 점이다. 예제 코드가 이미 Expaned위젯에서 flex 값을 조정하여 카메라 화면 아래에 텍스트나 버튼을 배치할 수 있도록 작성되어 있어 편리해보였다. 사실 다른 패키지 다운받아서 이리 저리 만지는 게 귀찮아서 골랐다. 

 

나는 카메라 화면 아래에 인식한 데이터(출석자 명단)를 나열하여 표시하고 싶어서 아래 사진과 같이 임시로 위젯을 배치했다. 아래쪽 파란 버튼들은 예제에 있는 버튼들이고 모두 잘 작동해서 일단 그냥 뒀다.

 

디자인이 참 구리다. 이건 내 탓이다. 패키지는 멀쩡하다.

다만, 인식한 데이터를 카메라 화면 바로 아래에 있는 Text위젯("QR코드 스캔중")에서 읽어주는 것이 너무 밋밋했다. 뭔가 팝업창이 뜨거나 다른 화면으로 넘어가고 싶었는데, 패키지에서는 그런 기능을 찾지 못했다(그냥 내가 못찾은 것일 수도 있다.). 그래서 여기저기 만지며 '카메라로 QR코드를 인식하면 다른 창으로 넘어가거나 팝업을 띄우는, 즉 새롭게 Build하는 코드를 작성해보았다. 꽤 골치가 아팠지만 어쨌든 성공했다. 다음 글에서 다루겠다.