Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais...

14

Transcript of Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais...

Page 1: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento
Page 2: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

Caro leitor,

Primeiramente gostaria de desejar um Feliz Ano Novo a você, que neste ano de 2019 nossa parceria continue

firme como sempre. Aproveito também para desejar saúde, paz, alegria e muitos projetos.

Para iniciar nossa série de artigos nosso colaborador mensal Luciano Pimenta escreveu a terceira parte sobre

“Xamarin Forms”, o qual demonstra um pouco mais dos controles desta plataforma. Além disso, foram disponibilizadas

algumas dicas interessantes para o desenvolvimento de aplicações Mobile, nos ensinando como saber qual sistema

operacional a aplicação está rodando, apresentação de mensagens para o usuário e o uso de Binding.

Já nosso consultor técnico Thiago Cavalheiro Montebugnoli redigiu o artigo “ASP. NET Web API – Implementando

o método “POST””, continuando a saga sobre este poderoso recurso encontrado na plataforma “.NET”. Ele também nos

apresenta uma fantástica ferramenta para auxiliar nos testes do lado cliente, chamada “Telerik Fiddler”, a qual nos

disponibiliza um rápido e prático resultado do consumo deste tipo de serviço.

Desejo uma ótima leitura, um grande abraço e até o mês que vem!

Marcos César Silva

Diretor Técnico

Editorial

Page 3: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

ASP. NET Web API - Criando um serviço REST

Caro amigo,

Neste artigo continuarei a explorar o assunto sobre “Asp .Net Web API”, abordando o verbo “POST” que seria o

“INSERT” quando tratamos de consultas SQL. Aproveitaremos o artigo publicado no mês de Dezembro de 2018,

denominado “ASP. NET Web API - Criando um serviço REST”, o qual servirá como base para implementarmos estes

recursos supracitados.

Criaremos um banco de dados no SQL Server e uma camada modelo “Funcionario” em nossa aplicação e

realizaremos o download e instalaremos uma ferramenta cliente chamada “Telerik Fiddler”, servindo como proxy de

depuração web para qualquer navegador, sistema ou plataforma. Lembrando que a mesma é gratuita.

Baixando e Instalando o “Telerik Fiddler”

Esta fabulosa ferramenta nos disponibiliza inúmeros recursos para registrar todo o fluxo de dados “HTTP/HTTPS”,

podendo inspecionar minuciosamente todos os dados recebidos e enviados. Com ele iremos testar se o nosso serviço

está correto, ou seja, podemos conferir se o mesmo está inserindo, atualizando ou excluindo dados.

Para baixá-la acesse o link:

https://www.telerik.com/download/fiddler

E preencha alguns dados cadastrais para adquiri-la. Ver Imagem 01

Figura 01: Download Fiddler.

Page 4: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

A instalação é bem simples e intuitiva. O clássico next, next e install. Podemos conferir a mesma instalada

corretamente na Figura 02.

Figura 02: Instalação completa.

Criando o Banco de Dados

Teremos uma tabela “Funcionario” com os seguintes campos: “Cod”, “Nome”, “Sobrenome”, “Setor” e

“Cidade”. Para isto abra o Microsoft SQL Server Management Studio, crie uma base de dados e insira o script

abaixo para a criação da tabela. Ver Listagem 01.

CREATE TABLE [dbo].[Funcionario](

[Cod] [int] IDENTITY(1,1) NOT NULL, [Nome] [varchar](50) NULL, [Sobrenome] [varchar](80) NULL, [Setor] [varchar](50) NULL, [Cidade] [varchar](50) NULL,

CONSTRAINT [PK_Funcionario] PRIMARY KEY CLUSTERED([Cod] ASC) WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]) ON [PRIMARY]

Listagem 01.

Teremos a tabela a seguir (Ver Imagem 03)

Figura 03: Tabela Funcionário.

Page 5: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

Criando o exemplo

Iremos aproveitar o exemplo criado no artigo do mês de Dezembro. Alterando e inserindo alguns recursos

necessários. O primeiro deles é o modelo de dados da tabela “Funcionario”. Para isto clique com o botão Direito na

“Solução/Adicionar Novo Item.../ADO. NET Entity Data Model”. Defina o nome para o mesmo de “Modelo.edmx”. O

modelo será do tipo “EF Designer from Database” e a conexão deverá conter a base de dados com a tabela criada no

tópico anterior. (Não entrarei em detalhes, pois esta etapa já foi descrita em outros artigos)

Teremos o Modelo de Dados idêntico ao da Figura 04.

Figura 04: Modelo de Dados.

