Esse artigo faz parte da revista WebMobile edição 1. Clique aqui para ler todos os artigos desta edição

wm1_capa.JPG

Construindo sua primeira aplicação para POCKET PC com .NET

Introdução

O mundo móvel tem avançado no mercado de desenvolvimento de aplicações de forma a agregar valor às aplicações existentes. O acesso à informação em qualquer lugar ou hora tem conquistado vários segmentos que precisam dos dados na palma da mão, por exemplo, equipe de vendas, corretores de bolsa de valores, gerente de contas, etc.

O fato da informação estar armazenada em um dispositivo móvel não significa que ela não possa ser atualizada, pelo contrário, a informação deverá estar sempre atualizada de acordo com a necessidade da aplicação, por exemplo, quando você for fechar um negócio em dólares, é preciso saber a cotação naquele instante.

Com a chegada dos telefones celulares na década de 90, o mundo percebeu que haveria uma mudança radical nos meios de comunicação. E isto realmente ocorreu em favor da tecnologia. Haja visto que atualmente o número de celulares já ultrapassou o número de linhas fixas. Evoluindo para um cenário de aplicações móveis, o uso de SMS (Short Message Service) tornou-se uma forma barata e simples de integrar informações. Hoje em dia já dispomos em diversos pontos do mundo os aparelhos chamados Access Point (ponto de acesso), o qual provêem sinais de rede. O alcance do sinal varia de 100 a 150 metros, mas estudos já estão sendo concluídos para que o sinal chegue a 75 km. Com isso, teremos uma rede sem fio (Wi-Fi Wireless Fidelity) paralela e todo equipamento que estiver preparado para receber este sinal Wi-Fi estará na rede. Os dispositivos incluem notebooks, Pocket PCs, smartphone, celulares, Phone-Edition, DVD, televisão, etc.

Outra tecnologia que está se destacando é o bluetooth, que permite a conexão a um dispositivo até uma distância 10 metros. Mas, não confunda Wi-Fi com bluetooth. São objetivos diferentes, o Wi-Fi provê sinal de rede e o bluetooth apenas um sinal de comunicação limitado.

Neste tutorial iremos desenvolver um projeto voltado ao Pocket PC, onde mostrarei como criar um projeto, formulários, controles, menu, acesso a banco de dados e deploy de uma aplicação. No tocante ao banco de dados, cabe ressaltar que se você já estiver conectado a uma rede Wi-Fi, significa que você já tem acesso a qualquer dado existente na rede, seja TCP/IP ou http. Com isso, os dados não ficarão armazenados no Pocket, mas sim, as consultas serão efetuadas diretamente no banco de dados da empresa. No entanto, por questões de aprendizado, mostrarei como você pode criar um banco de dados no Pocket PC utilizando o SQL Server CE e manipular alguns desses dados.

A plataforma utilizada neste treinamento é a .NET Compact Framework, que é um subconjunto da plataforma .NET completa. Contém funcionalidades específicas para estes tipos de dispositivos móveis e ao mesmo tempo é rico na linguagem, integração de dados via XML Web Services e outros recursos presentes no .NET.

Ferramentas

A ferramenta mais utilizada para desenvolver aplicações para Pocket PC e Smartphone é o Visual Studio .NET 2003. Ele contém todos os requisitos para o desenvolvimento, debug e deploy. Para desenvolver estes tipos de aplicações não é preciso ter o hardware (Pocket ou Smartphone), pois o VS.NET 2003 dispõe de emuladores. No caso de Pocket PC, o emulador instalado é o padrão, no entanto, você pode baixar no link http://www.microsoft.com/downloads/details.aspx?familyid=4953d34d-692f-4c87-ac69-cb235dbdad1d&displaylang=en o Emulator Images for Windows Mobile 2003 Second Edition-based Pocket PC Development. Para conectar o VS.NET 2003 ao emulador ou ao dispositivo diretamente, você precisará do Microsoft ActiveSync 3.7.1  (http://www.microsoft.com/downloads/details.aspx?FamilyID=2eb5bd80-d52c-4560-ae11-da92f2b229fa&displaylang=en). Este é o programa que se encarregará de transferir qualquer tipo de dado para o Pocket PC. Você deve ter a base (craddle) do Pocket PC conectada via USB ao seu computador e pronto, o ActiveSync se encarrega do restante.

As linguagens utilizadas podem ser Visual Basic. NET, Visual C# ou C++. Cabe ressaltar que muitos desenvolvedores usavam o Visual Basic Embedded, no entanto, esta linguagem não é mais suportada. Agora é um novo mundo, nova plataforma, novas linguagens.

O sistema operacional destes dispositivos são oriundos do WinCE 4.2 e nos dispositivos são conhecidos como Pocket PC 2003 ou Windows Mobile. Portanto, observe com muita atenção quando você comprar um dispositivo qual é o SO. Se for Pocket PC 2002, não compre, pois possuem certas funcionalidades que não são suportadas. Neste caso quem se encarrega de atualizar a ROM é o fabricante, então, deixe isto para ele. Em termos de desenvolvimento é válido dizer que você pode desenvolver uma aplicação em Pocket PC 2003 e instalar no 2002. Salvo casos de features que só executam no 2003, o restante irá rodar.

