Streamlit Cloud + QR code

Hello Streamlit friends!

I played around with Streamlit the last couple of weeks and I can’t deny that I’m extremely enthusiastic about it. This is all I could wish for!

And I want to use this tool to help automating stuff for the company that I work for now. So I was wondering if the following is possible:

  • I want to create an app that’s hosted with Streamlit
  • I would like to use the camera of a smartphone within that app to scan QR codes

Could anyone show me an example of someone who made something like this? I can see examples of camera’s that are being used but not with scanning QR-codes. Even though that would be a great use case if you ask me.

Any advice is very welcome!

Hope to hear from you!

Greetings,

Kris

From Amsterdam

1 Like

Hi @Data_Dam, welcome to the forum!

Here’s a simple example app that does the trick using open-cv

import cv2
import numpy as np
import streamlit as st

image = st.camera_input("Show QR code")

if image is not None:
    bytes_data = image.getvalue()
    cv2_img = cv2.imdecode(np.frombuffer(bytes_data, np.uint8), cv2.IMREAD_COLOR)

    detector = cv2.QRCodeDetector()

    data, bbox, straight_qrcode = detector.detectAndDecode(cv2_img)

    st.write("Here!")
    st.write(data)
1 Like

Hi Blackary!

Thanks for your quick response. Love it.

When I test this code, I see that I first need to take a picture before I can encode the QR-code. It is possible to let Streamlit check every frame of the incoming camera footage to check for a QR-code right? Hope so!

Greetings,

Kris

Hi @Data_Dam,

I wasn’t aware of a simple way to do that, but it seems like a useful thing to have in the streamlit ecosystem, so I created a new component: New Component: Streamlit camera live input

You can see the example app at https://camera.streamlitapp.com and the source code here.

1 Like