ASP.NET 2.0 - Criando um Álbum de fotos  na Web - III


No meu primeiro artigo - ASP .NET 2.0 - Criando um Albúm de fotos na web I - sobre o assunto criamos toda a infra-estrutura necessária para criação de um álbum de fotos na web. No segundo artigo - ASP .NET 2.0 - Criando um Albúm de fotos na web II - criamos a master page do projeto. Vamos criar agora a página principal para exibir informações sobre os álbuns com link para acessar as fotos do álbum selecionado.

Abra o projeto no Visual Web Developer 2005 e no menu WebSite selecione Add New Item; na janela Templates selecione o template Web Form informando o nome Default.aspx.

Selecione a página incluída e no modo Design inclua , a partir da ToolBox , o componente DataList. A seguir no DataList Tasks, em Choose Data Source , selecione o item <new Data Source>.

Na janela Data Source Type, selecione DataBase e aceite o nome SqlDataSource1. Clique em OK.

Na janela Choose your Data Connection, selecione a string de conexão ImagensConnectionString e clique em Next>

Na janela Select Statement marque a opção Specify a custom SQL statement or stored procedure e clique em Next>

Na guia SELECT informe a instrução SQL : SELECT * FROM [Albuns] ORDER BY [DataCriacao] DESC para selecionar todos os álbuns da tabela Albuns por ordem data de criação: (Você pode usar o Query Builder para ajudá-lo). Clique em Next> e a seguir em Finish.

Selecione o DataList e agora clique no link Edit Templates;

Defina o leiaute conforme a figura abaixo usando os controles Hyperlink, Image e Label :

A seguir defina para cada um dos controles as propriedades conforme descrito a seguir selecionando o controle e clicando na opção Edit DataBindings:

Hyperlink1 Text = Eval("Nome") ; NavigateUrl = Eval("AlbumID", "~/exibeAlbum.aspx?albumid={0}")
descricaoLable Text = Eval("descricao")
dataCriacaoLabel Text = Eval("dataCriacao", "{0:g}")
Image não defina nada

Ao final selecione o ItemTemplate e clique em End Template Editing.

Selecione o arquivo code-behind Default.aspx.vb e no evento ItemDataBound do Datalist inclua o código abaixo:

Protected Sub DataList1_ItemDataBound(ByVal sender As Object, ByVal e As DataListItemEventArgs)

Dim img As Image = DirectCast(e.Item.FindControl("Image1"), Image)

If img IsNot Nothing Then
       img.ImageUrl = "~/obtemFoto.aspx?imgtype=thumbnail&albumid=" + DataList1.DataKeys(e.Item.ItemIndex).ToString()
End If
End Sub

Neste código estamos procurando pelo controle Image1 usando no DataList e atribuindo a sua propriedade ImageUrl o link :

"~/obtemFoto.aspx?imgtype=thumbnail&albumid=" + DataList1.DataKeys(e.Item.ItemIndex).ToString()

que irá selecionar de forma dinâmica a imagem dos álbuns cadastradas no banco de dados.

Teremos que criar a página obtemFoto.aspx com o código para obter as imagens.

No menu WebSite selecione Add New Item; na janela Templates selecione o template Web Form informando o nome obtemFoto.aspx e marque somente a opção Place Code in separete File não marcando a opção para selecionar a Master Page.

A seguir no arquivo code-behind obtemFoto.aspx.vb no evento Load inclua o código abaixo:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)

Dim foto As Image = Nothing

If Request.QueryString("imgtype") = "thumbnail" Then
        If Request.QueryString("fotoid") IsNot Nothing Then  
                Dim fotoid As Integer = Integer.Parse(Request.QueryString("fotoid"))
                foto = cAlbum.getMiniatura(fotoid)
        End If 

       If Request.QueryString("albumid") IsNot Nothing Then
              Dim albumid As Integer = Integer.Parse(Request.QueryString("albumid"))
              foto = cAlbum.getMiniaturaPorAlbum(albumid)
        End If
Else
        Dim fotoid As Integer = Integer.Parse(Request.QueryString("fotoid"))
        foto = cAlbum.getFoto(fotoid)
End If
foto.Save(Response.OutputStream, ImageFormat.Gif)
End Sub

Este código verifica o parâmetro recebido via QueryString e obtêm a foto usando um dos seguintes métodos: getMiniatura() , getMiniaturaPorAlbum() ou getFoto() já definidos no primeiro artigo.

Aguarde a continuação do artigo : ASP.NET 2.0 - Criando um Álbum de fotos na web IV (ainda inativo)

Até lá...


José Carlos Macoratti