Editorial

Caro amigo,

Mais um ano se passou e temos o orgulho de tê-lo como parceiro. Nossa equipe deseja a você um abençoado

Natal e que o ano de 2019 seja repleto de realizações.

Para iniciar nossa série de artigos, o colaborador Luciano Pimenta redigiu a segunda parte do artigo “Xamarin

Forms”, sendo que neste ele demonstra os controles de tela mais comuns na criação de aplicações mobile.

Independente do controle, o Xamarin cria o mesmo de acordo com a plataforma que estivermos usando (iOS ou

Android), facilitando para o desenvolvedor conhecer apenas os controles, sem precisar saber as características em cada

plataforma. Já nosso outro colaborador Ricardo Barbosa Crivelli escreveu o artigo “Adicionando registros no Laravel”.

Para este mês ele finaliza o processo de criação do CRUD, servindo como base para o desenvolvimento de outros.

Também foi abordado como é simples validar um formulário e exibir os erros que poderão ocorrer. Para fechar a série de artigos, o consultor técnico Thiago Cavalheiro Montebugnoli traz o artigo “ASP. NET Web

Api - Criando um serviço REST”, o qual aborda o uso de um dos principais recursos da plataforma .NET para criar

facilmente serviços REST. Nos sistemas atuais a integração de plataformas se tornou um item de extrema importância e

indispensável, podendo implementar métodos de “Select, Insert, Update e Delete”, os quais são chamados através dos

verbos GET, POST, PUT e DELETE estando presentes no padrão HTTP.

Novamente desejo a todos um ótimo Natal e Ano Novo, um forte abraço e até o ano que vem!

Marcos César Silva

Diretor Técnico

Xamarin Forms - Controles

No artigo anterior, conhecemos o Xamarin. Neste artigo vamos aprender a usar controles de tela mais comuns

nos aplicativos que queremos construir. Vamos criar um novo projeto Xamarin, do tipo Blank App/.NET Standard para

mostrar os controles.

Label

É o mais simples, pois apresenta um texto/rótulo. Pode ser um texto simples ou multilinhas. Suas propriedades

mais comuns são para a apresentação do texto (Text), mudar a cor (TextColor) e tamanho da fonte (FontSize). Ainda

podemos formatar parte do texto de uma Label.

Na Listagem 1 temos a configuração em XAML de um controle Label.

<StackLayout> <Label FontSize="Large">

<Label.FormattedText>

<FormattedString> <Span Text="Texto em vermelho e negrito - "

ForegroundColor="Red" FontAttributes="Bold" />

<Span Text="Texto normal - " /> <Span Text="Texto em itálico e fonte menor"

FontAttributes="Italic" FontSize="Small" />

<FormattedString>

</Label.FormattedText>

</Label>

</StackLayout>

Listagem 1. Configuração XAML de um Label

O Label possui um FormattedText e dentro dele o FormattedString, ou seja, no Label podemos formatar o texto

da maneira como quisermos. Para cada formatação, deve ser usado um Span, que possui propriedades semelhantes,

como Text, FontSize etc.

Veja o resultado na Figura 1.

Figura 01: Texto formatado no Label

Entry

É um controle para entrada de dados em uma única linha, conhecido também em outras linguagens como

TextBox, EditText etc. A propriedade Text fornece o texto digitado pelo usuário, já a IsPassword formata o texto para

não ser exibido, padronização feita para senhas.

Ainda temos a propriedade PlaceHolder que mostra um texto no Entry vazio, mas quando digitado algum valor

o mesmo some. Muito comum como o rótulo daquela caixa de texto. O controle possui propriedades comuns a

outros: TextColor, BackgroundColor etc.

Vamos adicionar uma nova página no projeto e configurar a mesma para ser a primeira tela da aplicação.

Clique com o botão direito no projeto e escolha Add>New Item. No item Xamarin Forms, temos os tipos de páginas

mostradas no capítulo anterior (Figura 2).

