Venerdì sera, tra un’ ora e l’altra delle deliranti puntate della saga Le messe informatiche del Papa Nero, Andrea mi ha chiesto se era troppo difficile realizzare una sorta di catalogo di prodotti che oltre ai dati testuali visualizzasse un’ anteprima dell’ immagine, dopo lo spiegone che ne è seguito ho avuto l’impressione d’ aver sottoposto il giovane all’ ennesima parabola papesca del professore…
In verità realizzare ciò che ha chiesto è molto semplice e alcuni accorgimenti preliminari evitano inutili complicazioni.
In Asp.Net2.0, sebbene il Datalist è il controllo che meglio si addice a questo genere di realizzazioni, utilizziamo il GridView, questo per sfruttare le peculiarità di questo completissimo controllo quali la paginazione e l’ordinamento, che malauguratamente non sono offerte dal DataList e andrebbero realizzate ad hoc(potrebbe essere il tema di nuovo articolo).
AutoGenerateColumns=”False” DataSourceID=”SqlDataSource1″ BackColor=”White” BorderColor=”#DEDFDE” BorderStyle=”None” BorderWidth=”1px” CellPadding=”4″ ForeColor=”Black” GridLines=”Vertical” PageSize=”3″>
<FooterStyle BackColor=”#CCCC99″ />
<Columns>
<asp:BoundField DataField=”NomeQuadro” HeaderText=”NomeQuadro” SortExpression=”NomeQuadro” />
<asp:BoundField DataField=”Note” HeaderText=”Note” SortExpression=”Note”>
<ItemStyle VerticalAlign=”Top” />
</asp:BoundField>
<asp:ImageField DataImageUrlField=”PercorsoFile” DataImageUrlFormatString=”~/thumb\{0}”
HeaderText=”anteprima immagine”>
</asp:ImageField>
</Columns>
<RowStyle BackColor=”#F7F7DE” />
<SelectedRowStyle BackColor=”#CE5D5A” Font-Bold=”True” ForeColor=”White” />
<PagerStyle BackColor=”#F7F7DE” ForeColor=”Black” HorizontalAlign=”Right” />
<HeaderStyle BackColor=”#6B696B” Font-Bold=”True” ForeColor=”White” />
<AlternatingRowStyle BackColor=”White” />
</asp:GridView>
<asp:SqlDataSource ID=”SqlDataSource1″ runat=”server” ConnectionString=”<%$ ConnectionStrings:ConnectionString %>”
ProviderName=”<%$ ConnectionStrings:ConnectionString.ProviderName %>” SelectCommand=”SELECT [PercorsoFile], [NomeQuadro], [Note] FROM [Quadri]“>
</asp:SqlDataSource>
Salvare sul database solamente il nome del file e non il suo percorso completo dà la possibilità di utilizzare lo stesso campo di database sia per visualizzare l’ anteprima nella GridView [DataImageUrlFormatString="~/thumb\{0}], sia per mostrare un’ immagine completa in un’ altra pagina, l’unico accorgimento è di salvare l’immagine originale e la thumbnail in due cartelle diverse con lo stesso nome, cosa che elimina completamente il problema di elaborare sistemi di ridimensionamento, quando si salva una nuova immagine quindi salvare l’originale nella giusta cartella e creare al volo una nuova immagine ridimensionata in proporzione nella cartella delle anteprime e il gioco è fatto.
il Papa nooooo aiehdeiuhdiauehdiuaehdaui, idolo.
Dai ‘poraccio, ci vede come tante pecorelle ^^
Ciao fenomeno.
Scusa ma non sarebbe molto più semplice e poco dispendioso in termini di spazio, ridimensionare l’immagine a run-time richiamando una semplice funzione che ridimensiona l’immagine e restituisce una bitmap ridimensionata????
Che ne pensi di questo:
Html:
<asp:ImageButton ID=”ImageButton1″ runat=”server” ImageUrl=” />
….. html
Mentre il file ElaboraImmagine_Parametro_Largh.aspx a cui passi il path Immagine ed il parametro della base su cui lavorare per ridimensionare è il seguente:
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
Dim ImageFormat As Imaging.ImageFormat
‘Dim bitmapLogo As Bitmap
Dim larghezzaImmagine As Single
Dim altezzaImmagine As Single
‘Dim leftPos As single
‘Dim topPos As single
Dim image as string
dim parametroLarghezza as Single
‘Preleva il percorso fisico dell’Immagine
image = request.querystring(”image”)
parametroLarghezza = request.querystring(”parametroLargh”)
‘Preleva l’Immagine
Dim myBitmap As New Bitmap(server.mappath(image))
Dim immagine As Graphics = Graphics.FromImage(myBitmap)
‘Preleva le dimensioni dell’Immagine
larghezzaImmagine = myBitmap.Width
altezzaImmagine = myBitmap.Height
‘Riduco la larghezza in Proporzione di una larghezza max di 350
dim rappLarghezza as single
if larghezzaImmagine > parametroLarghezza then
rappLarghezza = parametroLarghezza / larghezzaImmagine
else
rappLarghezza = 1
end if
Dim newBitmap As New Bitmap(myBitmap , New Size(larghezzaImmagine * rappLarghezza , altezzaImmagine * rappLarghezza))
response.contenttype=”Image/jpeg”
newBitmap.Save(Response.OutputStream, ImageFormat.jpeg)
‘Libera le risorse utilizzate per creare gli oggetti bitmap
myBitmap.Dispose()
newBitmap.dispose
response.end
End Sub
Risparmi spazio e non incasini il web con una “ridondanza” due volte la stessa Immagine.
Ciao
Riccardo
Fondamentalmente sono daccordo con te, ho solamente pensato a ridurre l’elaborazione a runtime, in fin dei conti risparmi piu’ tempo facendo il ridimensionamento in fase di salvataggio, lo fai una volta sola e il resto delle volte non devi far lavorare il server, quello dello spazio invece e’ a mio parere un falso problema, ma se nn sei daccordo aspetto altri commenti.
Grazie dell’intervento, ciao