Atualmente, o uso de dispositivos móveis vem aumentando cada vez mais e, por isso, foi necessário criar um sistema operacional que se adapte a esta situação, então o Android entrou em cena e se popularizou rapidamente. Com isso, esses dispositivos passaram a ter como função principal não mais a realização de ligações telefônicas e sim o acesso à Internet e redes sociais. Diante disso, a programação mobile vem crescendo cada vez mais e por este motivo criei esse artigo que ensina um pouco sobre ela. Aqui foi utilizado o Android 3.1, mas o conceito se aplica em todas as versões da plataforma.
Começando, abra o Eclipse, crie um novo projeto Android, selecione a versão de sua preferência. Depois disto, iremos configurar nosso Layout da seguinte forma:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageButton
android:id="@+id/voltar"
android:layout_width="45dp"
android:layout_height="45dp"
android:src="@drawable/back" />
<ImageButton
android:id="@+id/avancar"
android:layout_width="45dp"
android:layout_height="45dp"
android:src="@drawable/front" />
<ImageButton
android:id="@+id/atualizar"
android:layout_width="45dp"
android:layout_height="45dp"
android:src="@drawable/ref" />
<EditText
android:id="@+id/url"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ems="10" />
<ImageButton
android:id="@+id/ir"
android:layout_width="45dp"
android:layout_height="45dp"
android:src="@drawable/ir" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.35"
android:orientation="vertical" >
<WebView
android:id="@+id/pagina"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</LinearLayout>
Nessa nossa interface usei o ImageButton ao invés do Button para poder adicionar imagens nos botões e torna-los mais parecidos com um navegador web.
Depois de ter feito isso, nós vamos começar a codificar nosso projeto. Acesse sua classe principal e em seguida crie variáveis do tipo ImageButton, EditText e WebView, conforme a Listagem 2, e relacione-as aos componentes que criamos na interface com o XML.
public class NavegadorwebActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ImageButton voltar = (ImageButton)findViewById(R.id.voltar);
ImageButton avancar = (ImageButton)findViewById(R.id.avancar);
ImageButton atualizar = (ImageButton)findViewById(R.id.atualizar);
ImageButton ir = (ImageButton)findViewById(R.id.ir);
final EditText url = (EditText)findViewById(R.id.url);
final WebView pagina = (WebView)findViewById(R.id.pagina);
Para que nosso Browser inicie e já carregue uma página, escreva o seguinte código:
//Habilita o JavaScript nas paginas web
pagina.getSettings().setJavaScriptEnabled(true);
//Habilita o zoom nas páginas
pagina.getSettings().setSupportZoom(true);
//Joga uma uma url no EditText
url.setText("http://www.google.com");
//fará o browser carregar a pagina de acordo com o Texto no EditText
pagina.loadUrl(url.getText().toString());
Bom, até o momento nosso Browser irá iniciar e carregar a URL do Google, mas precisamos definir os eventos para os ImageButtons para que possamos manipular nossa navegação. Vamos criar primeiramente para o ImageButton voltar. O código ficaria assim:
voltar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//verifica se é possivel voltar e se possivel ele irá
redirecionar o Browser a pagina anterior
if(pagina.canGoBack()){
pagina.goBack();
}
}
});
O mesmo procedimento é aplicado para o ImageButton Avançar:
avancar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//Verifica se é possível avançar. Em caso positivo, irá redirecionar o Browser para a página posterior
if (pagina.canGoForward()){
pagina.goForward();
}
}
});
O código logo abaixo irá atualizar a pagina atual:
atualizar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//Recarrega a página
pagina.reload();
}
});
Por ultimo, e mais importante, temos o evento do ImageButton Ir. É ele que irá acionar o carregamento das paginas de acordo com o endereço digitado no EditText.
ir.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//carrega o brownser de acordo com a url digitada no EditText
pagina.loadUrl(url.getText().toString());
}
});
Ainda não terminamos, há algo de extrema importância que garante o funcionamento do nosso navegador e garante que ele acesse a internet. É preciso adicionar permissão de acesso à internet. No arquivo AndroidManifest.xml, insira a seguinte linha:
<uses-permission android:name="android.permission.INTERNET"/>
E com isso finalizamos nossa aplicação. Basta executar o projeto e vê-lo funcionar.