Localize a Pasta “Models/FuncionarioController.cs”. É dentro desta que iremos implementar o método POST.

Note que temos o método GET que já está funcionando corretamente e os outros três (POST, PUT e DELETE).

Implementando o método POST

Por padrão este método é do tipo “VOID”, ou seja, não retorna nenhum tipo de dado. Para uma melhor

adequação, retornaremos um tipo “HttpResponseMessage”, o qual nos permitirá ter acesso às mensagens de sucesso

ou erro que poderá ocorrer. Listagem 02.

Page 6: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

//Método Padrão

public void Post([FromBody] Funcionario funcionario)

{

}

//Método Modificado

public HttpResponseMessage Post([FromBody] Funcionario funcionario) {

try {

using (THECLUBEntities db = new THECLUBEntities()) {

db.Funcionario.Add(funcionario); db.SaveChanges(); var mensagem = Request.CreateResponse(HttpStatusCode.Created, funcionario); mensagem.Headers.Location = new funcionario.Cod.ToString

());

Uri(Request.RequestUri + return mensagem;

} } catch(Exception ex) {

return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);

} }

Listagem 02.

Teremos como padrão o atributo [FromBody], o qual irá forçar a API para um tipo simples de leitura no corpo

da solicitação. Passaremos por parâmetro a classe “Funcionario”.

Dentro de um “Try/Catch” instanciaremos o modelo “TheClubEntities” o qual contém a tabela funcionário. O

método “Add()” irá adicionar o registro e logo em seguida gravaremos no Banco de Dados através do método

“SaveChanges()”. A variável “mensagem” irá capturar o status de nossa transição, nos retorando uma mensagem de

sucesso ou de erro.

Após compilar a solução abra o “Fiddler” para realizarmos o teste. Localize a aba “Composer” (1) e dentro da

mesma a “Parsed” (2). Insira os parâmetros abaixo (3) para indicar o aplicativo cliente, o servidor onde o serviço está

sendo disparado e o tipo de dados.

User-Agent: Fiddler

Host: localhost:49686 Content-type: application/json

Escolheremos “POST” e o camimho completo de nosso serviço (4). Em “request Body” inserimos os dados no

formato correto (JSON) conforme listagem abaixo (5)

Page 7: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

{ "Nome":"Thiago",

"Sobrenome":"Montebugn

oli", "Setor":

"Informatica",

"Cidade":"Avaré" }

Por final clicaremos no botão Execute (6)

A imagem 05 contém todas as etapas descritas acima.

Figura 05: Testando nosso serviço de insert.

Caso não ocorra nenhum erro podemos conferir clicando sobre o serviço ou na aba “Inspetor” (1) e através do

item “Raw” (2) podemos conferir os dados que foram enviados por parâmetro e na Raw (3) os dados contidos e

inseridos no Banco.

Todos os detalhes estão contidos na Figura 06.

Figura 06: Conferindo os dados através do Fiddler.

Page 8: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

Ao acessar o SQL Server teremos o resultado a seguir (Imagem 07)

Figura 07: Tabela Funcionário.

Conclusão

Procurei demonstrar neste artigo a forma correta para realizarmos tarefas de inserção de dados através do verbo

“POST”, que nada mais é do que o próprio “INSERT” em uma tabela de banco de dados. Como base utilizei o modelo

“Ado Entity Framework” junto com a ferramenta gratuita “Telerik Fiddler”, a qual fez o papel de nossa aplicação cliente,

disparando os dados para serem inseridos no banco de dados.

Desejo uma ótima leitura, um forte abraço e um belíssimo início de ano.

Referências

https://www.telerik.com/

Sobre o Autor

Thiago Cavalheiro Montebugnoli, adora aprender novas tecnologias. Formado pela Faculdade de Tecnologia de Botucatu – SP (FATEC), já desenvolveu softwares utilizando a plataforma .NET, Delphi junto com Banco

de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento de Dados da Prefeitura Municipal de Itaí-SP e atualmente compõe a equipe da Coordenadoria Tecnologia da Informação no IFSP – Instituto Federal do Estado de São Paulo em Avaré. Além disso, é colunista mensal

da Revista The Club Megazine e é consultor Técnico do The Club. Possui as seguintes certificações: MCP - Microsoft Certified Professional,MCTS - Microsoft Certified Technology Specialist, MCAD - Microsoft Certified Application Developer

e MCSD - Microsoft Certified Solution Developer.

E-mail: [email protected]

Page 9: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

Xamarin Forms – Controles e Dicas

No artigo anterior, conhecemos os controles de tela mais comuns do Xamarin. Neste artigo vamos conhecer

