QR Code Development

모바일 앱에서의 QR Codes: 네이티브 생성과 스캔

<\/script>\n
'; }, get iframeSnippet() { const domain = 'qrcodefyi.com'; const type = 'guide'; const slug = 'mobile-app-qr'; return ''; }, get activeSnippet() { return this.method === 'script' ? this.scriptSnippet : this.iframeSnippet; }, copySnippet() { navigator.clipboard.writeText(this.activeSnippet).then(() => { this.copied = true; setTimeout(() => { this.copied = false; }, 2000); }); } }" @keydown.escape.window="open = false" @click.outside="open = false">

Embed This Widget

Theme


      
    


    
    

      Widget powered by
      .
      Free, no account required.
    

  




  
  
  
QR code integration in iOS (Swift, Vision) and Android (Kotlin, ML Kit): generation, camera scanning, and UX patterns.

  
  

    
  








  
  

    
    
      
      
  1. 
        QR Codes in Mobile Apps: Native Generation and Scanning
      
    2. 
      
      
  2. 
        iOS: Vision Framework (Scanning)
      
    3. 
      
      
  3. 
        iOS: Core Image (Generation)
      
    4. 
      
      
  4. 
        Android: ML Kit (Scanning)
      
    5. 
      
      
  5. 
        Android: ZXing (Generation)
      
    6. 
      
      
  6. 
        UX Patterns
      
    7. 
      
      
  7. 
        Key Takeaways
      
    8. 
      
    

  









  
  

  
  

    
    

      
QR Codes in Mobile Apps: Native Generation and Scanning


Integrating QR code generation and scanning into iOS and Android apps using native frameworks provides the best performance and user experience.


iOS: Vision Framework (Scanning)


iOS provides native QR scanning through the Vision framework:


import Vision

let request = VNDetectBarcodesRequest { request, error in
    guard let results = request.results as? [VNBarcodeObservation] else { return }
    for barcode in results {
        if barcode.symbology == .qr {
            print("QR data: \(barcode.payloadStringValue ?? "")")
        }
    }
}



Vision framework advantages: no third-party dependencies, Apple-optimised performance, automatic orientation correction.


iOS: Core Image (Generation)


Generate QR codes natively on iOS:


import CoreImage

let data = "https://example.com".data(using: .utf8)!
let filter = CIFilter(name: "CIQRCodeGenerator")!
filter.setValue(data, forKey: "inputMessage")
filter.setValue("M", forKey: "inputCorrectionLevel")
let ciImage = filter.outputImage!



Android: ML Kit (Scanning)


Google ML Kit provides reliable QR scanning:


val scanner = BarcodeScanning.getClient(
    BarcodeScannerOptions.Builder()
        .setBarcodeFormats(Barcode.FORMAT_QR_CODE)
        .build()
)

scanner.process(inputImage)
    .addOnSuccessListener { barcodes ->
        for (barcode in barcodes) {
            val data = barcode.rawValue
        }
    }



Android: ZXing (Generation)


Generate QR codes on Android using ZXing:


val writer = MultiFormatWriter()
val matrix = writer.encode(
    "https://example.com",
    BarcodeFormat.QR_CODE, 512, 512
)



UX Patterns


Camera scanning UX:
- Show a viewfinder overlay guiding the user to frame the QR code
- Provide haptic feedback on successful decode
- Display the decoded content with a confirmation action (do not auto-navigate)
- Handle the "no QR code found" state gracefully


QR display UX:
- Generate at sufficient size (minimum 200x200 points)
- Adjust brightness to maximum when displaying a QR code for scanning
- Provide a "share" action to send the QR code image


Key Takeaways


    

  • iOS Vision framework provides native scanning without dependencies
    • 

  • iOS Core Image generates QR codes through CIQRCodeGenerator filter
    • 

  • Android ML Kit is the recommended scanning library
    • 

  • Always show decoded content before acting (no auto-navigation)
    • 

  • Maximise screen brightness when displaying QR codes for scanning
    •