Figura 02. Adicionando uma nova página

Dê o nome de "PageEntry.xaml" e no arquivo XAML, adicione o código da Listagem 2.

<StackLayout Padding="15, 20, 15, 0"> <Entry Placeholder="Digite o nome do usuário"/>

<Entry Placeholder="Digite a senha do usuário"

IsPassword="True"/>

<Entry TextColor="Blue" Text="Cor em azul" /> <Entry BackgroundColor="Green" Text="Cor de fundo em verde"

/> </StackLayout>

Listagem 2. Configurando exemplos de Entry

Para trocar a página inicial e rodar o projeto, abra o arquivo App.xaml.cs e altere o MainPage para

PageEntry após o InitializeComponent. Veja o resultado no projeto em execução na Figura 3.

Figura 03. Configurações do Entry

O evento bastante usado nesse controle é o TextChanged que ocorre quando o usuário digita algo na caixa de

texto. Temos o evento Completed que indica que o usuário usou a tecla ENTER (ou Return), para quando queremos

executar determinado código.

Adicionamos um Label na tela. No XAML do Entry, para criar um evento, basta digitar o nome do evento, que o

Visual Studio cria o manipulado (Figura 4).

Figura 04. Criando um event handler para o evento do Entry

Nota: usamos a propriedade x:Name do Label para atribuir um nome ao controle (labelCount).

No arquivo PageEntry.xaml.cs temos um método onde vamos adicionar o seguinte código:

labelCount.Text = e.NewTextValue.Length.ToString();

Pelo parâmetro e temos acesso ao valor antigo (OldTextValue) e ao novo (NewValueText) digitado. No código,

estamos indicando no Label a quantidade de caracteres digitados.

Editor

Controle semelhante ao Entry, onde podemos digitar várias linhas de texto. As propriedades e eventos são

quase iguais ao do Entry. O tamanho da caixa de texto pode ser configurado na propriedade HeightRequest.

Button

Controle também muito simples e comum em todo o desenvolvimento de softwares, independente da

linguagem. Sua característica mais comum é executar código quando o usuário clica sobre o mesmo.

Crie uma nova página ("PageButton.xaml") e adicione o código a seguir:

<StackLayout Padding="15, 20, 15, 0">

<Entry x:Name="entryValor" Placeholder="Digite um valor"/>

<Label x:Name="labelValor"/> <Button Text="Click"

Clicked="Button_Clicked"/> </StackLayout>

No arquivo PageButton.xam.cs temos o evento do botão (Button_Clicked) e vamos digitar o seguinte código:

labelCount.Text = e.NewTextValue.Length.ToString();

Ao rodar o projeto, digite dados no Entry, clique no botão para visualizar no Label.

Switch

O Switch é o conhecido CheckBox de outras linguagens de programação, pois ele disponibiliza uma visualização para

estar ou não marcado, sim/não etc. Não existe uma propriedade Text, por exemplo, para exibir o texto.

Temos que usar em conjunto com um Label. A propriedade que indica que o controle está selecionado ou não

é o

IsToggled. Crie uma nova página ("PageSwitch.xaml") e adicione o código abaixo:

<Switch IsToggled="True" />

Rode a aplicação e veja o Swtich no dispositivo. O controle tem o evento Toggled que ocorre quando ele muda

de "estado". Nesse evento podemos colocar nossas regras e código necessário. Veja a seguir um exemplo onde

habilitamos um controle de tela, de acordo com a propriedade isToggled do Swtich, usando o código e o resultado na

Figura 5.

labelMensagem.IsVisible = ((Switch)sender).IsToggled;

Figura 05. Mostrando e escondendo o Label com o Switch

DatePicker

Permite que o usuário selecione uma data. Ele expõe a propriedade Date do tipo DateTime que facilita muito o

trabalho com datas. Usando DateTime podemos facilmente fazer cálculo de datas, incrementar e decrementar dia, mês

e ano.

Crie uma nova página ("PageDatePicker.xaml") e adicione o seguinte código:

