Como criar Álbum de Fotos Com Banco de Dados Access 2003

[Samroa Machel Web Master 0]

Aew galera!

Bom Carnaval pra todos!

 

Semana passada esta lendo esses 3 tutoriais de como criar um album de fotos no banco de dados access! só que quando chego no final do 3º tutorial termina incompleto!

 

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

http://www.macoratti.net/07/12/aspn_caf.htm

 

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

http://www.macoratti.net/07/12/aspncaf2.htm

 

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

http://www.macoratti.net/07/12/aspncaf3.htm

 

Será que algém pode me ajudar´? podem me ensinar como terminar esse album de fotos seguindo esses 3 tutoriais?!?!?

Grácias!

flws

[Samroa Machel Web Master 0]

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

 

 

--------------------------------------------------------------------------------

 

Que tal criar um álbum de fotos para compartilhar suas fotos na web usando ASP .NET 2.0 ?

 

Vamos definir a estrutura do banco de dados onde iremos armazenar as imagens das fotos. Vamos usar o SQL Server 2005 Express e criar um banco de dados chamado Imagens.mdf contendo duas tabelas que possuem a seguinte estrutura:

 

 

tabela Albuns tabela Fotos

 

Para criar o banco de dados no menu Web Site selecione Add New Item e na janela Templates seleciona o item SQL DataBase informando o nome Imagens.mdf. O arquivo será colocado na pasta App_Data.

 

Para criar as tabelas , na janela DataBase Explorer , expanda os objetos do banco de dados Imagens , e clique com o botão direito do mouse sobre o objeto Table selecionando Add New table. A seguir digite diretamente no editor o campos e os tipos de dados mostrados acima lembrando de definir a chave primária e os campos como Identity.

 

Agora precisamos definir a nossa classe de acesso a dados. Para isso , no menu Web Site selecione Add New Item, e na janela templates selecione Class informando o nome AcessoBD.vb. O arquivo será colocado na pasta App_Code.

 

Abra o arquivo AcessoBD.vb e declare os seguintes namespaces:

 

Imports System.Data
Imports System.Data.SqlClient 
Imports System.Configuration

A seguir defina a variável strConn que representará a string de conexão;

 

Shared strConn As String = ""

Crie um construtor para obter a string de conexão do arquivo de configuração Web.config:

 

Shared Sub New()
     strConn = ConfigurationManager.ConnectionStrings("ConnectionString").ConnectionString
End Sub

Vamos agora definir métodos de acesso a dados, nossa estratégia será criar os seguintes métodos:

 

- ExecuteNonQuery - Executa uma operação que não retorna dados; Usado para INSERT , UPDATE e DELETE;

- ExecuteReader - Retorna um DataReader; Retorna um conjunto de registro via instrução SQL ou stored Procedure;

- ExecuteScalar - Executa um operação unitária, retorna um único valor;

- ExecuteDataSet - Retorna um DataSet;

 

Iremos ter dois métodos sobrecarregados para cada um dos métodos acima um recebendo parâmetros e outro sem parâmetros.

 

ExecuteNonQuery 
Public Shared Function ExecuteNonQuery(ByVal query As String) As Integer

Dim cnn As New SqlConnection(strConn)
Dim cmd As New SqlCommand(query, cnn)

cnn.Open()
Dim retval As Integer = cmd.ExecuteNonQuery()
cnn.Close()

Return retval
End Function

Public Shared Function ExecuteNonQuery(ByVal query As String, ByVal p As SqlParameter()) As Integer
Dim cnn As New SqlConnection(strConn)
Dim cmd As New SqlCommand(query, cnn)

FillParameters(cmd, p)
cnn.Open()

Dim retval As Integer = cmd.ExecuteNonQuery()
cnn.Close()
Return retval
End Function 

ExecuteReader 
Public Shared Function ExecuteReader(ByVal sql As String) As SqlDataReader

Dim cnn As New SqlConnection(strConn)
Dim cmd As New SqlCommand(sql, cnn)

Return cmd.ExecuteReader(CommandBehavior.CloseConnection)

End Function

Public Shared Function ExecuteReader(ByVal sql As String, ByVal p As SqlParameter()) As SqlDataReader

Dim cnn As New SqlConnection(strConn)
Dim cmd As New SqlCommand(sql, cnn)