Interfaces com Usuários (UI)

Criar uma interface (UI) sempre foi um desafio em qualquer tipo de aplicação. A começar pelo tamanho da tela, os tipos de controles, a forma de navegar e interagir com a aplicação. No caso de Pocket PC é preciso analisar cuidadosamente o local, o operador e as interferências com o meio. Dependendo do uso, isto significa montar uma UI completamente customizável com o usuário. Imagine um local com uma incidência solar diretamente na tela do Pocket, o reflexo da luz, ou por outro lado, em uma sala escura de exames de radiologia. Enfim, com o tempo você aprenderá a contornar e entender melhor a UI.

A interação com o usuário ocorre com uma caneta touch screen através da qual o usuário faz todas as operações, desde digitação (exceto os Pockets com teclado), selecionar controles e qualquer tipo de operação. É válido dizer que ainda não é usual encontrar em aplicações para Pocket o reconhecimento de voz, mas em breve teremos boas novidades na área.

Vistos estes conceitos iniciais, veremos a partir de agora em um passo a passo como desenvolver uma aplicação para Pocket PC na linguagem C#.

Projeto Novo

Abra o Visual Studio .NET 2003, selecione File / New / Project (Ctrl + Shift + N) e digite os dados (ver Figura 1):

·         Project Types: Visual C# Projects

·         Templates: Smart Device Application

·         Name: tutorialPocket

·         Location: C:\Projetos\WebMobile

 

image001.png

Figura 1.

 

Clique no botão OK e será exibida uma nova janela (ver Figura 2) contendo opções para Pocket PC, Windows CE ou Smartphone. Selecione Pocket PC e em tipos de projetos, Windows Application. Note ainda que a quantidade de emuladores disponíveis nesta janela depende da quantidade instalada na sua máquina.

image003.png

(clique aqui para ampliar a imagem)

Figura 2.

 

Clique no botão OK para criar o projeto. Note que a Solution chama-se tutorialPocket e que é criado o Form1.cs automaticamente (ver Figura 3). Clique com o botão direito sobre o Form1.cs e exclua-o.

 

image005.png

(clique aqui para ampliar a imagem)

Figura 3.

 

Para criar qualquer formulário durante todo o artigo, abra o Solution Explorer, clique com o botão direito sobre tutorialPocket e selecione Add / Add Windows Form, informe o nome e clique no botão Open.

Controles e Propriedades

Os controles existentes para Pocket PC são similares aos de uma Windows Application, no entanto, nem todos possuem as mesmas características, por exemplo, o ListBox não permite seleções múltiplas, o Datagrid não permite alterações no conteúdo das células nativamente, entre outras.

Para começar, adicione um formulário chamado frmLogin. Selecione o menu View / Toolbox para exibir a caixa de ferramentas (Ctrl + Alt + X), arraste para o formulário os controles da Tabela 1. Após isso, pressione F4 para exibir a janela de propriedades e para cada controle configure.

 

1 PictureBox

Image: insira uma imagem conforme o logo da sua empresa

SizeMode: normal/stretch/center

2 Labels

Text: Nome

Text: Senha

2 TextBox

Name: txtNome    Text: branco

Name: txtSenha      PasswordChar: *       Text: branco

1 Button

Name: btnAcessar    Text: Acessar

Tabela 1.

 

Agora inclua os controles MainMenu e InputPanel. Estes controles são específicos para montar um menu e para exibir o InputPanel quando o usuário precisar digitar algo no teclado virtual do Pocket. Cabe ressaltar que este teclado deverá ser exibido via programação conforme o contexto. A Figura 4 apresenta o formulário com os controles inseridos.

 

 

image007.png

(clique aqui para ampliar a imagem)

Figura 4.

 

Selecione o formulário e configure as propriedades: BackColor (192, 192, 255), minimizeBox = False e Text = Controle de Acesso. O minimizeBox = False fará com que toda vez que o formulário for fechado através do controle (X) na janela da aplicação, este projeto não fique na memória do Pocket, evitando assim ter que liberar a aplicação da memória quando não estiver em uso. Veremos isto em maiores detalhes no momento do deploy.

Códigos

O primeiro passo é exibir o InputPanel assim que um determinado TextBox receber o foco e ocultá-lo quando perder o foco. Selecione o txtNome, exiba as propriedades (F4), clique no ícone de Events (raio), selecione o evento GotFocus e clique duas vezes sobre ele

(ver Figura 5).

 

image009.png

Figura 5.

 

Digite o seguinte código:

 

private void txtNome_GotFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = true;

}

 

Faça o mesmo para o txtSenha:

 

private void txtSenha_GotFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = true;

}

 

