Está en la página 1de 6

Sistemas Distribuidos II

Laboratorio Android c) Asignando el nombre de “Calculadora” a


proyecto
Android: Proyecto Calculadora

I. Competencia General:

Comprender el entorno de desarrollo de una


aplicación en Android, utilizando el lenguaje de
programación Java..

II. Requerimientos

- IDE Eclipse (Indigo)


http://developer.android.com/sdk/eclipse-
adt.html

- Android SDK (Cualquier versión) Figura 03


http://developer.android.com/sdk/index.html

- Dalvik Virtual Machine (Tiene que crearlo) d) Seleccionando el SDK versión y API
Debe indicar alguna versión de Android, por ejemplo
Debe configurar Eclipse para que supiera la ruta 4.0.3 cuyo API es versión 15
hasta el SDK de Android y tendríamos todo
preparado para trabajar. Lo podemos hacer desde el
menú Window -> Preferences y dentro de la ventana
en la pestaña Android tenemos la opción SDK
Location

III. Crear el workspace

Para empezar con un nuevo proyecto debe crear un


espacio de trabajo en eclipse:

a) Crear el espacio de trabajo

Figura 04

e) Asignando el nombre del paquete


“mi.paquete.android”
Debe colocar 2 o 3 palabras con “.” que estén
relacionados con el proyecto

Figura 01

b) Crear el proyecto Android

Figura 02

Figura 05

MSc. Daniel A. Yucra Sotomayor Pag. - 1 -


Sistemas Distribuidos II

f) Estructura del Proyecto

Figura 06

IV. Diseño del proyecto

Antes de empezar es importante discutir cómo será


la interfaz de usuario del programa.

Elementos que participan:


Figura 08
- TextView (objeto para mostrar texto),
- EditText (caja de entrada de texto) Importante debe colocar cada control en el layout
- Button (botón de comando). b) Insertando controles en el layout

1.1 Detalles del primer Control

Adicionar:
android:id="@+id/label_a"

Y modificar:
android:text="@string/Operando A" />

El primer control debe quedar como:

<TextView
android:id="@+id/label_a"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Operando A:"/>

1.2 Detalles del segundo control

<EditText
android:id="@+id/op_a"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
Figura 07
Evolus Pencil:
android:background="@android:drawable/editbo
http://pencil.evolus.vn/en-US/Home.aspx x_background"
android:layout_below="@id/label_a"/>
IV. Generando el Proyecto
a) Editando el mail.xml Complete insertando el resto de controles de
Para iniciar con el proyecto debe insertar los acuerdo al diseño
controles al layout (area de diseño de la aplicación)

MSc. Daniel A. Yucra Sotomayor Pag. - 2 -


Sistemas Distribuidos II

Figura 09

Figura 11

c) Código final en XML

<?xml version="1.0" encoding="utf-8"?>


<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="@+id/label_a"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Operando A:"/>
<EditText
android:id="@+id/op_a"
android:layout_width="fill_parent"
android:layout_height="wrap_content"

android:background="@android:drawable/editbox_background"
android:layout_below="@id/label_a"/>
Figura 10 <TextView
android:id="@+id/label_b"
android:layout_width="fill_parent"
Para el boton android:layout_height="wrap_content"
android:layout_below="@id/op_a"
<Button android:text="Operando B:"/>
android:id="@+id/sumar" <EditText
android:layout_width="wrap_content" android:id="@+id/op_b"
android:layout_height="wrap_content" android:layout_width="fill_parent"
android:layout_below="@id/op_b" android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="1dip" android:background="@android:drawable/editbox_background"
android:onClick="cSumar" android:layout_below="@id/label_b"/>
android:text="+" /> <Button
android:id="@+id/sumar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/op_b"
android:layout_alignParentLeft="true"
android:layout_marginLeft="1dip"
android:onClick="cSumar"
android:text="+" />
<Button
android:id="@+id/restar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/sumar"
android:layout_alignTop="@id/sumar"
android:onClick="cRestar"

MSc. Daniel A. Yucra Sotomayor Pag. - 3 -


Sistemas Distribuidos II

android:text="-" /> android:onClick es el nombre del método público a


<Button ejecutar al pulsar ese botón. Este método debe ser
android:id="@+id/multiplicar"
android:layout_width="wrap_content"
obligatoriamente público y tener como parámetro de
android:layout_height="wrap_content" entrada la vista, ejemplo public void function
android:layout_toRightOf="@id/restar" cSumar(View view) { ... }.
android:layout_alignTop="@id/restar"
android:onClick="cMultiplicar"
android:text="*" />
d) El diseño del layout queda al final de la
<Button siguiente manera
android:id="@+id/dividir"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/multiplicar"
android:layout_alignTop="@id/sumar"
android:onClick="cDividir"
android:text="/" />
<TextView
android:id="@+id/texto_resultado"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/dividir"
android:text="Resultado:"/>
<TextView
android:id="@+id/resultado"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/texto_resultado"
android:text="Realice operación para obtener resultado"/>
</RelativeLayout>