mais alguns, além de dicas importantes como Binding, como saber em qual sistema operacional nosso aplicativo está

rodando e caixas de mensagens.

Picker

O Picker é um ComboBox ou DropDownList, onde podemos preencher itens para que o usuário selecione um de

cada vez. Essa listagem pode ser configurada no XAML ou código. Crie uma nova página (“PagePicker.xaml”). Na

Listagem 1 temos o código onde adicionamos os estados brasileiros ao Picker no XAML.

<Picker Title="Estado" VerticalOptions="Center"

Margin="20, 0, 20, 0"> <Picker.ItemsSource>

<x:Array Type="{x:Type x:String}"> <x:String> AC </x:String> <x:String> AL </x:String> <x:String> AP </x:String> <x:String> AM </x:String> <x:String> BA </x:String> <x:String> CE </x:String> <x:String> DF </x:String> <x:String> ES </x:String> <x:String> GO </x:String> <x:String> MA </x:String> <x:String> MG </x:String> <x:String> MS </x:String> <x:String> PA </x:String> <x:String> PR </x:String> <x:String> PB </x:String> <x:String> PE </x:String> <x:String> PI </x:String> <x:String> RJ </x:String> <x:String> RN </x:String> <x:String> RS </x:String> <x:String> RO </x:String> <x:String> RR </x:String> <x:String> SC </x:String> <x:String> SP </x:String> <x:String> SE </x:String> <x:String> TO </x:String>

</x:Array> </Picker.ItemsSource>

</Picker>

Listagem 1. Código para itens de um Picker

O Picker tem uma propriedade Title, para mostrar um texto, semelhante ao PlaceHolder do Entry. No ItemsSource

definimos o tipo do Array que irá preencher o controle, nesse caso string. Rode o projeto e veja o Picker em execução

(Figura 1).

Page 10: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

Figura 01: Preenchendo o Picker no XAML

Se quiser preencher o Picker via código, é bastante simples, onde podemos ver um exemplo na Listagem 2.

private void CarregaCombo()

{ var lista = new List<string> (); lista.Add("Curso de C#"); lista.Add("Curso de ASP.NET MVC"); lista.Add("Curso de Xamarin Forms"); lista.Add("Curso de Android nativo");

cursos.ItemsSource = lista;

}

Listagem 2. Preenchendo o Picker via código

Criamos um array de string e atribuímos para o ItemsSource. Via código podemos atribuir uma lista de objetos,

assim, fica fácil de acessar os dados do item selecionado. Caso precisarmos saber qual o índice do item selecionado, o

Picker tem o método SelectedIndex.

Binding

Binding permite que possamos vincular propriedades de objetos. A vantagem é que as alterações dessas

propriedades (valores) são refletidas, ou seja, precisamos apenas configurar o binding, as alterações, o Xamarin se

encarrega de mostrar.

Precisamos indicar, qual o BindingContext do objeto, assim, podemos acessar as propriedades para fazer a

ligação. Para entender como funciona, faremos dois exemplos, usando código C# e XAML. Crie uma nova página e

adicione um Entry e um Button, conforme o código (usaremos o Label adicionado pelo template):

<Label x:Name="labelIncrementa" />

<Entry x:Name="incrementa"/> <Button Text="Incrementa" Clicked="Button_Clicked"/>

Page 11: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

No evento Clicked, vamos adicionar o código da Listagem 3.

if (string.IsNullOrEmpty(incrementa.Text))

incrementa.Text = "1"; else {

int valor = int.Parse(incrementa.Text);

incrementa.Text = (valor + 1).ToString();

}

Indicamos no Label que ele terá o BindingContext vinculado ao Entry (incrementa). Após, atribuímos

o Binding para indicar a propriedade que será associada no Label (Label.TextProperty) e também no Entry (Text).

Rode a aplicação e veja o resultado (Figura 2), quando alterarmos o valor no Entry ou clicamos no botão.

Figura 02.Repassando valores usando o Binding

Para o XAML, a ideia é semelhante, onde vamos configurar somente o Label que vai receber a referência do

objeto e qual propriedade faremos a associação. Vamos alterar o código:

<Label BindingContext="{x:Reference Name=incrementa}" Text="{Binding

Path=Text}" />

Veja que agora, temos o BindingContext sendo referenciado no XAML (novamente, vamos configurar o Entry).

Vamos comentar o código do construtor e rodar a aplicação para ter o mesmo resultado anterior. Usaremos Binding em

ListView para indicar os valores que queremos mostrar no item.

Detectando o SO (via código e XAML)

Como já comentamos o layout de cada plataforma, tem suas características individuais. Assim, em alguns casos,