FillParameters(cmd, p)
cnn.Open()

Return cmd.ExecuteReader(CommandBehavior.CloseConnection)
End Function 

ExecuteScalar 
Public Shared Function ExecuteScalar(ByVal sql As String) As Object
Dim cnn As New SqlConnection(strConn)
Dim cmd As New SqlCommand(sql, cnn)

cnn.Open()

Dim retval As Object = cmd.ExecuteScalar()
cnn.Close()

Return retval
End Function

Public Shared Function ExecuteScalar(ByVal sql As String, ByVal p As SqlParameter()) As Object

Dim cnn As New SqlConnection(strConn)
Dim cmd As New SqlCommand(sql, cnn)

FillParameters(cmd, p)
cnn.Open()

Dim retval As Object = cmd.ExecuteScalar()
cnn.Close()
Return retval
End Function
 

ExecuteDataSet 
Public Shared Function ExecuteDataSet(ByVal sql As String) As DataSet
Dim cnn As New SqlConnection(strConn)
Dim cmd As New SqlCommand(sql, cnn)
Dim da As New SqlDataAdapter()

da.SelectCommand = cmd
Dim ds As New DataSet()
da.Fill(ds)

Return ds
End Function

Public Shared Function ExecuteDataSet(ByVal sql As String, ByVal p As SqlParameter()) As DataSet
Dim cnn As New SqlConnection(strConn)
Dim cmd As New SqlCommand(sql, cnn)

FillParameters(cmd, p)

Dim da As New SqlDataAdapter()
da.SelectCommand = cmd

Dim ds As New DataSet()
da.Fill(ds)

Return ds
End Function 

Em todos os métodos abrimos uma conexão com a fonte de dados e executamos um comando com um instrução SQL e parâmetros preenchidos dinamicamente.

Vamos definir agora o método para preencher os parâmetros usados:

Private Shared Sub FillParameters(ByVal cmd As SqlCommand, ByVal parameters As SqlParameter())
For i As Integer = 0 To parameters.Length - 1
      cmd.Parameters.Add(parameters(i))
Next
End Sub

Todos os métodos foram definidos como sendo estáticos.(Shared)

 

Agora precisamos definir a nossa classe de negócios onde iremos definir os seguintes métodos:

 

getMiniatura() - Seleciona as imagens como miniaturas da tabela Fotos;

getMiniaturaPorAlbum() - Seleciona as imagens como miniaturas por Álbum;

getFoto() - Seleciona as fotos da tabela Fotos;

Estes métodos definem instruções SQL para selecionar dados das tabelas Albuns e Fotos.

 

No menu Web Site selecione Add New Item, e na janela templates selecione Class informando o nome cAlbum.vb. O arquivo será colocado na pasta App_Code. Abra o arquivo e digite o código abaixo:

 

Public Shared Function getMiniatura(ByVal fotoid As Integer) As Image
Dim sql As String = "SELECT imagem,imgAltura,imgLargura FROM Fotos WHERE fotoID=@fotoid"
Dim p As SqlParameter() = New SqlParameter(0) {}

p(0) = New SqlParameter("@fotoid", fotoid)

Dim reader As SqlDataReader = AcessoBD.ExecuteReader(sql, p)
Dim dadosImagem As Byte = Nothing
Dim height As Integer = 0, width As Integer = 0

While reader.Read()
   dadosImagem = CByte(reader.GetValue(0))
   height = reader.GetInt32(1)
   width = reader.GetInt32(2)
End While

reader.Close()

Dim ms As New MemoryStream(dadosImagem)
Dim imagemMaior As Image = Image.FromStream(ms)
Dim imagemMenor As Image = imagemMaior.GetThumbnailImage(width, height, Nothing, IntPtr.Zero)

Return imagemMenor 
End Function

Public Shared Function getMiniaturaPorAlbum(ByVal albumid As Integer) As Image
Dim p As SqlParameter() = New SqlParameter(0) {}

p(0) = New SqlParameter("@albumid", albumid)

Dim photoid As Integer = Integer.Parse(AcessoBD.ExecuteScalar("SELECT TOP 1 fotoID FROM fotos WHERE albumID=@albumid ORDER BY dataCriacao DESC", p).ToString())
Return GetMiniatura(photoid)