Variables utilizadas:
- op_a
- op_b
- sumar
- restar Figura 09
- multiplicar
- dividir
- texto_resultado e) Código para la Actividad
- resultado
Primero:
Eventos: Para empezar a programar se debe importar los
- cSumar siguiente paquetes a la clase:
- cRestar
- cMultiplicar import android.widget.*;
- cDividir import android.view.*;

Los atributos relevantes para este ejemplo de cada Segundo:


elemento son: Instanciar los objetos que va utilizar:
android:id identificador de cada objeto
private double valor_a, valor_b;
private EditText op_a, op_b;
android:layout_width y android:layout_height,
private TextView resultado;
anchura y altura respectivamente

android:layout_below: indica si el objeto está Donde:


debajo de otro op_a y op_b son las variables del formulario
valor_a y valor_b, son las variables convertidas a
android:layout_toRightOf y tipo de datos Double que participaran en la clase
android:layout_alignTop: indican si están varios Calculadora.
elementos en la misma fila sobre qué objeto se
coloca a su derecha y su posicionamiento en altura Tercero:
Asignamos Objetos:
android:text es el texto por defecto en cada
elemento this.op_a = (EditText) findViewById(R.id.op_a);
this.op_b = (EditText) findViewById(R.id.op_b);
this.resultado = (TextView) findViewById(R.id.resultado);

MSc. Daniel A. Yucra Sotomayor Pag. - 4 -


Sistemas Distribuidos II

if(this.op_a.getText().toString().length() > 0 &&


Cuarto: this.op_b.getText().toString().length() > 0) {
this.valor_a =
Creamos código para los métodos: Double.parseDouble(this.op_a.getText().toString());
this.valor_b =
public void cSumar(View view) { Double.parseDouble(this.op_b.getText().toString());

if(this.op_a.getText().toString().length() > 0 this.resultado.setText(Double.toString((this.valor_a *


&& this.op_b.getText().toString().length() > 0) { this.valor_b)));
this.valor_a = }
Double.parseDouble(this.op_a.getText().toString()); }
this.valor_b =
Double.parseDouble(this.op_b.getText().toString()); public void cDividir(View view) {
if(this.op_a.getText().toString().length() > 0 &&
this.resultado.setText(Double.toString((this.v this.op_b.getText().toString().length() > 0) {
alor_a + this.valor_b))); this.valor_a =
} Double.parseDouble(this.op_a.getText().toString());
} this.valor_b =
Double.parseDouble(this.op_b.getText().toString());
if(this.valor_b != 0) {
Finalmente el código queda de la siguiente manera:
this.resultado.setText(Double.toString((this.valor_a /
this.valor_b)));
}
package mi.paquete.android; else {
this.resultado.setText("Infinito");
import android.app.Activity;
import android.os.Bundle;
}
import android.widget.*;
}
import android.view.*;
}
}
public class CalculadoraActivity extends Activity {
/** Called when the activity is first created. */
// Instancias de objetos a usar El método onCreate se ejecuta al crear la aplicación
private double valor_a, valor_b; y es donde asignamos los objetos declarados en el
private EditText op_a, op_b;
private TextView resultado; XML a objetos Java. Tras ello declaramos las
funciones definidas en los atributos onClick de cada
public void onCreate(Bundle savedInstanceState) { botón.
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Asignamos los objetos
setContentView(R.layout.main);
this.op_a = (EditText) findViewById(R.id.op_a);
this.op_b = (EditText) findViewById(R.id.op_b);
this.resultado = (TextView)
findViewById(R.id.resultado); f) Ejecutando el programa
}

public void cSumar(View view) {


if(this.op_a.getText().toString().length() > 0 &&
this.op_b.getText().toString().length() > 0) {
this.valor_a =
Double.parseDouble(this.op_a.getText().toString());
this.valor_b =
Double.parseDouble(this.op_b.getText().toString());

this.resultado.setText(Double.toString((this.valor_a +
this.valor_b)));
}
}

public void cRestar(View view) {


if(this.op_a.getText().toString().length() > 0 &&
this.op_b.getText().toString().length() > 0) {
this.valor_a =
Double.parseDouble(this.op_a.getText().toString());
this.valor_b =
Double.parseDouble(this.op_b.getText().toString());

this.resultado.setText(Double.toString((this.valor_a -
this.valor_b)));
}
} Figura 10

public void cMultiplicar(View view) {

MSc. Daniel A. Yucra Sotomayor Pag. - 5 -


Sistemas Distribuidos II

Debe elegir el APP “Calculadora” para ejecutar el


programa

Figura 11

g) Optimizando el código

Figura 12

Seleccione Ignore type para eliminar las precauciones

Figura 12

Docente: MSc. Daniel Alejandro Yucra Sotomayor


Lima, Enero del 2012
Consultas: danielyucra@gmail.com

MSc. Daniel A. Yucra Sotomayor Pag. - 6 -