precisamos saber em qual plataforma o aplicativo está rodando para fazer as configurações corretas.

No Android temos uma barra superior, onde os aplicativos têm sua margem superior e não ultrapassam a barra.

No iOS, não existe esse limite, então, podemos ter controles na parte superior, que ficam sobrepostos com as

informações na barra superior do iPhone (Figura 3).

Page 12: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

Figura 03. Problema de margem no iOS

Para contornar isso, podemos indicar no ContentPage uma margem superior, MAS apenas quando a aplicação

estiver rodando no iOS. Crie um novo projeto Xamarin Forms e no XAML adiciona o código da Listagem 4.

<ContentPage.Padding>

<OnPlatform x:TypeArguments="Thickness"> <On Platform="iOS" Value="0, 20, 0, 0" />

<On Platform="Android" Value="0, 0, 0, 0" /> <On Platform="UWP" Value="0, 0, 0, 0" />

</OnPlatform> </ContentPage.Padding>

Listagem 4. Modificando para margem no iOS

Note que declaremos todas as plataformas, mas não é necessário. Basta declarar o que queremos mudar. No

caso, mudamos o padding do iOS para 20 no top (inicia sempre pelo left e vai no sentido horário).

Veja na Figura 4 o texto apresentado no iOS onde o mesmo não sobrepôs a barra superior.

Figura 04.Melhorando a apresentação do texto

Nota: se você usar o emulador do Windows Phone, também vai precisar mexer na margem. No simulador com

versão X do iPhone, a margem superior (top) deve ser em torno de 40.

Via código C# também podemos verificar qual a plataforma que o aplicativo está rodando. Dê um nome para

o Label adicionado no projeto criado anteriormente e no construtor da página, após o InitializeComponent o seguinte

código:

labelPlatform.Text = Device.OnPlatform("iOS", "Android", "Windows Phone");

Page 13: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

No Label, vai aparecer o texto, de acordo com a plataforma que o aplicativo estiver rodando (Figura 5).

Figura 05.Texto de acordo com a plataforma do aplicativo

Nota: o exemplo do código XAML também pode ser feito via código C#.

Também podemos usar o switch com o código da Listagem 5.

switch (Device.RuntimePlatform)

{ case Device.iOS: labelPlatform.Text = "iOS";

break; case Device.Android: labelPlatform.Text = "Android";

break; case Device.UWP: default: labelPlatform.Text = "Windows Phone";

break; }

Listagem 5. Verificando o SO com o switch e Device

Caixas de mensagem

Todo sistema deve mostrar mensagens ao seu usuário sobre o que pode ser feito ou o resultado de um

processamento feito. Crie uma nova página e altere o código XAML para o seguinte:

<Button Text="Mensagem" Clicked="Button_Clicked"/>

Para o evento do click do botão, temos o seguinte código (arquivo MessagePage.xaml.cs):

DisplayAlert("Título da caixa de mensagem", "Mensagem", "Texto do botão");

Page 14: Caro leitor, - theclub.com.br · de Dados SQL Server e Firebird. Como experiências profissionais mais recentes, possui em seu currículo sua atuação no Centro de Processamento

O primeiro parâmetro do DisplayAlert é o título da caixa de mensagem. O segundo é o texto que queremos

exibir e por último o texto do botão. Veja na Figura 6 o resultado no Android e iOS.

Figura 06. Caixa de mensagem no Android e iOS

Conclusão

Conhecemos nesse artigo um pouco mais do Xamarin Forms. Os controles mais usados, o uso do Binding que

facilidade a ligação de dados entre controles. As caixas de mensagens para o usuário da aplicação. No próximo artigo vamos conhecer o ListView, um dos controles mais usados em aplicações Mobile.

Veremos como customiza-lo para criar listagens simples, agrupadas, com imagens e outras customizações.

Sobre o Autor

Luciano Pimenta (NOVO DOMINIO: www.lucianopimenta.com) é desenvolvedor Delphi/C# para aplicações Web

com ASP.NET, Windows com Win32 e Windows Forms com .NET. Palestrante da 4° edição da Borland Conference (BorCon) e da 1° Delphi Conference. É MVP Embarcadero, grupo de profissionais que ajudam a divulgar o Delphi no mundo. Atualmente

é desenvolvedor da SoftDesign fábrica de softwares em Porto Alegre-RS. Autor de mais de 80 artigos e de mais de 600 vídeos aulas publicadas em revistas e sites especializados, além de treinamentos presenciais e multimídias. É consultor da FP2 Tecnologia (www.fp2.com.br) onde ministra cursos de programação e banco de dados.

E-mail: www.lucianopimenta.net