Para ocultar o InputPanel o processo é idêntico, no entanto ocorre no evento LostFocus. Assim, insira os respectivos códigos para os controles.

 

private void txtNome_LostFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = false;

}

private void txtSenha_LostFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = false;

}

 

Para o botão btnAcessar, digite o código da Listagem 1 que irá verificar se todos os dados necessários foram digitados. Perceba que usei a classe System.Text.StringBuilder para concatenar strings. Use e abuse desta classe, pois foi criada para esta finalidade e é muito mais rápido que qualquer outro meio de concatenação que você conheça.

 

private void btnAcessar_Click(object sender, System.EventArgs e)

{

       if (txtSenha.Text.Trim() != string.Empty &

              txtNome.Text.Trim() != string.Empty)

       {

              System.Text.StringBuilder msg = new System.Text.StringBuilder();

              msg.Append("Caro ");

              msg.Append(txtNome.Text.Trim());

              msg.Append(" seu acesso está autorizado!!!");

              MessageBox.Show(msg.ToString(),"Pocket PC");

       }

       else

       {

              MessageBox.Show("Digite todas as informações","Pocket PC");

              txtNome.Focus();

       }

}

Listagem 1.

 

Todos os códigos de UI já estão definidos, restando agora o código para rodar a aplicação. Para isto, localize o trecho de código chamado “#region Windows Form Designer generated code” o qual é padrão em toda aplicação C#.  Logo abaixo deste trecho, digite o seguinte código para executar a aplicação, o qual irá abrir o formulário frmLogin declarado no argumento do Run.

 

static void Main()

{

       Application.Run(new frmLogin());

}

 

Para verificar se existem erros, você pode selecionar o menu Build / Build Solution. Se for exibida esta mensagem “Build: 1 succeeded, 0 failed, 0 skipped” na janela de output, significa que foi gerada a DLL com sucesso e é só distribuir aos clientes. No entanto, como iremos rodar com o emulador, o meio mais rápido é presssionar F5 ou o menu Debug / Start. Será exibida uma janela com todas as opções de emuladores existentes. Selecione o Pocket PC 2003 Emulator e clique no botão Deploy (ver Figura 6).

 

image011.png

Figura 6.

 

Se for a primeira vez que o emulador for aberto, é possível que ocorra um erro de comunicação com o mesmo. A dica é: faça o deploy sempre com o emulador aberto. Para isto, existe uma barra de ferramentas de Device onde você pode abrir em qualquer momento o emulator que desejar. Para exibir a respectiva barra, clique com o botão direito em qualquer barra de ferramentas e selecione Device. Enfim, se ocorreu algum erro, faça novamente o deploy e note que a aplicação é aberta exatamente no formato que você criou.

Caso tenha o Pocket conectado ao computador via ActiveSync e queira fazer o deploy no mesmo, selecione Pocket PC Device. Note que quando os TextBoxes recebem o foco, o teclado é exibido automaticamente (ver Figura 7).

image013.png

Figura 7.

 

Dando continuidade ao desenvolvimento de nossa aplicação, adicione um novo formulário (Add / Add Windows Form) chamado frmVendas. Configure a propriedades BackColor (192, 192, 255), minimizeBox = False e Text = Vendas. Exiba a Toolbox e adicione o controle TabControl. Este controle pode ter diversas TabPages, e neste projeto iremos inserir duas. Em propriedades (F4), selecione a TabPages e note que é exibido um botão construtor (...) para a Collection de páginas (ver Figura 8). Clique neste botão, em seguida no Add e Text, e digite: Vendas; repita o passo e adicione a Tab Financiamento. Veja o formulário com as duas páginas inseridas (ver Figura 8).

 

image015.png

Figura 8.

 

A partir de agora você pode inserir quantos controles forem necessários em cada página. A vantagem do TabControl é justamente a de reunir diversos controles afins no mesmo formulário. Futuramente, quando você vier a carregar dados nestes controles e notar que na abertura do formulário a performance está lenta, será possível adicionar os controles em tempo de execução.

Na guia de Vendas, adicione os seguintes controles: 2 Labels e 2 ListBox (Name: lstFab e lstModelos). O funcionamento se dará da seguinte forma: quando o formulário for carregado será exibida a lista de fabricantes no lstFab. Quando o usuário selecionar um fabricante, então, via código iremos pesquisar todos os modelos de veículos disponíveis para venda.

Selecione a lstFab e nas propriedades Items digite uma lista com os fabricantes existentes na loja. Clique no botão OK e note que a lstFab já contém todos os items (ver Figura 9).

 

image017.png

Figura 9.

 

Já a lista de modelos depende do fabricante selecionado. Dê um duplo clique no lstFab e note que é criado o evento onde o código apresentado na Listagem 2 deverá ser digitado.

 

private void lstFab_SelectedIndexChanged(object sender, System.EventArgs e)

