Desenvolvendo um aplicativo de bate-papo para iPhone do zero

Crie um aplicativo legal para iPhone e sua parte de servidor correspondente

Neste artigo, acompanhe o processo inteiro de criação de um aplicativo de bate-papo para iPhone, do servidor até a interface com o usuário no front end.

Jack D. Herrington, Senior Software Engineer, Leverage Software Inc.

Photo of Jack HerringtonJack Herrington é engenheiro, autor e apresentador que mora e trabalha em Bay Area. É possível se manter atualizado em relação ao seu trabalho e aos seus escritos em http://jackherrington.com.



26/Jan/2011

Criando a arquitetura de um aplicativo de bate-papo para iPhone

Acrônimos usados frequentemente

  • DOM: Modelo de Objeto de Documento
  • IDE: ambiente de desenvolvimento integrado
  • SAX: API simples para XML
  • SQL: Linguagem de Consulta Estruturada
  • UI: interface com o usuário
  • W3C: World Wide Web Consortium
  • XIB: Xml Interface Builder
  • XML: Linguagem de Marcação Extensível

Com uma base instalada de 40 milhões de iPhones, é preciso ser louco para não querer criar um aplicativo para iOS. Mas por onde começar? A maioria dos aplicativos será conectada em rede. Então que tal um projeto que abrange ambos, como um aplicativo de bate-papo? Neste artigo, mostrarei como desenvolver um aplicativo de bate-papo, com componentes de servidor e de cliente. Você pode aprender tanto sobre a criação de aplicativos para iOS com esse artigo, que eu garanto que, ao final, você irá querer criar seu próprio aplicativo.

O desenvolvimento do aplicativo começa com a arquitetura da solução. Figura 1 mostra a arquitetura de como o dispositivo iOS (o iPhone, neste caso) conecta com o servidor por meio de duas páginas de PHP.

Figura 1. A arquitetura cliente/servidor do aplicativo de bate-papo
A arquitetura cliente/servidor do aplicativo de bate-papo


Essas duas páginas de PHP, add.php e messages.php, conectam-se ambas ao banco de dados para publicar e recuperar as mensagens, respectivamente. No código que forneço, o banco de dados é MySQL, mas é possível usar DB2 ou qualquer outro banco de dados que você desejar.

O protocolo que uso é XML. A página add.php retorna uma mensagem XML que diz se a publicação da mensagem teve êxito. E a página messages.php retorna as mensagens mais recentes publicadas no servidor.

Antes de começar, quero relacionar os itens que você irá aprender aqui.

  • Acesso ao banco de dados. Eu mostro como usar PHP para incluir linhas no banco de dados e recuperá-las.
  • Codificação XML. O código do servidor demonstra como empacotar as mensagens em XML.
  • Desenvolvendo uma interface de iOS. Examino o desenvolvimento da interface com o usuário do aplicativo.
  • Consultando o servidor. O código Objective-C faz solicitações GET à página messages.php para obter as mensagens de bate-papo mais recentes.
  • Analisando o XML. Usando o analisador de XML disponível para desenvolvedores do iOS, é possível analisar o XML retornado por messages.php.
  • Exibindo as mensagens. O aplicativo usa uma lista customizada para exibir as mensagens de bate-papo. Essa abordagem pode oferecer insights sobre como customizar a aparência de seu aplicativo para iOS.
  • Publicando uma mensagem. O aplicativo realiza postagens de dados para o servidor por meio de add.php, que guia você pelo processo.
  • Timers. Uma tarefa de timer é usada para consultar periodicamente messages.php a fim de ver quando novos itens de bate-papo chegam.

É bastante para um único exemplo, e deve fornecer um conjunto adequado de ferramentas para você desenvolver qualquer tipo de aplicativo cliente/servidor para iOS que desejar criar.


Desenvolvendo o servidor

O primeiro passo é criar o banco de dados. Eu batizei o meu de "chat", mas você pode dar o nome que quiser ao seu. Basta apenas alterar as cadeias de caractere de conexão no PHP para corresponder ao nome do banco de dados. O script SQL usado para criar uma única tabela para o aplicativo está na Lista 1.

