Diferències

Ací es mostren les diferències entre la revisió seleccionada i la versió actual de la pàgina.

Enllaç a la visualització de la comparació

--- django_imatges [2026/04/07 10:55]
enric_mieza_sanchez creat
+++ django_imatges [2026/04/07 17:38] (actual)
enric_mieza_sanchez [Tractament d'imatges en Django]
@@ Línia 1: / Línia 1: @@
-====== Tractament d'imatges amb Django ======
+====== Tractament d'imatges en Django ======
-Les imatges, en Django, necessiten un tractament particular.
+Les imatges, en [[Django]], necessiten un tractament particular.
+{{ django:djanjo-imgs-admin-panel.png?500 }}
 {{tag> #FpInfor #Daw #DawMp07 django framework python web}}
+\\
+===== Algunes consideracions =====
+Django processa eficientment les dades de l'aplicació, però no és ràpid per servir els arxius voluminosos com les imatges, o d'altres que es demanen molt sovint com els arxius estàtics (CSS, etc.).
+Per això el tractament d'imatges té certes peculiaritats. Guardarem els binaris en una carpeta, típicament ''media/'' i en producció deixarem que les serveixi el servidor web (Apache o Nginx). Django ho pot fer, però no és convenient.
+Així, un esquena de posada en producció de Django seria quelcom similar a:
+{{:django:diagrama_django_produccio.png?direct}}
+Per saber més podeu llegir sobre [[Django#Django en produccio]] en aquesta wiki.
+\\
+===== Configuració imatges i carpeta 'media' =====
 Instal·lar la biblioteca Pillow per al tractament d'imatges:
@@ Línia 43: / Línia 63: @@
 </file>
+\\
+===== Visualitzacions a l'admin panel =====
+Personalitzar la vista a l'admin panel per veure les imatges:
+<file python admin.py>
+from django.contrib import admin
+from django.utils.html import format_html
+from .models import Producte
+class ProducteAdmin(admin.ModelAdmin):
+    # Afegeix el mètode a readonly_fields perquè es mostri en la pàgina d'edició
+    readonly_fields = ('vista_previa_imatge',)
+    # Defineix quins camps es mostren en el formulari d'edició
+    fields = ('nom', 'imatge', 'vista_previa_imatge')
+    def vista_previa_imatge(self, obj):
+        if obj.imatge:
+            # Retorna l'etiqueta HTML amb l'URL de la imatge
+            return format_html('<img src="{}" width="200" height="150" style="object-fit: cover;" />', obj.imatge.url)
+        return "No hi ha imatge"
+    vista_previa_imatge.short_description = 'Previsualització'
+admin.site.register(Producte, ProducteAdmin)
+</file>
+I també podríem personalitzar la vista de llista de l'admin panel:
+<file python admin.py>
+class ProducteAdmin(admin.ModelAdmin):
+    list_display = ('nom', 'vista_previa_imatge')
+    def vista_previa_imatge(self, obj):
+        if obj.imatge:
+            return format_html('<img src="{}" width="50" height="50" style="object-fit: cover;" />', obj.imatge.url)
+        return "Sense imatge"
+    vista_previa_imatge.short_description = 'Miniatura'
+</file>

bytes.cat

Eines de l'usuari

Eines del lloc

Diferències

Eines de la pàgina