{

       // define um array para montar a lista de modelos

       ArrayList aModelos = new ArrayList();

       // verifica qual fabricante foi selecionado e para

       // item é montada uma lista de modelos

       switch (lstFab.SelectedItem.ToString())

       {

              case "GM":

                     aModelos.Add("Blazer Executive 2003");

                     aModelos.Add("S10 4 portas 2004");

                     aModelos.Add("Omega 2003/4");

                     aModelos.Add("Corsa Hatch 2003/4");

                     break;

              case "VOLKS":

                     aModelos.Add("Audi A4 2002/3");

                     aModelos.Add("Passat 2004");

                     aModelos.Add("Golf 2004/5");

                     aModelos.Add("Audi A8 0km");

                     aModelos.Add("Santana 0km");

                     break;

              case "FORD":

                     aModelos.Add("Explorer 2002");

                     aModelos.Add("Mondeo 2003");

                     break;

              case "FIAT":

                     aModelos.Add("Marea 2002");

                     aModelos.Add("Marea Weekend 2003");

                     aModelos.Add("Palio Adventure 0km");

                     break;

              case "MITSUBISHI":

                     aModelos.Add("Pajero Full 0km");

                     aModelos.Add("Pajero Sport 2003");

                     aModelos.Add("Pajero Sport 2003");

                     aModelos.Add("Pajero TR4 2005");

                     aModelos.Add("L200 Sport HDE");

                     break;

              case "CITROEN":

                     aModelos.Add("C3 2005");

                     aModelos.Add("C5 2004 e 2005");

                     aModelos.Add("Picasso 2002/3/4");

                     break;

       }

       // classifica a lista

       aModelos.Sort();

       // define a origem da lstModelos que é o array montado

       lstModelos.DataSource = aModelos;

}

Listegam 2.

 

Na guia de Financiamentos adicione os controles apresentados na Tabela 2. O formulário deverá ficar com a aparência da Figura 10.

 

PictureBox

Image: sua figura

SizeMode: normal/stretch/center

Labels

Text: Valor / Entrada / Juros / Parcelas

TextBox

Name: txtValor / txtEntrada / txtJuros       Text: branco

NumericUpDown

Name: numParcelas    Maximum: 50    Minimum: 1    Value: 1

Button

Name: btnCalcular    Text: Calcular

Label

Name: lblValor  (configure as propriedades Forecolor e Font: size e bold)

Tabela 2.

 

image019.png

Figura 10.

 

Agora dê um duplo clique no botão Calcular para montar a fórmula que calcula o valor da prestação referente ao financiamento do veículo. Esta é apenas uma fórmula matemática de cálculo onde são passados os parâmetros digitados pelo usuário. No entanto, existe uma particularidade para chamar a fórmula PMT (Pagamento). Como ela depende de uma classe do Visual Basic, precisamos referenciar a respectiva classe. Para isso, selecione o menu Project / Add References, selecione a classe Microsoft.VisualBasic e clique no botão OK (ver Figura 11).

 

image021.png

Figura 11.

 

Como esta classe ficará na lista de References do Solution Explorer (ver Figura 12), você poderá utilizá-la em qualquer parte do projeto. Cabe ressaltar que uma das grandes vantagens da plataforma .NET é a independência de linguagem. Neste nosso exemplo temos um projeto em C# usando uma classe em VB.NET.

 

image023.png

Figura 12.

 

Em seguida, digite o código do botão que captura os valores digitados e invoca a fórmula PMT para calcular o valor da prestação do financiamento (ver Listagem 3).

 

private void btnCalcular_Click(object sender, System.EventArgs e)

{

       double juros = Convert.ToDouble(txtJuros.Text) /100;

       Int32 parcelas = Convert.ToInt32(numParcelas.Text);

       double valor = Convert.ToDouble(txtValor.Text);

       double entrada = Convert.ToDouble(txtEntrada.Text);

       if (entrada > 0)

       {

              valor -= entrada;

       }

       double resultado = - Microsoft.VisualBasic.Financial.Pmt(juros,parcelas,valor,0, Microsoft.VisualBasic.DueDate.EndOfPeriod);

       lblValor.Text = string.Format("R$ {0:n2}", resultado);

}

Listagem 3.

 

Note que como o usuário irá fornecer os respectivos valores, é preciso exibir o InputPanel. Para isso, adote a mesma estratégia do formulário anterior com os comandos apresentados na Listagem 4. O resultado do funcionamento do que elaboramos neste passo pode ser visto na Figura 13.

 

private void txtValor_GotFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = true;

}

 

private void txtEntrada_GotFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = true;

}

 

private void txtJuros_GotFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = true;

}

 

private void txtValor_LostFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = false;

}

 

private void txtEntrada_LostFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = false;

}

 

private void txtJuros_LostFocus(object sender, System.EventArgs e)

{

       inputPanel1.Enabled = false;

}

Listagem 4.

 

image025.png

Figura 13.

Este formulário será executado apenas se o usuário conseguir fazer o login corretamente no formulário frmLogin. Sendo assim, abra novamente o código do botão Acessar do frmLogin e inclua o código em negrito para instanciar e abrir o formulário de vendas (ver Listagem 5).

 

