detection.py

import gradio as gr
from detection import ObjectDetection

examples = [
    ['test-images/plant1.jpeg', 0.23],
    ['test-images/plant2.jpeg', 0.45],
    ['test-images/plant3.webp', 0.43],
]

def get_predictions(img, threshold, box_color, text_color):
    v8_results = yolov8_detector.v8_score_frame(img)
    v8_frame = yolov8_detector.plot_bboxes(v8_results, img, float(threshold), box_color, text_color)
    return v8_frame

# Load the YOLOv8 model for plant leaf detection and classification
yolov8_detector = ObjectDetection('Yolov8')

interface = gr.Interface(
    fn=get_predictions,
    inputs=[
        gr.Image(shape=(824, 824), label="Input Image"),
        gr.Slider(maximum=1, step=0.01, value=0.4, label="Confidence Threshold", interactive=True),
        gr.ColorPicker(label="Box Color", value="#FF8C00"),
        gr.ColorPicker(label="Prediction Color", value="#000000"),
    ],
    outputs=gr.Image(label="YOLOv8 Prediction"),
    examples=examples,
    live=True,
    title="Plant Leaf Detection and Classification",
)

# Custom CSS to create a dark mode appearance
custom_css = """
<style>
body {
    background-color: #222222;
    color: #FFFFFF;
}

h1, h2, h3, h4, h5, h6 {
    color: #FF8C00;
}

.gradio-interface {
    border: 1px solid #FF8C00;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.gradio-interface > .title {
    background-color: #FF8C00;
    color: #FFFFFF;
    padding: 12px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.gradio-interface > .content {
    padding: 20px;
}

.gradio-interface > .footer {
    background-color: #FF8C00;
    color: #FFFFFF;
    padding: 12px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
</style>
"""

# Inject custom CSS into the interface
interface.launch(share=False, custom_css=custom_css)