<DatePicker MinimumDate="01/01/2018" MaximumDate="12/31/2018"

Date="12/25/2018" Format="D" />

No código, configuramos algumas propriedades do DatePicker: uma data mínima e máxima, indicamos a data

que o controle seja inicializado e por fim, o formato que desejamos. O formato é baseado no .NET Framework.

Todas as propriedades podem ser configuradas no código. Imagine que não deseje que o usuário selecione

uma data inferior a data de hoje, basta configurar o MinimumDate com a data de hoje via código.

Na Figura 6 temos o controle sendo exibido no iOS e Android.

Figura 06. DatePicker no iOS e Android

Veja que não precisamos mudar nada, o Xamarin se encarrega de gerar os controles nativos e corretos

em cada plataforma que estamos trabalhando. O controle tem o evento DateSelected, executado quando o

usuário escolhe uma data.

Dica: temos o TimePicker que apenas diferencia por mostrar a hora, mas suas características e

propriedades são semelhantes.

Conclusão

Espero que tenham gostado deste artigo sendo que no próximo continuaremos a conhecer os controles do

Xamarin, assim como características de criação de aplicações mobile.

Desejo uma ótima leitura, um abraço!

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 para contato: rico@capim.art.br

E-mail: suporte@theclub.com.br

01232456514 89 2 84 54 686 9

5 841 4 ! " #$ % $ & $ ' (' % )*+ $$ ,(& -. / 0, % $ & % % 1 $