private void btnAcessar_Click(object sender, System.EventArgs e)

{

       if (txtSenha.Text.Trim() != string.Empty &

              txtNome.Text.Trim() != string.Empty)

       {

              System.Text.StringBuilder msg = new System.Text.StringBuilder();

              msg.Append("Caro ");

              msg.Append(txtNome.Text.Trim());

              msg.Append(" seu acesso está autorizado!!!");

              MessageBox.Show(msg.ToString(),"Pocket PC");

              frmVendas frm = new frmVendas();

              frm.ShowDialog();

       }

       else

       {

              MessageBox.Show("Digite todas as informações","Pocket PC");

              txtNome.Focus();

       }

}

Listagem 5.

 

Agora pressione F5 para executar o formulário e testá-lo. Após o login é exibida uma mensagem ao usuário informando que o acesso está autorizado. Em seguida é montada a ListBox com os fabricantes e ao selecionar um item é montada a outra ListBox com todos os modelos do respectivo fabricante selecionado (ver Figura 14).

 

image027.png

Figura 14.

 

Para calcular o financiamento de um veículo, clique na guia Financiamento, informe os devidos valores e clique no botão Calcular para efetivar a fórmula de cálculo (ver Figura 15).

 

image029.png

Figura 15.

Imagens

O Pocket PC contém um controle PictureBox para exibir uma determinada imagem. No entanto, é possível montar um container de imagens armazenadas em um controle para permitir uma navegação neste container. Como o formulário frmVendas contém o TabControl, selecione-o, exiba as propriedades (F4) e na propriedade TabPages, adicione uma nova chamada Fotos (ver Figura 16). Insira os controles apresentados na Tabela 3.

 

1 PictureBox

Name: picFotos     Size: 216, 200     SizeMode: StretchImage

2 Button

Name: btnProximo    Text: >>

Name: btnAnterior     Text: <<

Tabela 3.

 

image031.png

Figura 16.

 

A partir da Toolbox, arraste o controle ImageList para o formulário. Exiba as propriedades e em Images clique em Add para cada imagem que você quiser inserir (ver Figura 17). Neste exemplo, temos várias fotos de veículos da concessionária. Assim, os clientes poderão ver mais detalhes dos carros diretamente no Pocket. Caso queira remover uma imagem, selecione-a e clique em Remove. Ao finalizar, clique em OK para montar todo o Container do objeto ImageList1.

 

image033.png

Figura 17.

 

Os botões de navegação servirão para navegar no Container. Para isto, digite o código apresentado na Listagem 6. Note que é verificado o índice do Container e é invocada uma rotina para exibir a foto no controle picFotos. Não se esqueça de inicializar a variável índice no início das declarações:

 

private int indice = -1;

 

private void btnProximo_Click(object sender, System.EventArgs e)

{

       if (indice >= imageList1.Images.Count - 1)

       {

              indice = 0;

       }

       else

       {

              indice +=1;

       }

       MostraImagem(indice);     

}

 

private void MostraImagem(int indice)

{

       picFotos.Image = imageList1.Images[indice];

       Text = "Imagem " + (indice + 1).ToString() + " de " + imageList1.Images.Count.ToString();

}

 

private void btnAnterior_Click(object sender, System.EventArgs e)

{

       indice -=1;

       if (indice < 0)

       {

              indice = imageList1.Images.Count -1;

       }

       MostraImagem(indice);

}

Listagem 6.

 

Agora salve o projeto e execute-o no emulador (ver Figura 18).

 

image035.png

Figura 18.

Oficina

Quando um cliente chega à concessionária de veículos ele pode solicitar alguns serviços extras para o seu carro. Neste formulário iremos prover meios para que o atendente possa disponibilizar uma série de serviços para o cliente. Todos estes dados serão montados em uma matriz e exibidos em um controle ListBox. Em seguida, quando o cliente solicitar um serviço, este será transferido para outra ListBox de serviços contratados. Cabe ressaltar que para efeito de manutenção na ListBox é preciso criar os botões para excluir um item ou limpar todo o conteúdo.

Outra possibilidade que daremos ao cliente é adicionar um novo serviço não disponível na lista. Portanto, criaremos uma UI para que o serviço seja informado e incluído na lista de serviços contratados. Para isto, adicione um novo formulário (Add / Add Windows Form) chamado frmOficina contendo os controles apresentados na Tabela 4. O formulário deverá ficar semelhante ao apresentado na Figura 19.

 

2 Label

Text: Oferecidos       Contratados

2 ListBox

Name: lstServOferecidos     lstServContratados

5 Button

Name: btnContratar    Text: Contratar

Name: btnExcluir        Text: Excluir

Name: btnIncluir         Text: Incluir Novo Serviço      Visible: False

Name: btnLimpar        Text: Limpar Seleção

Name: btnNovo           Text: Novo Serviço

1 TextBox

Name: txtNovoServico     Visible: False