Lista 1. chat.sql
 DROP TABLE IF EXISTS
                chatitems; CREATE TABLE chatitems ( id BIGINT NOT NULL PRIMARY
                KEY auto_increment, added TIMESTAMP NOT NULL, user VARCHAR(64)
                NOT NULL, message VARCHAR(255) NOT NULL );

Esse simples banco de dados com uma única tabela tem apenas quatro campos:

  • O ID da linha, que é apenas um número inteiro que se incrementa
  • A data na qual a mensagem foi incluída
  • O usuário que incluiu a mensagem
  • O texto da mensagem

É possível alterar os tamanhos desses campos para acomodar o conteúdo.

Em um sistema de produção, seria adequado também ter uma tabela de usuário com nomes e senhas e ter uma interface com o usuário para login, e assim por diante. Para este exemplo, eu quis manter o banco de dados simples, por isso há apenas uma tabela única.

A primeira coisa que se deve desenvolver é o script add.php na Lista 2.

Lista 2. add.php
 <?php header(
                'Content-type: text/xml' ); mysql_connect(
                'localhost:/tmp/mysql.sock', 'root', '' ); mysql_select_db(
                'chat' ); mysql_query( "INSERT INTO chatitems VALUES ( null,
                null, '". mysql_real_escape_string( $_REQUEST['user'] ). "', '".
                mysql_real_escape_string( $_REQUEST['message'] ). "')" );
                ?> <success />

Esse script conecta-se ao banco de dados e armazena a mensagem usando os campos user e message publicados. É uma instrução INSERT simples, na qual dois valores são caracteres de escape para lidar com qualquer caractere errante, tais como aspas simples que possam perturbar a sintaxe do SQL.

Para testar o script add, crie uma página test.html, como mostra a Lista 3, que apenas publica campos no script add.php.

Lista 3. test.html
 <html>
                <head> <title>Chat Message Test
                Form</title> </head>
                <body> <form action="add.php"
                method="POST"> User: <input name="user"
                /><br /> Message: <input
                name="message" /><br /> <input
                type="submit" /> </form>
                </body> </html>

Essa página simples tem apenas um formulário que aponta para add.php, com dois campos de texto para o usuário e a mensagem. Tem o botão Submit que executa a publicação.

Com a página test.html instalada, é possível testar o script add.php. Ao abrir a página de teste no navegador, ela será semelhante à Figura 2, com o valor de "jack" no campo User, o valor de "This is a test" no campo Message e o botão Submit Query.

Figura 2. A página de teste de publicação da mensagem
A página de teste de publicação da mensagem

Aqui, o usuário inclui alguns valores e clica no botão Submit Query. Se tudo funcionar, você verá algo como a Figura 3.

Figura 3. Uma publicação de mensagem com êxito
Uma publicação de mensagem com êxito

Caso contrário, provavelmente você receberá um rastreamento de pilha de PHP, informando que a conexão com o banco de dados falhou ou que a instrução INSERT não funcionou.

Com o script de inclusão de mensagem funcionando, é hora de desenvolver o script messages.php, que retorna a lista de mensagens. Esse script é mostrado na Lista 4.

