desenvolvimento de software para internet · asp.net e um web user control: ... • como programar...
TRANSCRIPT
DESENVOLVIMENTO DE SOFTWARE PARA INTERNET
1
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
2
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
3
HTML CONTROLS
HTML SERVER CONTROLS
WEB SERVER CONTROLS
VALIDATION CONTROLS
USER CONTROLS
Tipos de Web Controls:
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
3
HTML CONTROLS
HTML SERVER CONTROLS
WEB SERVER CONTROLS
VALIDATION CONTROLS
USER CONTROLS
Tipos de Web Controls:
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
4
Web user controls são páginas que contêm porções de outras páginas e que podem ser utilizadas em diferentes locais de uma aplicação web.São uma alternativa ao chamados arquivos de inclusão (Server-Side include), os quais apresentam vários problemas quando são utilizados em um projeto complexo, como:
• Conflito de variáveis• Não é possível incluir o
mesmo arquivo em diferentes locais da página
• Não é possível atribuir em tempo de execução valores a métodos e propriedades.
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
5
O processo de criação de um web user control é igual ao usado para criar páginas ASP.NET com web server controls. Veja as diferenças entre uma página ASP.NET e um web user control:• Página ASP.NET contém extensão .aspx
Web user control utiliza arquivos com extensão .ascx
• Um web user control não pode conter os elementos <html>, <body>, <form>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
6
Podemos facilmente transformar qualquer página ASP.NET em um web user control, basta remover os elementos <html>, <body> e <form> e trocar a diretiva @Page por @Control.
<%@ Page Language="C#" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server"> <title>Exemplo de uma Página com Web Server Control</title></head><body>
<form id=”form1” runat=”server”><asp:TextBox id=”txtPrimeiro” runat=”server”></asp:TextBox><asp:Button id=”btnOk” runat=”server” Text=”OK”></asp:Button>
</form></body>
</html>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
6
Podemos facilmente transformar qualquer página ASP.NET em um web user control, basta remover os elementos <html>, <body> e <form> e trocar a diretiva @Page por @Control.
<%@ Page Language="C#" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server"> <title>Exemplo de uma Página com Web Server Control</title></head><body>
<form id=”form1” runat=”server”><asp:TextBox id=”txtPrimeiro” runat=”server”></asp:TextBox><asp:Button id=”btnOk” runat=”server” Text=”OK”></asp:Button>
</form></body>
</html>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
7
Podemos facilmente transformar qualquer página ASP.NET em um web user control, basta remover os elementos <html>, <body> e <form> e trocar a diretiva @Page por @Control.
<%@ Control Language="C#" %>
<asp:TextBox id=”txtPrimeiro” runat=”server”></asp:TextBox><asp:Button id=”btnOk” runat=”server” Text=”OK”></asp:Button>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
8
A diretiva @Control passa informações para a página que será executada. os principais atributos utilizados pela diretiva @Control são:
Atributo Descrição
ClassName Nome da classe que contém o código que deve ser utilizado pelo user control.
Description Contém a descrição da página.
ClientIDMode Define qual algoritmo será usado para gerar o identificador de controles.
EnableTheming Indica se os temas devem ou não ser usados.
EnableViewState Se for true, mantém-se o estado da página após cada chamada. O valor-padrão é true.
Inherits Define a classe a partir da qual o web user control implementa a herança.
Language A linguagem de programação utilizada.
Src Referência para o arquivo que contém o código do web user control. Utilize o atributo CodeFile.
CodeFile Referência para o arquivo que contém o código do web user control.
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
9
Para utilizar um web user control em uma página ASP.NET, devemos declará-lo no início da página ASP.NET com a diretiva @Register, a qual contém os seguintes atributos:
Atributo Descrição
TagPrefix O prefixo utilizado para colocar o cotrole dentro do formulário (web form). Similar aos prefixos “asp” utilizados pelos web server controls.
TagName O nome da tag utilizada pelo novo controle (web user control).
Src O caminho absoluto ou relativo em que se encontra o arquivo .ascx.
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
10
Vejamos o exemplo da página teste.aspx:
<%@ Register TagPrefix=”abc” TagName=”MeuControle” Src=”primeiro.ascx”%><HTML>
<body><form id=”Formulario1” method=”post” runat=”server”>
<abc:MeuControle id=”MeuControle1” runat=”server” /></form>
</body></HTML>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
11
Para usar mais de uma instância de um web user control, basta adicionar várias vezes o mesmo controle na página ASP.NET:
<%@ Register TagPrefix=”abc” TagName=”MeuControle” Src=”primeiro.ascx”%><HTML>
<body><form id=”Formulario1” method=”post” runat=”server”>
<abc:MeuControle id=”MeuControle1” runat=”server” /><abc:MeuControle id=”MeuControle2” runat=”server” /><abc:MeuControle id=”MeuControle3” runat=”server” />
</form></body>
</HTML>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
12
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
13
Um web user control contém propriedades públicas que podem ser definidas na página ASP.NET em que o controle foi declarado. Um web user control é muito parecido com um web server control tradicional. A seguir, temos o web server control Button:
<asp:Button ID=”Button1” BackColor=”blue” runat=”server” Text=”Button” />
e em seguida, temos um web user control com duas propriedades públicas definidas pelo usuário: Linha e Coluna.
<uc1:WebUserControl Linha=”5” Coluna=”4” ID=”WebUserControl1” runat=”server”/>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
14
O exemplo a seguir desenha uma tabela na tela usando os valores das propriedades Linha e Coluna.
Arquivo WebUserControl.ascx:
<%@ Control Language=”C#” AutoEventWireup=”true” CodeFile=”WebUserControl.ascx.cs” Inherits=”WebUserControl” %>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
15
Arquivo WebUserControl.ascx.cs:using System;using System.Text;using System.Web.UI.WebControls;
public partial class WebUserControl : System.Web.UI.UserControl{ protected void Page_Load(object sender, EventArgs e) { StringBuilder sb = new StringBuilder(); sb.Append("<Table border=1>"); for (int a = 0; a < this.Linha; a++) { sb.Append("<tr>"); for (int x = 0; x < this.Coluna; x++) { sb.Append("<td>"); sb.Append(a + x); sb.Append("</td>"); } sb.Append("</tr>"); } sb.Append("</Table>"); Response.Write(sb.ToString()); }
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
16
Arquivo WebUserControl.ascx.cs (continuação):
private int _linha; private int _coluna;
public int Linha { get { return _linha; } set { _linha = value; } }
public int Coluna { get { return _coluna; } set { _coluna = value; } }}
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
17
No final, incluímos o web user control na página ASP.NET tabela.aspx:
<%@ Register Src="WebUserControl.ascx" TagName="WebUserControl" TagPrefix="uc1" %><HTML> <body> <form id="Formulario1" method="post" runat="server"> <uc1:WebUserControl Linha="5" Coluna="10" ID="WebUserControl1" runat="server" /> </form> </body></HTML>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
18
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
19
Também é possível carregar de forma dinâmica um web user control, ou seja, podemos usar código C# para carregar um web user control em uma página ASP.NET. O primeiro passo é criar uma referência para o web user control na página ASP.NET.
<%@ Reference Control=”WebUserControl.ascx" %>
ATENÇÃO:Para carregar um web user control de forma programática,
utilize a diretiva @Reference.Para carregar um web user control de forma declarativa,
utilize a diretiva @Register.
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
20
No método Page_Load da página ASP.NET, crie uma instância do web user control e, em seguida, invoque o método LoadControl:
Defina os valores das propriedades do user control:
Em seguida, adicione o user control à página ASP.NET:
WebUserControl userCtr = (WebUserControl)LoadControl(“WebUserControl.ascx”);
userCtr.Linha = 7;userCtr.Coluna = 5;
Page.Controls.Add(userCtr);
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
21
A seguir, temos os arquivos contendo os códigos do exemplo. O primeiro arquivo (Dinamica.aspx) contém as declarações e o código HTML:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Dinamica.aspx.cs" Inherits="Dinamica" %><%@ Reference Control="WebUserControl.ascx" %><html> <head runat="server"> <title>Carregando um web user control dinamicamente</title> </head> <body> <form id="form1" runat="server"> <div> </div> </form> </body></html>
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
22
O segundo arquivo (Dinamica.aspx.cs) contém o código C# da página ASP.NET:
using System;using System.Web.UI;
public partial class Dinamica : System.Web.UI.Page{ protected void Page_Load(object sender, EventArgs e) { WebUserControl userCtr = (WebUserControl)LoadControl("WebUserControl.ascx"); userCtr.Linha = 7; userCtr.Coluna = 5; Page.Controls.Add(userCtr); }}
quarta-feira, 17 de outubro de 12
WEB USER CONTROLS
23
quarta-feira, 17 de outubro de 12
COMO CRIAR UM WEB USER CONTROL
24
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
25
Imaginemos um formulário para compra on-line de ingressos para eventos, onde deve ser cadastrado os dados do usuário, a quantidade de ingressos comprados e os dados do cartão de crédito.Para facilitar nosso trabalho, criaremos um Web User Control que funcione como um controle do tipo Spinner, para que não necessitemos digitar todos os valores, mas sim apenas selecioná-los dentro de uma faixa de valores.
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
26
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
27
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
28
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
29
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
30
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
31
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
32
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
33
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
34
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
35
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
36
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
37
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
38
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
39
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
40
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
41
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
42
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
43
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
44
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
45
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
46
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
47
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
48
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
49
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
50
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
51
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
52
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
53
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
54
quarta-feira, 17 de outubro de 12
CRIANDO UM WEB USER CONTROL
55
quarta-feira, 17 de outubro de 12
BIBLIOGRAFIA
• Centro para Iniciantes Microsoft: http://msdn.microsoft.com/pt-br/beginner/default.aspx• Como Programar com ASP.NET e C# - Alfredo Lotar - novatec• Desenvolvendo para Web usando o Visual Studio 2008 - Ramon Durães - novatec
56
quarta-feira, 17 de outubro de 12
OBRIGADO
57
PROF. EMILIO PARMEGIANI
DOWNLOAD DO MATERIAL
quarta-feira, 17 de outubro de 12