1 MainMenu

 

1 InputPanel

 

Tabela 4.

 

Altere as propriedades do formulário, sendo: MinimizeBox = False e Text = Oficina. Note que neste formulário há um controle TextBox e um Button (Incluir Novo Serviço) sobreposto à lstServContratados. A idéia aqui é fazer com que toda vez que o cliente contratar um serviço que não conste na lista, ou seja, o usuário terá que digitar, o controle lstServContratados fique oculto até que este novo serviço seja digitado. Assim, no momento da montagem da estrutura deste formulário, você pode sobrepor os controles. Ainda assim, note que na tabela anterior de controles, tanto o btnIncluir quanto o txtNovoServico estão com a propriedade Visible igual a False.

image037.png

Figura 19.

 

O passo agora é montar a matriz com todos os serviços a serem oferecidos ao cliente. Pressione F7 para exibir a janela de códigos, localize o a sessão InicializeComponent() e digite o código da Listagem 7.

 

public frmOficina()

{

       //

       // Required for Windows Form Designer support

       //

       InitializeComponent();

 

       //

       // TODO: Add any constructor code after InitializeComponent call

       //

       // define o array de serviços oferecidos

       ArrayList servicos = new ArrayList();

       servicos.Add("Serviço de entrega");

       servicos.Add("Lavação completa");

       servicos.Add("Brilho total da pintura");

       servicos.Add("Polimento com cera");

       servicos.Add("Calibragem dos pneus");

       servicos.Add("Alinhamento dos pneus");

       servicos.Add("Balanceamento de rodas");

       servicos.Add("Troca de óleo");

       // classifica a lista

       servicos.Sort();

       // atribui como fonte de dados

       lstServOferecidos.DataSource = servicos;

       // desmarca todos os itens

       lstServOferecidos.SelectedIndex = 0;

}

Listagem 7.

 

Note que a relação de serviços pode ser digitada em qualquer ordem. No final, o método Sort se encarrega de classificar todos os itens em ordem crescente. O DataSource informa qual será a origem do objeto lstServOferecidos. Como é uma lista fixa, então é preciso defini-la anteriormente, mas uma outra possibilidade que veremos futuramente no treinamento é que estes dados podem vir diretamente de um banco de dados do servidor da empresa ou direto do SQL Server CE ou de um arquivo XML.

Ao final, a propriedade SelectedIndex = 0 faz com que nenhum item seja selecionado, ou seja, o cliente terá efetivamente que selecionar um determinado item para contratá-lo. Neste caso, o botão Contratar irá verificar se algum item está selecionado, e caso verdadeiro, transfere o item para a lista de serviços contratados (lstServContratados). Dê um duplo clique no botão e digite o código da Listagem 8. A Figura 20 apresenta o funcionamento do que acabamos de implementar na aplicação.

 

private void btnContratar_Click(object sender, System.EventArgs e)

{

       // verifica se algum item está selecionado

       if (lstServOferecidos.SelectedIndex >= 0)

       {

              // adiciona o item a lista

              lstServContratados.Items.Add(lstServOferecidos.SelectedItem);

       }

}

Listagem 8.

 

image039.png

Figura 20.

 

O botão Excluir permite excluir da lista de contratados um determinado item. Para implementar esta funcionalidade, dê um duplo clique no botão e digite o código da Listagem 9.

 

private void btnExcluir_Click(object sender, System.EventArgs e)

{

       // verifica se algum item está selecionado

       if (lstServContratados.SelectedIndex >= 0)

       {

              // remove o item selecionado da lista

              lstServContratados.Items.RemoveAt(lstServContratados.SelectedIndex);

       }

}

Listagem 9.

 

O botão Limpar Seleção deverá limpar todos os itens selecionados na lista de contratados. Note que antes de efetivar a exclusão, é questionado ao usuário se ele deseja realmente excluir todos os itens (ver Figura 21). Veja o código deste botão na Listagem 10.

 

private void btnLimpar_Click(object sender, System.EventArgs e)

{

       // pergunta se tem certeza da exclusão

       if (MessageBox.Show("Exclui todos os serviços contratados?", "Pocket PC") == DialogResult.OK)

       {

              // limpa toda a lista

              lstServContratados.Items.Clear();

       }

}

Listagem 10.

 

image041.png

Figura 21.

 

Em casos onde o cliente queira um serviço que não esteja na lista, este terá que ser informado no TextBox e adicionado à lista. Para prover esta funcionalidade, digite o código para o botão Novo Serviço o qual irá ocultar a lstServContratados, exibir o txtNovoServico, o InputPanel e o btnIncluir e colocar o foco no txtNovoServico (ver Listagem 11). Com este mecanismo conseguimos montar uma UI mais inteligente.

 

private void btnNovo_Click(object sender, System.EventArgs e)

{

       // inclui um serviço especial

       lstServContratados.Visible = false;

       txtNovoServico.Visible = true;

       inputPanel1.Enabled = true;

       btnIncluir.Visible = true;

       txtNovoServico.Focus();

}

