Android

[Android] Qr Zxing 라이브러리 적용하기

2023. 11. 25. 17:25
목차
  1. Qr 인식 페이지
  2. 기본 Qr인식 화면
  3. Flash를 추가한 커스텀 화면
반응형

https://github.com/journeyapps/zxing-android-embedded

 

GitHub - journeyapps/zxing-android-embedded: Barcode scanner library for Android, based on the ZXing decoder

Barcode scanner library for Android, based on the ZXing decoder - GitHub - journeyapps/zxing-android-embedded: Barcode scanner library for Android, based on the ZXing decoder

github.com

 

이 깃허브에 들어가게 되면

build.gradle에 추가하기!

implementation 'com.journeyapps:zxing-android-embedded:4.3.0'

 

Qr코드의 생성과 인식을 둘다 하기위해 페이지 구현

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/btnCreate"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:text="QR 생성"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:layout_marginTop="10dp"
        android:id="@+id/btnScan"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:text="QR 인식"
        app:layout_constraintTop_toBottomOf="@+id/btnCreate"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>
class MainActivity : AppCompatActivity() {

    private lateinit var binding : ActivityMainBinding
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)

        binding.btnCreate.setOnClickListener {
            val intent = Intent(this, CreateQRActivity::class.java)
            startActivity(intent)
        }

        binding.btnScan.setOnClickListener {
            val intent = Intent(this, ScanQRActivity::class.java)
            startActivity(intent)
        }
    }
}

 

처음 화면부터 만들어주고

 

다음은 Qr이미지 생성하러!!

Qr 인식 페이지

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".CreateQRActivity">

    <ImageView
        android:id="@+id/imageViewQrCode"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toTopOf="@+id/btn_album"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/btn_album"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="사진 저장"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>
class CreateQRActivity : AppCompatActivity() {

    private lateinit var binding : ActivityCreateqrBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityCreateqrBinding.inflate(layoutInflater)
        setContentView(binding.root)

        try {
            val barcodeEncode = BarcodeEncoder()
            // Qr 코드안에 담고싶은 내용을 담으면 됩
            val bitmap = barcodeEncode.encodeBitmap("Viva yun Tistory", BarcodeFormat.QR_CODE, 400, 400)
            val imageViewQrCode : ImageView = binding.imageViewQrCode
            imageViewQrCode.setImageBitmap(bitmap)
        } catch (e : Exception) {
            Toast.makeText(this, "네트워크 에러", Toast.LENGTH_SHORT).show()
        }
    }
}

 

이렇게 넣어주면

 

간단하게 이미지 생성페이지까지 완료

 

다음은 인식하러 가야죠

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ScanQRActivity">


    <Button
        android:id="@+id/btnScan"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="250dp"
        android:text="SCAN"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/btnCustomScan"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="Custom SCAN"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/btnScan" />

    <TextView
        android:id="@+id/txtResult"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="#eaeaea"
        android:padding="10dp"
        android:text="결과 텍스트"
        android:textAlignment="center"
        android:textColor="@color/black"
        android:textSize="15sp"
        app:layout_constraintTop_toBottomOf="@+id/btnCustomScan"/>

</androidx.constraintlayout.widget.ConstraintLayout>

 

기본 Qr인식 화면

결과 화면도 보기위해 text 추가

<merge xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

    <com.journeyapps.barcodescanner.BarcodeView
        android:id="@+id/zxing_barcode_surface"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:zxing_framing_rect_height="300dp"
        app:zxing_framing_rect_width="300dp"
        app:zxing_preview_scaling_strategy="fitCenter" />

    <com.journeyapps.barcodescanner.ViewfinderView
        android:id="@+id/zxing_viewfinder_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:zxing_possible_result_points="@color/zxing_custom_possible_result_points"
        app:zxing_result_view="@android:color/holo_orange_light"
        app:zxing_viewfinder_laser="@color/zxing_custom_viewfinder_laser"
        app:zxing_viewfinder_laser_visibility="true"
        app:zxing_viewfinder_mask="@color/zxing_custom_viewfinder_mask" />

    <!-- mask 영역에 적혀있는 스캔 안내 문구 영역 -->
    <TextView
        android:id="@+id/zxing_status_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        android:background="@color/zxing_transparent"
        android:padding="10dp"
        android:text="@string/zxing_msg_default_status"
        android:textColor="@color/zxing_status_text" />

</merge>
class ScanQRActivity : AppCompatActivity() {

    private lateinit var binding : ActivityScanqrBinding

    private val barcodeLauncher = registerForActivityResult(ScanContract()) { result: ScanIntentResult ->
        if (result.contents == null) {
            Toast.makeText(this, "Cancelled", Toast.LENGTH_SHORT).show()
        } else {
            Toast.makeText(this, "Scanned : " + result.contents, Toast.LENGTH_SHORT).show()

            binding.txtResult.text = result.contents.toString()

        }
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityScanqrBinding.inflate(layoutInflater)
        setContentView(binding.root)

        binding.btnScan.setOnClickListener {
            onScanButtonClicked()
        }

        binding.btnCustomScan.setOnClickListener {
            onCustomScanButtonClicked()
        }

    }

