Crosshair

[Patresko]

Is it possible to add some crosshair on camera screen to let user know where he should point barcode or qr for scanning?

[cfwdman]

@Patresko, for usability reasons I wanted a "frame" and some text to appear indicating that the camera can be used for scanning. Hence I embedded the CodeScannerView into an ZStack with a nested VStack adding text and rectangle... as my (food/grocery barcodes are not rectangular but have a ratio of aprox 1:4 i scaled the frame accordingly. Overlays in SwiftUI are pretty simple

The following works for me:

    ZStack {
        CodeScannerView(codeTypes: [.ean13, .ean8, .itf14], simulatedData: "5055650308599", completion: self.handleScan)  // simulated data is nutell ;-)
         GeometryReader { geometry in
            VStack(alignment: .center) {
                Text("Scan Articles or swipe down").foregroundColor(Color(UIColor.yellow).opacity(0.7))
                Rectangle().fill(Color.clear).frame(width: geometry.size.width * 0.8, height: geometry.size.width * 0.8 * 0.25).overlay(
                                        RoundedRectangle(cornerRadius: 5)
                                            .stroke(
                                                style: StrokeStyle(
                                                    lineWidth: 1,
                                                    dash: [5]
                                                )
                                            ).foregroundColor(Color(UIColor.yellow).opacity(0.7))
                                    )
            }.frame(width: geometry.size.width * 1.0, height: geometry.size.height * 1.0)
         }
    }

[twostraws]

Set showViewfinder to true when creating your CodeScannerView to get a built-in viewfinder.