Listagem 11.

 

Uma vez que o usuário tenha digitado o novo serviço, é preciso inserir o mesmo à lista. Digite o código do botão Incluir Novo Serviço para esta finalidade (ver Listagem 12). Note que é verificado se algo foi digitado no txtNovoServico. O método Text captura o texto digitado e o Trim retira os possíveis espaços em branco tanto à direita quanto à esquerda da expressão. Em seguida, se houver um texto digitado, o item é adicionado à lstServContratados. No final, os controles que foram ocultados são exibidos e vice-versa, para assim retornar a UI original. A Figura 22 apresenta o funcionamento do que acabamos de implementar na aplicação.

 

private void btnIncluir_Click(object sender, System.EventArgs e)

{

       // verifica se algo foi digitado

       if (txtNovoServico.Text.Trim().Length > 0 )

       {

              // adiciona o novo serviço a lista

              lstServContratados.Items.Add(txtNovoServico.Text.Trim());

       }

       // apaga o conteúdo do textBox

       txtNovoServico.Text = string.Empty;

       txtNovoServico.Visible = false;

       inputPanel1.Enabled = false;

       lstServContratados.Visible = true;

       btnIncluir.Visible = false;

}

Listagem 12.

 

image043.png

Figura 22.

 

Pronto, este formulário de oficina está finalizado para ser executado. No entanto, antes de executá-lo é preciso realizar alguns ajustes no frmLogin.

Menu

Como já dispomos de três formulários neste projeto, frmLogin, frmVendas e frmOficina, vamos montar um menu para acessar as devidas opções. Abra o frmLogin, clique no controle MainMenu e crie um menu com as opções apresentadas na Figura 23.

 

image23.JPG

Figura 23.

 

Na opção Oficina, dê um duplo clique e digite o código para abrir o formulário frmOficina:

 

private void menuItem3_Click(object sender, System.EventArgs e)

{

       frmOficina frm = new frmOficina();

       frm.ShowDialog();

}

 

Faça o mesmo para a opção Vendas:

 

private void menuItem2_Click(object sender, System.EventArgs e)

{

       frmVendas frm = new frmVendas();

       frm.ShowDialog();

}

 

Para a opção Sair, digite o código para fechar o formulário:

 

private void menuItem4_Click(object sender, System.EventArgs e)

{

       Close();

}

 

Pelo funcionamento do frmLogin, o usuário só deve ter acesso aos menus de Vendas e Oficina caso esteja logado, portanto, configure a propriedade Enabled = False para os itens do menu (menuItem2 – Vendas e menuItem3 – Oficina). Altere o código do botão Acessar incluindo as linhas em negrito da Listagem 13 para habilitar os respectivos itens de menu para o usuário logado. Desta forma, você consegue controlar cada uma das opções de um MainMenu.

 

private void btnAcessar_Click(object sender, System.EventArgs e)

{

       if (txtSenha.Text.Trim() != string.Empty &

              txtNome.Text.Trim() != string.Empty)

       {

              System.Text.StringBuilder msg = new System.Text.StringBuilder();

              msg.Append("Caro ");

              msg.Append(txtNome.Text.Trim());

              msg.Append(" seu acesso está autorizado!!!");

              MessageBox.Show(msg.ToString(),"Pocket PC");

              menuItem2.Enabled = true;

              menuItem3.Enabled = true;

       }

       else

       {

              MessageBox.Show("Digite todas as informações","Pocket PC");

              txtNome.Focus();

       }

}

Listagem 13.

 

Salve e execute o projeto. Note na Figura 24 que as opções do menu ficam desativadas enquanto não houver um login válido.

 

image047.png

Figura 24.

Instalação

O processo de instalação de uma aplicação no Pocket chama-se Deploy. Após todos os códigos testados e aprovados, você deverá distribuir a aplicação para ser executada em qualquer tipo de Pocket PC que contenha o sistema operacional Pocket PC 2003 ou Windows Mobile. No entanto, você tem várias opções, sendo:

1) Fazer o deploy direto no Pocket via ActiveSync;

2) Disponibilizar no servidor da empresa o arquivo de instalação, onde o usuário faz o download e instala. Neste caso, é preciso que o usuário tenha o .NET Compact Framework;

3) Através do Internet Explorer do Pocket, o usuário acessa o executável no servidor da empresa e instala;

4) Copia para o Pocket via ActiveSync e instala.

 

Cada processo tem suas particularidades, sendo que o único passo em comum é gerar o Release. Para isso, com o projeto aberto, selecione a opção Release na barra de ferramentas Standard (ver Figura 25). O Release não permite o uso do Debug futuramente e o produto final ficará mais enxuto para ser executado.

 

image049.png

Figura 25.

 

Estando com o Pocket na base (cradle) e o ActiveSync rodando, selecione o menu Build / Deploy Solution. Na janela aberta selecione Pocket PC Device e clique em Deploy. Você não precisa se preocupar se o .NET Compact Framework está ou não instalado no Pocket porque o processo de instalação se encarrega disto. Você irá ver a instalação primeiro do .NET CF e depois a da sua aplicação.