    private fun onScanButtonClicked(){
        // 세로모드
        var options = ScanOptions()
        options.setOrientationLocked(false)
        barcodeLauncher.launch(ScanOptions())
    }

    private fun onCustomScanButtonClicked(){
        val options = ScanOptions()
        options.setOrientationLocked(false)
        options.setBeepEnabled(true)
        options.setPrompt("커스텀 QR 스캐너")
        options.captureActivity = CustomQrScannerActivity::class.java

        barcodeLauncher.launch(options)
    }
}

Flash를 추가한 커스텀 화면

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.journeyapps.barcodescanner.DecoratedBarcodeView
        android:id="@+id/decoratedBarcodeView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:zxing_scanner_layout="@layout/custom_barcode_scanner" />

    <ImageView
        android:id="@+id/btnFlash"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="10dp"
        android:src="@drawable/ic_new_contest_active"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>
class CustomQrScannerActivity : AppCompatActivity() {

    private lateinit var binding : ActivityCustomQrScannerBinding
    private lateinit var captureManager : CaptureManager
    private lateinit var decoratedBarcodeView : DecoratedBarcodeView

    private var isFlash = false

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityCustomQrScannerBinding.inflate(layoutInflater)
        setContentView(binding.root)

        decoratedBarcodeView = binding.decoratedBarcodeView

        captureManager = CaptureManager(this, decoratedBarcodeView)
        captureManager.initializeFromIntent(intent, savedInstanceState)
        captureManager.setShowMissingCameraPermissionDialog(true, "카메라 권한 요청")
        captureManager.decode()

        binding.btnFlash.setOnClickListener {
            if (!isFlash) {
                isFlash = true
                decoratedBarcodeView.setTorchOn()
            } else {
                isFlash = false
                decoratedBarcodeView.setTorchOff()
            }
        }
    }

    override fun onResume() {
        super.onResume()
        captureManager.onResume()
    }

    override fun onPause() {
        super.onPause()
        captureManager.onPause()
    }

    override fun onDestroy() {
        super.onDestroy()
        captureManager.onDestroy()
    }

    override fun onSaveInstanceState(outState: Bundle) {
        super.onSaveInstanceState(outState)
        captureManager.onSaveInstanceState(outState)
    }

    override fun onRequestPermissionsResult(
        requestCode: Int,
        permissions: Array<out String>,
        grantResults: IntArray
    ) {
        super.onRequestPermissionsResult(requestCode, permissions, grantResults)
        captureManager.onRequestPermissionsResult(requestCode, permissions, grantResults)
    }
}

 

 

결과 페이지 까지 완료

반응형
저작자표시 비영리 변경금지 (새창열림)

'Android' 카테고리의 다른 글

[Android] App Main Icon 적용하기  (0) 2023.03.24
[Android] Coroutines  (0) 2023.03.21
[Android] Lottie Splash  (0) 2023.02.24
[Android] 양방향 DataBinding  (0) 2023.02.09
[Android] LiveData  (0) 2023.02.06
  1. Qr 인식 페이지
  2. 기본 Qr인식 화면
  3. Flash를 추가한 커스텀 화면
'Android' 카테고리의 다른 글
  • [Android] App Main Icon 적용하기
  • [Android] Coroutines
  • [Android] Lottie Splash
  • [Android] 양방향 DataBinding
yunJaem06
yunJaem06
yunJaem06
비바윤
yunJaem06
전체
오늘
어제
  • 전체 (147)
    • Algorithm (121)
      • [알고리즘]BACKJOON - Java&Kotli.. (98)
      • Java알고리즘 문제풀이 & Kotlin (23)
    • Kotlin (4)
    • Android (17)
    • CS (1)
      • 소프트웨어공학 (1)
      • 운영체제 (0)
      • 컴퓨터구조 (0)
    • 내가 좋아하는 맛집 :) (0)
    • 다시 볼만한 영화 & 드라마 (0)

블로그 메뉴

  • 홈

공지사항

인기 글

태그

  • 양방향
  • qr
  • 중복문자제거
  • 생명주기
  • 캡슐화
  • zxing
  • Kotlin In Action
  • splash화면
  • Livedata
  • ViewModelFactory
  • Lifecycle
  • 안드로이드
  • 알고리즘
  • 라이브러리
  • MutableLiveData
  • 가위 바위 보
  • Kotiln
  • Android
  • Java
  • 3장
  • 특정 문자 뒤집기
  • ViewModel
  • AndroidViewModel
  • reversed
  • kotlin
  • 배열
  • lottie
  • DataBinding
  • 코틀린
  • 1장

최근 댓글

최근 글

hELLO · Designed By 정상우.
yunJaem06
[Android] Qr Zxing 라이브러리 적용하기
상단으로

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.