image_upload format changed

This commit is contained in:
2025-09-25 05:53:41 +02:00
parent 406c968111
commit 8034c9ec11
3 changed files with 44 additions and 37 deletions

View File

@@ -4,6 +4,7 @@ import base64
from PIL import Image
import io
from niceguiex.components import FileDrop, ImageDrop
from niceguiex.components.file_drop import FileData, ImageData
@ui.page('/')
@@ -13,14 +14,12 @@ async def main_page():
# Example 1: Multiple files with content
uploaded_files = ui.column().classes('w-full mt-4')
def handle_multiple_files(files: List[Dict[str, Any]]):
def handle_multiple_files(file: FileData):
with uploaded_files:
ui.label(f'Uploaded {len(files)} file(s):').classes('font-bold mb-2')
for file in files:
with ui.card().classes('p-2 mb-2'):
ui.label(f"📄 {file['name']}").classes('font-medium')
ui.label(f"Size: {file['size']:,} bytes").classes('text-sm text-gray-600')
ui.label(f"Type: {file['type']}").classes('text-sm text-gray-600')
with ui.card().classes('p-2 mb-2'):
ui.label(f"📄 {file['name']}").classes('font-medium')
ui.label(f"Size: {file['size']:,} bytes").classes('text-sm text-gray-600')
ui.label(f"Type: {file['file_type']}").classes('text-sm text-gray-600')
ui.label('Multiple Files (returns list)').classes('text-h6 mb-2')
FileDrop(
@@ -73,16 +72,16 @@ async def main_page():
# Example 4: Image drop with preview
image_preview = ui.column().classes('w-full mt-4')
def handle_image(img: Image.Image):
print(f"Image uploaded: {img.format}, Size: {img.size}")
def handle_image(img: ImageData):
print(f"Image uploaded: {img['image'].format}, Size: {img['size']}")
image_preview.clear()
with image_preview:
ui.label(f"Image: {img.format} - {img.size[0]}x{img.size[1]}px").classes('mb-2')
ui.label(f"Image: {img['image'].format} - {img['image'].size[0]}x{img['image'].size[1]}px").classes('mb-2')
# Convert PIL image back to base64 for display
buffered = io.BytesIO()
img.save(buffered, format=img.format or 'PNG')
img['image'].save(buffered, format=img['image'].format or 'PNG')
img_data = base64.b64encode(buffered.getvalue()).decode()
ui.html(f'<img src="data:image/{img.format.lower() if img.format else "png"};base64,{img_data}" class="max-w-full rounded">')
ui.html(f'<img src="data:image/{img['image'].format.lower() if img['image'].format else "png"};base64,{img_data}" class="max-w-full rounded">')
ui.label('Image Drop (returns PIL Image)').classes('text-h6 mb-2')
ImageDrop(