End Function

Public Shared Function getFoto(ByVal fotoid As Integer) As Image
Dim sql As String = "SELECT imagem from fotos where fotoID=@fotoid"
Dim p As SqlParameter() = New SqlParameter(0) {}

p(0) = New SqlParameter("@fotoid", fotoid)

Dim reader As SqlDataReader = AcessoBD.ExecuteReader(sql, p)
Dim dadosImagem As Byte = Nothing

While reader.Read()
   dadosImagem = CByte(reader.GetValue(0))
End While

reader.Close()

Dim ms As New MemoryStream(dadosImagem )
Dim imagemMaior As Image = Image.FromStream(ms)

Return imagemMaior

End Function

 

Precisamos criar o arquivo web.config e definir no mesmo a string de conexão usada no projeto. No menu Web Site selecione Add New Item e na janela templates selecione Web Configuration File aceitando o nome padrão web.config.

 

Abra o arquivo e defina a string de conexão conforme abaixo:

 

<?xml version="1.0"?>
<configuration>
<appSettings/>
<connectionStrings>
<add name="ImagensConnectionString" connectionString="Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Imagens.mdf;Integrated Security=True;User Instance=True" providerName="System.Data.SqlClient"/>
</connectionStrings>
<system.web>
<pages theme="Tema">

</pages>
<compilation debug="true"/>
<authentication mode="Windows"/>
</system.web>
</configuration>

 

Com isso temos a infra-estrutura de suporte e já podemos criar a camada de interface que será composto pelas nossas páginas .aspx.

 

No próximo artigo iremos dar continuidade criando a nossa Master Page.

 

--------------------------------------------------------------------------------

 

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

 

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:

 

Definimos a estrutura de dados : criando o banco de dados imagens.mdf e as tabelas Albuns e Fotos;

Criamos a nossa classe de acesso aos dados : AcessoBD.vb contendo os métodos de acesso aos dados;

Criamos também a nossa classe de negócio : cAlbum.vb contendo os métodos para seleção das imagens;

É hora de partirmos para criação da interface usando páginas ASP .NET para exibir as imagens. Vou começar criando uma master Page bem simples. Veja abaixo o leiaute e a aparência da minha master page. (você pode alterar a aparência da master page a seu gosto.)

 

 

 

No menu WebSite selecione Add New Item e na janela Templates selecione o template Master Page e informe o nome Album.master usando a linguagem Visual Basic;

 

 

 

No menu Layout selecione Insert Table e selecione o template Header:

 

 

 

Arraste o controle ContentPlaceHolder para a área central da tabela.

 

A seguir crie um rodapé na tabela, e, no cabeçalho inclua um componente Hyperlink no cabeçalho e defina a sua propriedade ImageUrl para uma imagem a sua escolha , no exemplo estou usando o logotipo Macoratti.net no caminho: ~/Imagens/macg.gif

 

Eu apliquei uma imagem de fundo ao cabeçalho atribuindo à propriedade Background a imagem da figura: background="Imagens/graybrck.jpg"

 

A seguir escreva o texto - Álbum de Fotos - conforme a figura abaixo.

 

 

 

Ainda na figura acima defina no rodapé o texto - CopyRight - 2007 - a aplique ao background do rodapé a mesma imagem usada no cabeçalho: background="Imagens/graybrck.jpg"

 

Agora vamos aplicar uma imagem de fundo a área central da tabela : background="Imagens/wall.jpg" de forma a termos o seguinte resultado:

 

 

 

Tudo isso são perfumarias que você pode até dispensar se não desejar ter o leiaute apresentado.

 

Salve a master page.

 

Com isso temos a master page criada e pronta para ser usada pelas páginas do álbum de fotos.

 

No próximo artigo vamos criar a página para exibir os álbuns e suas respectivas fotos usando a master page.

 

--------------------------------------------------------------------------------

 

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[/coe]

 

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.

 

================================================================================================================

 

Alguém sabe e podepostar os códigos para terminar esse tutorial? Com os códigos finais?

 

jásegui todos os passos desses 3 tutoriais agora falta o ultimo pra finalizar! aew alguém pode me ajudar postando esse ultimo tutorial pra completar os outros?

 

Muito obrigado!