File size: 2,851 Bytes
6084325
8102829
6084325
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8102829
368d01c
8102829
 
 
6084325
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
import qrcode
import cv2
from PIL import Image
import gradio as gr
import tempfile
import os

# Function to generate a QR code
def generate_qr(data):
    qr = qrcode.QRCode(
        version=1,
        error_correction=qrcode.constants.ERROR_CORRECT_L,
        box_size=10,
        border=4,
    )
    qr.add_data(data)
    qr.make(fit=True)
    img = qr.make_image(fill="black", back_color="white")

    # Save to a temporary file and return the file path
    temp_file = tempfile.NamedTemporaryFile(delete=False, suffix=".png")
    img.save(temp_file.name, format="PNG")
    temp_file.close()  # Close the file to flush contents to disk
    return temp_file.name

# Function to read a QR code using OpenCV
def read_qr(img):
    detector = cv2.QRCodeDetector()
    data, _, _ = detector.detectAndDecode(img)
    return data if data else "No QR code found."

# Custom CSS styling as HTML for dark mode
custom_css = """
<style>
    body {background-color: #1e1e2f; font-family: Arial, sans-serif; color: #e0e0e0;}
    .gradio-container {max-width: 600px; margin: auto; padding: 20px; background-color: #2c2c3e; border-radius: 10px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);}
    h1, h2 {text-align: center; color: #f0f0f0; font-weight: 600;}
    .gr-button {background-color: #3a3a4f; color: #e0e0e0; padding: 10px 20px; border-radius: 5px; font-size: 15px; border: none;}
    .gr-button:hover {background-color: #505068;}
    input, textarea, .gr-box {background-color: #3a3a4f; border: 1px solid #555; border-radius: 5px; padding: 10px; font-size: 14px; color: #e0e0e0;}
    .gr-box:hover, input:hover, textarea:hover {border-color: #777;}
</style>
"""

# Gradio interface for generating and reading QR codes
def create_gradio_interface():
    # QR Code Generator Interface
    generate_interface = gr.Interface(
        fn=generate_qr,
        inputs=gr.Textbox(placeholder="Enter text or URL here...", label="Data to Encode"),
        outputs=gr.Image(label="Generated QR Code"),
        title="Generate QR Code",
        description="Quickly create a QR code from any text or URL.",
    )

    # QR Code Reader Interface
    read_interface = gr.Interface(
        fn=read_qr,
        inputs=gr.Image(type="pil", label="Upload QR Code Image"),
        outputs=gr.Textbox(label="Decoded Data"),
        title="Read QR Code",
        description="Upload an image with a QR code to decode the embedded data.",
    )

    # Combine interfaces into a single tabbed layout
    interface = gr.TabbedInterface(
        [generate_interface, read_interface],
        ["Generate QR Code", "Read QR Code"]
    )

    # Launch interface with custom HTML for CSS styling
    with gr.Blocks() as demo:
        gr.HTML(custom_css)  # Embed the custom CSS
        interface.render()

    demo.launch(share=True)

# Run the Gradio interface
create_gradio_interface()