minha imagem perde a qualidade quando eu clico
minha imagem perde a qualidade quando eu clico
Olá Gustavo.
O problema esta na imagem e como ela é carregada.
Confere ai:
<img src="{{ image.thumbnail.url }}" onclick="openModal('{{ image.original.url }}')">
img.save(self.image.path, quality=95, optimize=True)
MEDIA_URL = '/media/'
MEDIA_ROOT = BASE_DIR / 'media'
function openModal(src) {
const modalImg = document.getElementById("modal-img");
modalImg.src = src.replace("thumbnail", "original");
}
<a href="{{ image.original.url }}" data-lightbox="galeria">
<img src="{{ image.thumbnail.url }}">
</a>
Confere ai se alguma das opções acima se encaixa no seu problema.
Para lhe ajudar preciso do seu codigo as partes relacionadas a imagem.
Aguardo seu feedback.
Até...
calma, pode me explicar passo a passo do que fazer? no caso de quais dados você precisa
E ai Gustavo.
Tudo bem?
Acho que a resposta anterior não ajudou.
Vamos tentar mais uma vez.
Revise cada passo se está correto.
No arquivo settings.py, verifique as seguintes linhas:
import os
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
Isso define onde os arquivos de mídia (como imagens enviadas) serão armazenados e como serão acessados na URL.
No arquivo urls.py principal do projeto (geralmente o que está na mesma pasta de settings.py), verifique:
from django.conf import settings
from django.conf.urls.static import static
from django.urls import path, include
urlpatterns = [
path('', include('app.urls')), # substitua "app" pelo nome do seu app
]
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Isso faz o Django servir os arquivos de mídia durante o desenvolvimento.
No seu models.py:
from django.db import models
class Produto(models.Model):
nome = models.CharField(max_length=100)
imagem = models.ImageField(upload_to='produtos/') # pasta dentro de /media
def __str__(self):
return self.nome
Necessário instalar o Pillow para lidar com imagens:
pip install Pillow
python manage.py makemigrations
python manage.py migrate
Exemplo simples de formulário no forms.py:
from django import forms
from .models import Produto
class ProdutoForm(forms.ModelForm):
class Meta:
model = Produto
fields = ['nome', 'imagem']
No views.py:
from django.shortcuts import render, redirect
from .forms import ProdutoForm
def upload_imagem(request):
if request.method == 'POST':
form = ProdutoForm(request.POST, request.FILES)
if form.is_valid():
form.save()
return redirect('lista_produtos')
else:
form = ProdutoForm()
return render(request, 'upload.html', {'form': form})
upload.html)<form method="post" enctype="multipart/form-data">
{% csrf_token %}
{{ form.as_p }}
<button type="submit">Enviar</button>
</form>
lista.html, por exemplo){% for produto in produtos %}
<h3>{{ produto.nome }}</h3>
<img src="{{ produto.imagem.url }}" alt="{{ produto.nome }}" width="200">
{% endfor %}
pip install Pillow
python manage.py makemigrations
python manage.py migrate
python manage.py runserver
Lembrando que o conteudo acima é apenas um exemplo e do indice 5 até o 8 são apenas exemplos.
O principal é rodar os comandos listados em resumo dentro do seu ambiente virtual e ver o resultado.
Se continuar com problemas avise.
Segue o projeto completo para comparar com o seu e ver se há diferenças:
https://github.com/alura-cursos/alura_space/tree/aula_5
Bons estudos.