construido por control deslizante de imágenes

gradio_imageslider

Un componente Gradio para comparar dos imágenes.

Este componente se puede utilizar de varias maneras:

• como una entrada/salida unificada donde los usuarios cargarán una única imagen y una función de inferencia generará una imagen con la que se podrá comparar (ver demostración),
• como entrada de carga manual que permite a los usuarios comparar dos de sus propias imágenes (que luego pueden transmitirse a otro lugar, por ejemplo, a un modelo),
• como componente de salida estático que permite a los usuarios comparar dos imágenes generadas por una función de inferencia.

Instalación

pip install gradio_imageslider

Uso

 import gradio as gr
from gradio_imageslider import ImageSlider
from PIL import ImageFilter


def fn ( im ):
    if not im or not im [ 0 ]:
        return im
    return ( im [ 0 ], im [ 0 ]. filter ( filter = ImageFilter . GaussianBlur ( radius = 10 )))


with gr . Blocks () as demo :
    with gr . Group ():
        img1 = ImageSlider ( label = "Blur image" , type = "pil" , slider_color = "pink" )
        img1 . upload ( fn , inputs = img1 , outputs = img1 )

if __name__ == "__main__" :
    demo . launch ()

ImageSlider

Inicialización

nombre	tipo	por defecto	descripción
value	tuple [ str , str ] | tuple [ PIL . Image . Image , PIL . Image . Image ] | tuple [ numpy . ndarray , numpy . ndarray ] | None	None	Una imagen PIL, una matriz numpy, una ruta o una URL para el valor predeterminado que tomará el componente de imagen. Si se puede invocar, la función se llamará cada vez que se cargue la aplicación para establecer el valor inicial del componente.
position	int	0.5	La posición del control deslizante, entre 0 y 1.
upload_count	int	1	El número de imágenes que se pueden cargar en el componente. 1 o 2.
height	int | None	None	Alto de la imagen mostrada en píxeles.
width	int | None	None	Ancho de la imagen mostrada en píxeles.
type	"numpy" | "pil" | "filepath"	"numpy"	El formato al que se convierte la imagen antes de pasarla a la función de predicción. "numpy" convierte la imagen en una matriz numpy con forma (alto, ancho, 3) y valores de 0 a 255, "pil" convierte la imagen en un objeto de imagen PIL, "filepath" pasa una ruta str a un archivo temporal que contiene la imagen.
label	str | None	None	nombre del componente en la interfaz.
every	float | None	None	Si "valor" es invocable, ejecute la función "cada" número de segundos mientras la conexión del cliente esté abierta. De lo contrario no tiene ningún efecto. La cola debe estar habilitada. Se puede acceder al evento (por ejemplo, para cancelarlo) a través del atributo .load_event de este componente.
show_label	bool | None	None	si es Verdadero, mostrará la etiqueta.
show_download_button	bool	True	Si es Verdadero, aparecerá el botón para descargar la imagen.
container	bool	True	Si es Verdadero, colocará el componente en un contenedor, proporcionando algo de relleno adicional alrededor del borde.
scale	int | None	None	ancho relativo en comparación con los componentes adyacentes en una fila. Por ejemplo, si el Componente A tiene escala = 2 y el Componente B tiene escala = 1, A tendrá el doble de ancho que B. Debe ser un número entero.
min_width	int	160	ancho de píxel mínimo, se ajustará si no hay suficiente espacio de pantalla para satisfacer este valor. Si un determinado valor de escala hace que este componente sea más estrecho que min_width, primero se respetará el parámetro min_width.
interactive	bool | None	None	si es Verdadero, permitirá a los usuarios cargar y editar una imagen; si es False, solo se puede utilizar para mostrar imágenes. Si no se proporciona, esto se infiere en función de si el componente se utiliza como entrada o salida.
visible	bool	True	Si es falso, el componente se ocultará.
elem_id	str | None	None	Una cadena opcional que se asigna como identificación de este componente en el DOM HTML. Se puede utilizar para apuntar a estilos CSS.
elem_classes	list [ str ] | str | None	None	Una lista opcional de cadenas que se asignan como clases de este componente en el DOM HTML. Se puede utilizar para apuntar a estilos CSS.
show_share_button	bool | None	None	Si es Verdadero, se mostrará un icono de compartir en la esquina del componente que permite al usuario compartir resultados en las discusiones de Hugging Face Spaces. Si es falso, el icono no aparece. Si se establece en Ninguno (comportamiento predeterminado), el ícono aparece si esta aplicación Gradio se inicia en Spaces, pero no en otros casos.
slider_color	str | None	None	El color del separador deslizante.

Eventos

nombre	descripción
change	Se activa cuando el valor de ImageSlider cambia debido a la entrada del usuario (por ejemplo, un usuario escribe en un cuadro de texto) O debido a una actualización de función (por ejemplo, una imagen recibe un valor de la salida de un activador de evento). Consulte .input() para conocer un oyente que solo se activa con la entrada del usuario.
upload	Este oyente se activa cuando el usuario carga un archivo en ImageSlider.

Función de usuario

El impacto en la función de predicción de los usuarios varía dependiendo de si el componente se utiliza como entrada o salida para un evento (o ambos).

• Cuando se utiliza como entrada, el componente solo afecta la firma de entrada de la función del usuario.
• Cuando se utiliza como salida, el componente solo afecta la firma de devolución de la función del usuario.

El siguiente fragmento de código es preciso en los casos en que el componente se utiliza como entrada y salida.

• Como salida: Se pasa una tupla de imágenes en el formato solicitado.
• Como entrada: debe devolver la imagen como una matriz numpy, imagen PIL, cadena/ruta de archivo o URL de cadena.

 def predict (
    value : tuple [ str , str ]
   | tuple [ PIL . Image . Image , PIL . Image . Image ]
   | tuple [ numpy . ndarray , numpy . ndarray ]
   | None
) -> tuple [ str , str ]
   | tuple [ PIL . Image . Image , PIL . Image . Image ]
   | tuple [ numpy . ndarray , numpy . ndarray ]
   | None :
    return value