Lista 4. messages.php
 <?php header(
                'Content-type: text/xml' ); mysql_connect(
                'localhost:/tmp/mysql.sock', 'root', '' ); mysql_select_db(
                'chat' ); if ( $_REQUEST['past'] ) { $result =
                mysql_query('SELECT * FROM chatitems WHERE id > '.
                mysql_real_escape_string( $_REQUEST['past'] ). ' ORDER BY added
                LIMIT 50'); } else { $result = mysql_query('SELECT * FROM
                chatitems ORDER BY added LIMIT 50' ); } ?>
                <chat> <?php while ($row =
                mysql_fetch_assoc($result)) { ?> <message
                added="<?php echo( $row['added'] ) ?>"
                id="<?php echo( $row['id'] ) ?>">
                <user><?php echo( htmlentities(
                $row['user'] ) ) ?></user>
                <text><?php echo( htmlentities(
                $row['message'] ) ) ?></text>
                </message> <?php }
                mysql_free_result($result); ?> </chat>

Esse script é um pouco mais complicado. A primeira coisa que ele faz é montar a consulta. Há duas possibilidades aqui:

  • Se um parâmetro past tiver sido fornecido, o script retorna apenas mensagens após o ID especificado.
  • Se não tiverem sido especificados parâmetros past, todas as mensagens são retornadas.

O motivo do parâmetro past é que você quer que os clientes sejam inteligentes. Você quer que o cliente se lembre de quais mensagens ele já viu e peça apenas aquelas mensagens que vem depois das que ele já viu. A lógica do cliente é simples o suficiente: ele mantém o ID de valor mais alto que encontra e envia isso como o parâmetro past. No início, ele pode enviar 0 como o valor, o que é o mesmo que não especificar nada.

A segunda metade do script recupera os registros do conjunto de resultados da consulta e os codifica em XML. Se essa parte do script funcionar, você verá algo semelhante à Figura 4 ao acessar a página no navegador de sua escolha.

Figura 4. A lista de mensagens de bate-papo
A lista de mensagens de bate-papo

Isso é tudo que você precisa para o servidor. Obviamente, é possível incluir qualquer lógica desejada, canais adicionais, validação de usuário e login, etc. Para o propósito deste aplicativo de bate-papo experimental, esse script funciona bem. Agora você pode desenvolver o aplicativo para iOS que irá usar este servidor.


Desenvolvendo o cliente

O IDE do iOS chama-se XCode. Se você não o tem, precisa fazer o download no site do Desenvolvedor Apple (consulte Recursos). A versão de produção mais recente é XCode 3, e é o que eu uso para as capturas de tela aqui. Há uma versão mais recente chamada XCode 4, que integra o editor de Interface com o Usuário no IDE, mas essa versão ainda está em modo de visualização no momento.

Com o XCode instalado, é hora de desenvolver o aplicativo usando o assistente New Project, como mostra a Figura 5.

Figura 5. Desenvolvendo um aplicativo para iPhone baseado em visualização
Desenvolvendo um aplicativo para iPhone baseado em visualização

O tipo de aplicativo mais fácil para começar é o aplicativo baseado em visualização. Esse tipo permite colocar controles onde você desejar e deixa a maior parte do design da UI para você. Após selecionar os controles, selecione iPhone ou iPad. Essa escolha está relacionada com o dispositivo que você deseja simular. É possível escrever o código de modo que funcione no iPhone ou iPad, ou qualquer outro "iDispositivo" que a Apple invente depois.

Após clicar em Choose, será solicitado a você um nome para o aplicativo. Eu batizei a minha de "iOSChatClient", mas você pode dar o nome que quiser. Após dar um nome, o IDE XCode constrói os arquivos de aplicativo essenciais. A partir daqui, compile uma vez e o inicie para verificar que tudo está funcionando.

Criando a interface com o usuário

Após criar o aplicativo, é possível desenvolver a interface. O ponto para começar é o arquivo XIB de controlador, que está localizado na pasta Resources. Ao clicar duas vezes nessa pasta, acessa-se o Interface Builder, que é o conjunto de ferramentas de UI.

Figura 6. O layout da interface
O layout da interface

Figura 6 mostra como eu configurei os três controles. Na parte superior, há uma caixa para inserir a mensagem que você deseja enviar. À direita dessa caixa de texto, está o botão Send. E abaixo disso, há um objeto UITableView que mostra todos os itens de bate-papo.

Eu poderia entrar em detalhes sobre como configurar tudo isso no Interface Builder, mas eu recomendo que você faça download do código de projeto e brinque com ele. Você pode usar o projeto como um modelo para seu próprio aplicativo.

Criando o controlador de visualização

A interface com o usuário é basicamente isso. A próxima tarefa é voltar para o IDE XCode e incluir algumas variáveis, propriedades e métodos à definição da classe do controlador de visualização, como na Lista 5.

Lista 5. iOSChatClientViewController.h
                #import <UIKit/UIKit.h> @interface
                iOSChatClientViewController : UIViewController
                <UITableViewDataSource,UITableViewDelegate> {
                IBOutlet UITextField *messageText; IBOutlet UIButton
                *sendButton; IBOutlet UITableView *messageList; NSMutableData
                *receivedData; NSMutableArray *messages; int lastId; NSTimer
                *timer; NSXMLParser *chatParser; NSString *msgAdded;
                NSMutableString *msgUser; NSMutableString *msgText; int msgId;
                Boolean inText; Boolean inUser; } @property (nonatomic,retain)
                UITextField *messageText; @property (nonatomic,retain) UIButton
                *sendButton; @property (nonatomic,retain) UITableView
                *messageList; - (IBAction)sendClicked:(id)sender; @end

A partir da parte superior, eu incluí UITableViewDataSource e UITableViewDelegate à definição da classe. Esse código é usado para conduzir a exibição de mensagens. Há métodos na classe que são chamados de volta para alimentar os dados e informações de layout na visualização da tabela.

As variáveis de instância são divididas em cinco grupos. Na parte superior estão referências de objeto a vários elementos de UI, o campo de texto para a mensagem a ser enviada, o botão de enviar e a lista de mensagens.

Abaixo estão o buffer para conter o XML retornado, a lista de mensagens e o último ID visto. Esse lastID começa em zero, mas é definido com o valor de ID máximo que você vê para qualquer mensagem. Em seguida, é enviado de volta para o servidor como o valor do parâmetro past.

O timer é o que é acionado em certo intervalo de segundos para procurar por novas mensagens do servidor. E a última seção contém todas as variáveis de membro necessárias para analisar o XML. Há várias delas porque o analisador de XML é baseado em retorno de chamada, o que significa que ele contém muito estado na classe.

Abaixo das variáveis de membro estão as propriedades e o manipulador de cliques. Eles são usados pelo Interface Builder para ligar os elementos da interface a esta classe de controlador. Aliás, com tudo isso no controlador de visualização, seria bom voltar agora ao Interface Builder e usar os controles de conector para conectar o texto da mensagem, botão de envio e mensagem de lista a suas propriedades correspondentes, e conectar o eventoTouch Inside ao método sendClicked.

Desenvolvendo o código do controlador da visualização

Após cuidar do cabeçalho do controlador da visualização, você está pronto para o filé do projeto e para implementar o controlador da visualização. Eu divido isso em várias listagens, embora seja um só arquivo, para poder explicar cada seção em mais detalhes.

A primeira seção, Lista 6, aborda a inicialização do aplicativo e a inicialização do controlador da visualização.

Lista 6. iOSChatClientViewController.m – Inicializando
 #import
                "iOSChatClientViewController.h" @implementation
                iOSChatClientViewController @synthesize messageText, sendButton,
                messageList; - (id)initWithNibName:(NSString *)nibNameOrNil
                bundle:(NSBundle *)nibBundleOrNil { if ((self = [super
                initWithNibName:nibNameOrNil bundle:nibBundleOrNil])) { lastId =
                0; chatParser = NULL; } return self; } -
                (BOOL)shouldAutorotateToInterfaceOrientation:
                (UIInterfaceOrientation)interfaceOrientation { return YES; } -
                (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning];
                } - (void)viewDidUnload { } - (void)dealloc { [super dealloc]; }

Trata-se de um código de iOS padrão. Há alguns retornos de chamada para eventos variáveis do sistema, como avisos de memória e desalocação. Em um aplicativo de produção, deve-se lidar com todos esses itens com elegância, mas, para o propósito deste aplicativo de exemplo, não quis complicar demais as coisas.

A primeira tarefa real vem com a criação da solicitação GET para o script messages.php.Lista 7 mostra o código para isso.

Lista 7. iOSChatClientViewController.m – Obtendo as mensagens
 - (void)getNewMessages { NSString *url =
                [NSString stringWithFormat:
                @"http://localhost/chat/messages.php?past=%ld&t=%ld",
                lastId, time(0) ]; NSMutableURLRequest *request =
                [[[NSMutableURLRequest alloc] init] autorelease]; [request
                setURL:[NSURL URLWithString:url]]; [request
                setHTTPMethod:@"GET"]; NSURLConnection *conn=[[NSURLConnection
                alloc] initWithRequest:request delegate:self]; if (conn) {
                receivedData = [[NSMutableData data] retain]; } else { } } -
                (void)connection:(NSURLConnection *)connection
                didReceiveResponse:(NSURLResponse *)response { [receivedData
                setLength:0]; } - (void)connection:(NSURLConnection *)connection
                didReceiveData:(NSData *)data { [receivedData appendData:data];
                } - (void)connectionDidFinishLoading:(NSURLConnection
                *)connection { if (chatParser) [chatParser release]; if (
                messages == nil ) messages = [[NSMutableArray alloc] init];
                chatParser = [[NSXMLParser alloc] initWithData:receivedData];
                [chatParser setDelegate:self]; [chatParser parse]; [receivedData
                release]; [messageList reloadData]; NSInvocation *invocation =
                [NSInvocation invocationWithMethodSignature: [self
                methodSignatureForSelector: @selector(timerCallback)]];
                [invocation setTarget:self]; [invocation
                setSelector:@selector(timerCallback)]; timer = [NSTimer
                scheduledTimerWithTimeInterval:5.0 invocation:invocation
                repeats:NO]; } - (void)timerCallback { [timer release]; [self
                getNewMessages]; }

O código começa com o método getNewMessages. Esse método cria uma solicitação e a inicia desenvolvendo um NSURLConnection. Ele também cria o buffer de dados que contém os dados de resposta. Os três manipuladores de evento, didReceieveResponse, didReceiveData, e connectionDidFinishLoading, lidam com todas as fases do carregamento dos dados.

O método connectionDidFinishLoading é o mais importante, pois inicia o analisador de XML que lê os dados e escolhe as mensagens.

O método final aqui, timerCallback, é usado pelo timer para iniciar a solicitação de uma nova mensagem. Quando o timer é disparado, o método getNewMessages é chamado, o que inicia o processo novamente, culminando na criação de um novo timer que, ao terminar, inicia o processo de recuperação de mensagens novamente, e assim por diante.

A próxima seção, Lista 8, aborda a análise do XML.

Lista 8. iOSChatClientViewController.m – Analisando as mensagens
 - (void)parser:(NSXMLParser *)parser
                didStartElement:(NSString *)elementName namespaceURI:(NSString
                *)namespaceURI qualifiedName:(NSString *)qName
                attributes:(NSDictionary *)attributeDict { if ( [elementName
                isEqualToString:@"message"] ) { msgAdded = [[attributeDict
                objectForKey:@"added"] retain]; msgId = [[attributeDict
                objectForKey:@"id"] intValue]; msgUser = [[NSMutableString
                alloc] init]; msgText = [[NSMutableString alloc] init]; inUser =
                NO; inText = NO; } if ( [elementName isEqualToString:@"user"] )
                { inUser = YES; } if ( [elementName isEqualToString:@"text"] ) {
                inText = YES; } } - (void)parser:(NSXMLParser *)parser
                foundCharacters:(NSString *)string { if ( inUser ) { [msgUser
                appendString:string]; } if ( inText ) { [msgText
                appendString:string]; } } - (void)parser:(NSXMLParser *)parser
                didEndElement:(NSString *)elementName namespaceURI:(NSString
                *)namespaceURI qualifiedName:(NSString *)qName { if (
                [elementName isEqualToString:@"message"] ) { [messages
                addObject:[NSDictionary dictionaryWithObjectsAndKeys:msgAdded,
                @"added",msgUser,@"user",msgText,@"text",nil]]; lastId = msgId;
                [msgAdded release]; [msgUser release]; [msgText release]; } if (
                [elementName isEqualToString:@"user"] ) { inUser = NO; } if (
                [elementName isEqualToString:@"text"] ) { inText = NO; } }

Esse analisador de XML deve ser familiar a qualquer um que conheça análise SAX. Ele recebe XML e retorna quando tags são abertas ou fechadas, quando texto é encontrado, etc. É um analisador baseado em evento, e não em DOM. Uma vantagem dos analisadores de evento é que têm uma área de cobertura de memória leve. Mas uma desvantagem é que são um pouco mais difíceis de usar, pois todo o estado precisa ser armazenado no objeto host durante a análise.

O processo começa com todas as variáveis de membro, tais como msgAdded, msgUser, inUser e inText inicializadas com uma cadeia de caracteres vazia ou como falsas. Em seguida, à medida que cada uma das tags é iniciada no método didStartElement, o código examina o nome da tag e configura a variável booleana apropriada inUser ou inText. A partir daí, o método foundCharacters lida com a adição de dados de texto à cadeia de caracteres apropriada. Em seguida, o método didEndElement cuida do fechamento da tag adicionando a mensagem analisada à lista de mensagens quando o fim da tag <message> é encontrado.

Agora é necessário um código para exibir as mensagens. Isso é mostrado na Lista 9.

Lista 9. iOSChatClientViewController.m – Exibindo as mensagens
 -
                (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
                { return 1; } - (NSInteger)tableView:(UITableView *)myTableView
                numberOfRowsInSection: (NSInteger)section { return ( messages ==
                nil ) ? 0 : [messages count]; } -
                (CGFloat)tableView:(UITableView *)tableView
                heightForRowAtIndexPath: (NSIndexPath *)indexPath { return 75; }
                - (UITableViewCell *)tableView:(UITableView *)myTableView
                cellForRowAtIndexPath:(NSIndexPath *)indexPath { UITableViewCell
                *cell = (UITableViewCell *)[self.messageList
                dequeueReusableCellWithIdentifier:@"ChatListItem"]; if (cell ==
                nil) { NSArray *nib = [[NSBundle mainBundle]
                loadNibNamed:@"ChatListItem" owner:self options:nil]; cell =
                (UITableViewCell *)[nib objectAtIndex:0]; } NSDictionary
                *itemAtIndex = (NSDictionary *)[messages
                objectAtIndex:indexPath.row]; UILabel *textLabel = (UILabel
                *)[cell viewWithTag:1]; textLabel.text = [itemAtIndex
                objectForKey:@"text"]; UILabel *userLabel = (UILabel *)[cell
                viewWithTag:2]; userLabel.text = [itemAtIndex
                objectForKey:@"user"]; return cell; }

Esses são todos os métodos definido nas interfaces UITableViewDataSource e UITableViewDelegate. O mais importante é o método cellForRowAtIndexPath, que cria uma UI customizada para o item da lista e configura seus campos de texto para o texto apropriado para a mensagem.

Esse item de lista customizada é definido em um novo arquivo de ChatListItem.xib, que deve ser criado na pasta Resources. Nesse arquivo, cria-se um novo item UITableViewCell que tem dois rótulos, marcados como 1 e 2. Esse arquivo, assim como todo o restante do código, está disponível no projeto para download (consulte Download).

O código no método cellForRowAtIndexPath aloca uma dessas células ChatListItem e configura o campo de texto dos rótulos para os valores de texto e usuário que encontramos para aquela mensagem.

Sei que é muito para digerir, mas estamos quase no fim. Você já tem o código para iniciar a visualização, obter o XML da mensagem, analisá-lo e exibir as mensagens. Falta apenas escrever o código que envia a mensagem.

A primeira parte do desenvolvimento do código é gerar uma configuração para o nome de usuário. Aplicativos do iOS podem definir configurações customizadas que são colocadas no painel de controle Settings. Para criar uma configuração, é necessário usar o assistente New File para gerar um pacote configurável na pasta Resources. Em seguida, você faz exclusões até ficar uma só configuração, usando o editor de configurações na Figura 7.

Figura 7. Definindo as configurações
Definindo as configurações

Em seguida, defina que a configuração deve se chamar User e ter a chave user_preference. A partir daí, é possível usar essa preferência para obter o nome de usuário da mensagem enviando o código na Lista 10.

Lista 10. iOSChatClientViewController.m – Enviando a mensagem
 - (IBAction)sendClicked:(id)sender {
                [messageText resignFirstResponder]; if ( [messageText.text
                length] > 0 ) { NSUserDefaults *defaults =
                [NSUserDefaults standardUserDefaults]; NSString *url = [NSString
                stringWithFormat: @"http://localhost/chat/add.php"];
                NSMutableURLRequest *request = [[[NSMutableURLRequest alloc]
                init] autorelease]; [request setURL:[NSURL URLWithString:url]];
                [request setHTTPMethod:@"POST"]; NSMutableData *body =
                [NSMutableData data]; [body appendData:[[NSString
                stringWithFormat:@"user=%@&message=%@", [defaults
                stringForKey:@"user_preference"], messageText.text]
                dataUsingEncoding:NSUTF8StringEncoding]]; [request
                setHTTPBody:body]; NSHTTPURLResponse *response = nil; NSError
                *error = [[[NSError alloc] init] autorelease]; [NSURLConnection
                sendSynchronousRequest:request
                returningResponse:&response error:&error]; [self
                getNewMessages]; } messageText.text = @""; } - (void)viewDidLoad
                { [super viewDidLoad]; messageList.dataSource = self;
                messageList.delegate = self; [self getNewMessages]; } @end

Esse é o código do manipulador de clique para o botão Send Message. Ele cria um NSMutableURLRequest que tem a URL do script add.php. Em seguida, configura o corpo da mensagem para uma cadeia de caracteres que tem os dados de usuário e mensagem codificados em um formato POST. Depois, ele usa um NSURLConnection para enviar de forma síncrona os dados da mensagem para o servidor e inicia a recuperação da mensagem usando getNewMessages.

O método viewDidLoad na parte inferior desse arquivo é o que é chamado quando a visualização é carregada. Ele inicia o processo de recuperação da mensagem e conecta a lista de mensagem com esse objeto, de modo que a lista sabe onde obter seus dados.

Com todo esse código, é hora de testar o aplicativo. Isso começa com a configuração do nome do usuário na página Settings na Figura 8.

Figura 8. A página Settings
A página Settings

A partir daqui, você clica no aplicativo iOSChatClient e a página de configuração na Figura 9 é exibida.

Figura 9. Configurando o nome do usuário
Configurando o nome do usuário

Em seguida, você retorna para o aplicativo, como faria no telefone, e digita uma mensagem usando o teclado, como na Figura 10.

Figura 10. Digitando uma nova mensagem
Digitando uma nova mensagem

Em seguida, ao pressionar o botão de envio, nós vemos que a mensagem foi para o servidor, foi publicada e foi retornada de messages.php como se pode ver na Figura 11.

Figura 11. O aplicativo de bate-papo concluído
O aplicativo de bate-papo concluído

Você pode observar no código que não há conexão direta entre o botão de envio e a lista de mensagens. Portanto, a única maneira de a mensagem entrar na lista é o servidor inserir com êxito os dados no banco de dados. Em seguida, o código de message.php retorna com sucesso a mensagem para exibição na lista de mensagens.


Conclusões

É certamente muito para digerir, mas você aprendeu muito neste artigo. Você fez trabalho de banco de dados com XML no backend. Desenvolveu um aplicativo do iOS com uma interface customizada com o usuário que envia e recupera dados de um servidor. Usou o analisador de XML para destrinchar a resposta de XML do servidor. E desenvolveu uma UI customizada para a lista, para tornar as mensagens bonitas.

Seu próximo passo depende de você. A Apple lhe forneceu as ferramentas para implementar qualquer visão que queira no iPhone ou iPad. E este artigo lhe forneceu um roteiro para desenvolver seu próprio aplicativo habilitado para rede. Eu convido você a fazer uma tentativa. Se você desenvolver algo legal, me informe e eu irei conferir na App Store.


Download

DescriçãoNomeTamanho
Source code for articleChatProject.zip29KB

Recursos

Aprender

Obter produtos e tecnologias

Discutir

Comentários

developerWorks: Conecte-se

Los campos obligatorios están marcados con un asterisco (*).


Precisa de um ID IBM?
Esqueceu seu ID IBM?


Esqueceu sua senha?
Alterar sua senha

Ao clicar em Enviar, você concorda com os termos e condições do developerWorks.

 


A primeira vez que acessar o developerWorks, um perfil será criado para você. Informações do seu perfil (tais como: nome, país / região, e empresa) estarão disponíveis ao público, que poderá acompanhar qualquer conteúdo que você publicar. Seu perfil no developerWorks pode ser atualizado a qualquer momento.

Todas as informações enviadas são seguras.

Elija su nombre para mostrar



Ao se conectar ao developerWorks pela primeira vez, é criado um perfil para você e é necessário selecionar um nome de exibição. O nome de exibição acompanhará o conteúdo que você postar no developerWorks.

Escolha um nome de exibição de 3 - 31 caracteres. Seu nome de exibição deve ser exclusivo na comunidade do developerWorks e não deve ser o seu endereço de email por motivo de privacidade.

Los campos obligatorios están marcados con un asterisco (*).

(Escolha um nome de exibição de 3 - 31 caracteres.)

Ao clicar em Enviar, você concorda com os termos e condições do developerWorks.

 


Todas as informações enviadas são seguras.


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=80
Zone=Software livre
ArticleID=619792
ArticleTitle=Desenvolvendo um aplicativo de bate-papo para iPhone do zero
publish-date=01262011