É importante notar que o local de instalação pode ser alterado conforme a sua necessidade. Veja nas propriedades do projeto que existe a opção Output File Folder que normalmente é \Program Files\Aplicação (neste caso \Program Files\tutorialPocket) (Figura 26). Para acessar estas propriedades, abra o Solution Explorer, clique com o botão direito sobre a Solution e selecione Properties.

 

image051.png

Figura 26.

 

Veja na Listagem 14 o que acontece na janela de Output quando ocorre o Deploy. Note que são transferidos todos os arquivos e Dlls necessárias para rodar o aplicativo.

 

------ Build started: Project: tutorialPocket, Configuration: Debug Pocket PC ------

 

Preparing resources...

Updating references...

Performing main compilation...

 

Build complete -- 0 errors, 0 warnings

Building satellite assemblies...

Visual Studio is ready to deploy tutorialPocket

 

------ Deploy started: Project: tutorialPocket, Configuration: Debug Pocket PC ------

Deploying to WWE PPC 2003 SE - SDK Emulator using Emulation Transport

Connected to WWE PPC 2003 SE - SDK Emulator (Pocket PC) running on WCE420X86.

Copying files from 'C:\Projetos\WebMobile\tutorialPocket\bin\Debug' to '\Program Files\tutorialPocket'

Copying tutorialPocket.exe

Files in the package 'netcf.all.wce4.x86.cab' are more recent on the device than on the development computer. Consider upgrading to the latest version. Files affected are:

Microsoft.windowsce.forms.dll

Microsoft.visualbasic.dll

System.data.dll

System.net.irda.dll

System.xml.dll

System.windows.forms.datagrid.dll

System.windows.forms.dll

System.web.services.dll

System.drawing.dll

System.dll

Mscorlib.dll

Netcfagl1_0.dll

Cgacutil.exe

Mscoree1_0.dll

Mscoree.dll

 

---------------------- Done ----------------------

    Build: 1 succeeded, 0 failed, 0 skipped

    Deploy: 1 succeeded, 0 failed, 0 skipped

Listagem 14.

 

Cabe ressaltar que o arquivo transferido .CAB que contém o .NET CF depende do tipo de processador encontrado no Device. Neste caso é o Xscale o qual transfere o arquivo 'netcf.all.wce4.x86.cab'.

Para abrir a aplicação no Pocket, selecione o menu Windows / Programs / File Explorer / My Device / Program Files / tutorialPocket (ver Figura 27).

 

image053.png

Figura 27.

 

Quando você fechar a aplicação clicando no botão X no canto superior direito, se a propriedade minimizeBox do formulário tivesse como True, o formulário não seria fechado, apenas minimizado. Qualquer outra tentativa de deploy ocasionaria um erro no VS.NET. Nestes casos é preciso retirar o aplicativo da memória através do menu Windows / Settings / System / Memory / Runnig Programs / Aplicativo / Stop.

A outra forma de você instalar uma aplicação no Pocket é primeiro transferir e instalar o .NET CF e, em seguida, copiar a sua aplicação. Na estrutura de pastas do desktop, o .NET CF fica no endereço C:\Program Files\Microsoft Visual Studio .NET 2003\CompactFrameworkSDK\v1.0.5000\Windows CE\. Dependendo do processador do seu Pocket PC, você instala ou o wce400\armv4\netcf.all.wce4.armv4 ou o wce400\x86\netcf.all.wce4.x86. Cada arquivo está “vinculado” ao tipo de processador do fabricante do device.

A outra forma utilizada de instalação é através do menu Build / Build Cab File, o qual gera na pasta do projeto todos os arquivos necessários para instalação da aplicação em qualquer tipo de processador. Obviamente, você deixa disponível o respectivo arquivo relacionado ao processador do dispositivo o qual a aplicação irá rodar. Via de regra, se o processador for Xscale o arquivo é o SuaApp.x86, se for ARM o arquivo é SuaApp.armv4. Todos os arquivos com extensão .CAB são os arquivos que deverão ser enviados ao usuário para instalar a aplicação no Pocket. Se você estiver com o Pocket na base, copie este arquivo para o Pocket e execute-o. Automaticamente, a sua aplicação será instalada no Pocket e ficará disponível para rodar.

Conclusão

Neste primeiro tutorial você foi introduzido ao mundo móvel através de uma aplicação simples e funcional, utilizando diversos recursos do dia a dia de um desenvolvedor. Foquei nos controles, códigos, métodos e propriedades para o propósito deste projeto exemplo. No próximo tutorial iremos montar um cenário com banco de dados SQL Server, onde o acesso será através de uma rede Wi-Fi (Wireless Fidelity – sem fio).

Bons estudos e lembre-se: No Stress, think .NET!!!

 

Referências

www.microsoft.com/windowsmobile