2 % -3 $ 4 & $ & ' $ ' 5$ 2 % (6 $ %47% & % ' ( $ $ ' $ , ( $ 6 2 % 8( $ $ & $/

0 9 8616 6 9 6 486 : ' &; . & %, ! $ % (! $ $ $ , $ (1 % $ &# & % 4 $ / <#$ $ % $ & % 4 4( & '

( , % 1 $ -3 $ =! ( 4/

>826514 ? 6 48 <#$ "6 , % $ & % ($ $ $ 7 ! , & % ' / @ % % ' % $ & % ' 5 A $ 6

$, $6' ( , B 4 2 % (6 , , &! % , ( $ 6 / % ' A ' &! % & /4( /,!, # $ & $C' 5$C ! & $ &# D

EFGHFIJKLMNOPQRHKSOTTMU EKFWHXQILMWQIHFIHMU YKHPNFZ SRTF[ \ ]O[^XI_HQT` abTGc d YeKHPNFZ

YJXf WNOKKghWQIHOXIF[hZ YJXf WNOKKgh[Qi jRKHXkP_WQIHFIH_WFIHF[hZ YJXf WNOKKghWQN_]J_llhZ YJXf WNOKKghWO[J RTF[hZ YJXf WNOKKghWO[J_mFOJF[hZ nJXWXQIO[ nRHQ[ YeJXfZ YJXf WNOKKghWO[J_oQJPhZ YkQ[] ]FHmQJghTQKHh OWHXQIgh\\ [QRHFLMORHmQ[SKHQ[FMU ddhZ YJXf WNOKKghkQ[]_^[QRThZ EWK[k YNOoFN kQ[ghIO]FhZpQ]F`YeNOoFNZ YXITRH XJghIO]Fh IO]FghIO]Fh HPTFghHFGHh WNOKKghkQ[]_ WQIH[QNh eZ YeJXfZ YJXf WNOKKghkQ[]_^[QRThZ YNOoFN kQ[ghF]OXNhZq_]OXN`YeNOoFNZ YXITRH XJghF]OXNh IO]FghF]OXNh HPTFghF]OXNh WNOKKghkQ[]_ WQIH[QNh eZ YeJXfZ

123415 67289 43 1 12 32

!" #$ % & '()! & ( * & $ ) "+ #$ ! % , , & & " -

./76 0 1123 1/34 ./76 0 1123 1/5 2 /2134 643 121 . 1272388 1 4329 43 1 12 32 3 0 1123935 9355:17; 1< 70 3517= 334 6/7 7 5 1 .> 4 .>/764 ./76 0 1123 1/59 /<34

, ' ) & ) ? !* & &@ $ ! !$ " A $ B(

CDEFGD IJ KLMNL OEPE EQRSRLTEPTLUL EVMLPJ

W X $!, Y $ " ! @ Z #$ & % " Y #$ " & X $!, " " $"* ( " [ " \]^^ $" [$"* ( " aa]`@ Y " #$ " ) ? !* bWcd Y ,% ! !% % ! ) & & & ( e % f + ! ) & " & ! g $ e " ! @ ) " $!" d ) ! B( W $ & " Y

& & & " ?+ ecgA #$ Y & ! & h X " X $!, @ X i, % " " (

jEkGlE IJ mnopQG VD nGpLVPSG qLTMPLlGPJ

rstusvwx sz {v|x}~s•€•z #$ % ‚ ", " % !" Y" & " [` " #$ % $"* e " ! ( * -

023456783988 85 397 9 059 389 5 2 8 32 822872 3 35329 88 393369 28 6 86 3957 56 68 338 3693 525 23 373 687 888 46873 29843 7385932 8 362843 7325322 88233 7868938

233253873 988 8223059 !

""" $%&'()%*'+)),-..),/0$.1022'1(3 4('+)),+4.5013 4('6224&7$%.',-..),8'94'(.3 *2%((+4.501/0$.1022'1':.'$;(/0$.1022'1< """

3 =368 5 3 86 3 533338 369339688 5 2336 822868 878 > 823398 6 6 86878 88 525 ?8822 628 @74 3 73298536 8 5 3893 873 !

""" A;7B*2%((CD*%1;EF0;GDH I7JKL'1101(EH%$GKMM A;7B*2%((CD%2'1.%2'1.E;%$N'1DH A42H IJ01'%*5KL'1101(EH%22KM%(L'1101M A27H<<L'1101OOAP27H I'$;J01'%*5 AP42H AP;7BH AF1PH I'$;7J AJ01&&'.50;CD)0(.D%*.70$CD<<104.'KQ%4.501"(.01'QMOODH """

R 325987 733 2323 3 86938S458T> 822382 362843626 3 3 782 398 3693 532933 3 64=2 8298 88 8 93739875 3 992!UU495 U58257U883VW 9X 8Y89632345 826295 Z32 736298

R[8836523 388 3\3 23856 86]^_396823 35 38667867 2332933 256 > 82 886@2938 23 88]6 867 3 738785

012345678149 28 28 17 06 0 1751 0 80 7 80 787 1751 5 757!765 80 7 82 80 7 17 06 0! 01 ""0123480 7 49 5 757 28 0! 5 68 17 ! ! 867 #2880!7 0! 06 $$$

%&'(*(+',&,-.(/(0(+123&22&,41+13&,5+(6,13&,&&7.89:11*/;<181+(/14&+31=

>?@ABCDE?

%1+1&,6FG1/(H1I(8J27F8&*FK&+12&2(G.8/&(L*6F+&(6&3&+&F241+3*F4&/&/(61/11%MNOP31F2(*22:1&'&2( 3&,&1/(2(801*0F+(861/12/(+&F2=Q3,(8/(+126&+'R+41+1R2F+3*(20&*F/&,.+71,+.*S,F1(6&+'R+&(TF'F,12(,,12

-.(141,,(,&+= U23(,1+.F61-.(6(8H&+G126&/1VN+J6F+1&81&61/12V

WXYZ[X]^_XZ

`abcZdXecZYXfcgZah[iiajklmnpqrstpmuqpqkqvmpqwxmytzm{|}qxkluqpqkq~lpslxtz tk•mn€tklnut•r}qxkl‚ƒqt„mptrpmluqtkwqk…†€l‚ƒq…tzl‡rmytxnmulutˆn€lu†lzuq ‰qx€tuqŠlxlr‹t…Œn•Žxlu†luqtk•r}qxk‹€mplrlˆu†pl‚ƒq••€†lzktr€t|‘|prmpqtk ‘•rq•rn€m€†€q’tutxlzut•ƒqŠl†zq“wlk…†n•ylx|•‘tk pqkqtn…tpmlzmulutl zmrŽ†lŽtkŠ”Štqn}xlkt•qx–n•—k}qr—t„lxlytz{l…tnlxutluqxlx€xl˜lzslxpqk}xqr€• trututntryqzymktr€qkq˜mtpqk ™q€zrt••m}€•Šqnn†mlnptx€m}mpl‚štnw›~m‘œ•• ’q†rul€mqrtžtz…smŸ ¡žtytzq…tx•

ˆ•klmz¢ZabX£bc¤a¥¦cZ_¦YZ

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

Introdução

Caro amigo,

Neste último artigo de 2018 irei explorar este Framework conhecido por implementar serviços REST HTTP baseados

na plataforma .NET. Estes tipos de serviços são ideais para comunicação entre diferentes clientes, como por exemplo: Mobile

(Android, IOS), Web (Asp.Net, PHP) e Desktop (Delphi, .NET). Deveremos entender que citei apenas alguns pequenos

exemplos, sendo que existem uma grande quantidade de plataformas e linguagens de programação que também se

encaixariam neste contexto. O padrão “HTTP” serve também como uma poderosa plataforma para criação de APIs que expõem serviços e dados

e o uso do framework “ASP. NET Web API” nos auxiliará com inúmeros recursos pré-configurados para obtermos um

resultado de uma forma simples e de fácil aprendizado.

Para este artigo utilizaremos a IDE “Microsoft Visual Studio 2017” junto com a linguagem C#,então, mãos à obra.

Criando o exemplo Implementaremos um exemplo para retornar alguns registros através do método “GET”, para isto criaremos uma

classe denominada “Funcionarios” com alguns dados cadastrais e um método para invocarmos dentro do “GET”. Para isto,

inicie o “Microsoft Visual Studio 2017”, clicando em “Arquivo/Novo/Projeto...” Teremos uma tela idêntica ao da Imagem 01.

Imagem 01: Criando um novo projeto.

Na região esquerda localize o Item “Web” e dentro do mesmo o Modelo de projeto “Aplicativo Web ASP.NET .(Net

Framework)”. Defina um nome, local e solução e finalize clicando no botão “Ok”.

A próxima tela de configuração poderemos conferir na Imagem 02. Teremos alguns modelos pré-definidos, como

por exemplo:

Web Forms, MVC, Single Page, entre outros, mas especificamente para este artigo escolheremos a opção “Web API”,

a qual implementa um modelo de projeto para criação de serviços HTTP RESTFul. (Para mais informações clique no próprio

link “Saiba mais” do projeto)

Imagem 02: Modelos do ASP.NET 4.6.1.

Por padrão as pastas e referências MVC e Web API são checadas. Clique no botão “OK” para finalizar o processo. Poderemos ver a

imensa diversidade de itens criados, ou seja, estamos lidando não apenas com um serviço “Rest” e sim

com um exemplo de Projeto ASP.NET MVC. Ver Figura 03.

Atenção: Nos focaremos apenas nos itens que forem necessários para nosso serviço.

Imagem 03: Gerenciador de soluções.

Criando a Classe Funcionários Esta classe será responsável por armazenar e selecionar alguns registros para fins de aprendizados. Para isto clique

na pasta “Models” e com o botão direito escolha “Adicionar/Novo Item”. Defina o nome da classe como “Funcionarios.cs”,

ver Imagem 04.

Imagem 04: Classe Funcionários.

Criaremos alguns atributos como por exemplo: Código, Nome, Sobrenome, Setor e Cidade. Ver Listagem 01.

namespace TheClubRest.Models

{

public class Funcionario

{

public int Codigo { get; set; }

public string Nome { get; set; }

public string Sobrenome { get; set; }

public string Setor { get; set; }

public string Cidade { get; set; }

} }

Listagem 01.

Criando o Controller Funcionários O controller funcionários servirá para se comunicar com a classe criada anteriormente, para isto escolha a pasta

“Models” clicando com o botão direito em Adicionar/Controlador/Controlador Web API 2 – Vazio”. Os detalhes estarão

disponíveis na Figura 05.

Imagem 05: Controlador Funcionários.

Clique no botão “Adicionar” e insira o nome “FuncionariosController” para o mesmo ser criado.

Por padrão teremos os métodos Get, Post, Put e Delete. Ver listagem 02.

namespace TheClubRest.Models

{

public class FuncionarioController : ApiController

{

// GET api/funcionario

public System.Collections.IEnumerable Get()

{

return new string[] { "value1", "value2" };

} // GET api/funcionario/5

public string Get(int id)

{

return "value";

}

// POST api/funcionario public void Post([FromBody]string value)

{

}

// PUT api/funcionario/5

public void Put(int id, [FromBody]string value)

{

} // DELETE api/funcionario/5

public void Delete(int id)

{

}

}

}

Listagem 02.

Por padrão de projetos ”Web API” teremos os nomes dos métodos expressando a ocasião em que os mesmos serão

chamados, ou seja, através do “HTTP” via URI o serviço “Web API” retornará os resultados. Podemos concluir então que:

Get = “Select”

Post = “Insert”

Put = “Update”

Delete = “Delete”

Neste artigo teremos foco no primeiro verbo “Get”, para assim retornarmos alguns dados inseridos na classe

“Funcionarios”.

Criando o método Dentro do próprio “Controller” deveremos criar o método para retornar alguns dados dos

funcionários através da classe criada no momento anterior. Veja Listagem 03.

private readonly Funcionario[] Funcionarios = new

Funcionario[] {

new Funcionario

{

Codigo = 1,

Nome = "Thiago",

Sobrenome = "C. Montebugnoli",

Setor = "TI",

Cidade = "Avaré"

},

new Funcionario

{

Codigo = 2,

Nome = "João",

Sobrenome = "da Silva",

Setor = "RH",

Cidade = "Arandu"

},

new Funcionario

{

Codigo = 3, Nome = "Maria",

Sobrenome = "Souza",

Setor = "ADM",

Cidade = "Cerqueira César"

},

new Funcionario

{

Codigo = 4,

Nome = "Antonio",

Sobrenome = "Ornelas",

Setor = "Patrimônio",

Cidade = "Avaré"

}, };

Listagem 03.

Para retornar os dados utilizaremos o método “Get” e para isto iremos programar o código abaixo:

// GET api/funcionario

public Funcionario[] Get()

{

return Funcionarios;

}

Pronto, nosso exemplo está finalizado para retornar os dados da classe Funcionários. Após rodar o projeto teremos

uma tela padrão de projetos MVC, com alguns detalhes auto-explicativos os quais não nos atentaremos no momento. Para

acessarmos os métodos, com suas configurações padrões, usaremos a seguinte rota:

http://localhost:49686/Api/funcionario

Teremos um resultado idêntico ao da Figura 06.

Imagem 06: Resultado.

Conclusões Podemos aprender neste artigo o uso de um dos principais recursos da plataforma .NET para criar facilmente

serviços REST, o ASP. NET Web API. Nos sistemas atuais a integração de plataformas se tornou um item de extrema

importância e indispensável. Podemos implementar métodos de “Select, Insert, Update e Delete”, os quais são chamados

através dos verbos GET, POST, PUT e DELETE os quais estão presentes no padrão HTTP.

Espero que tenha gostado, desejo uma ótima leitura, um Feliz Natal e um próspero Ano Novo!

Referências https://docs.microsoft.com/pt-br/aspnet/web-api/overview/getting-started-with-aspnet-web-

api/tutorial-your-first-web-api

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.