UNIVERSIDAD TECNOLÓGICA DE PANAMÁ

FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES

NOMBRE DEL DEPARTAMENTO
GUÍA DE ACTIVIDAD N° 3
LABORATORIO
FC-FISC-1-8-2016
Facilitador(a): Juan Antonio Zamora Arosemena Asignatura: Herramientas de Programación Aplicada IV
Estudiante: Bairon Santos Fecha: __________________ Grupo: 1LS132
Michael Jordan
Arundel Fabrega

A. TÍTULO DE LA EXPERIENCIA: Uso de Controles Básicos y Spinner

B. TEMAS:
a. Diseño de Layouts
i. Usando XML
ii. Programada con Java
iii. Usando el editor gráfico
b. Tipos de Layout
i. Layout Relativo
ii. Layout Linear
c. 2.2.3. Manejo de Layouts en el archivo Java
d. 2.3. UI Controles
i. Controles Comunes
ii. EditText, TextView
iii. Button, ImageButton
iv. Dialog
v. ImageViewPantalla
vi. Checkbox, RadioButton, RadioGroup
vii. Spinner
C. OBJETIVO(S): Comprender y utilizar los diferentes controles básicos que se pueden utilizar sobre una aplicación
móvil.
D. METODOLOGÍA: Siga las instrucciones dada por el profesor o los pasos que contiene esta guía.
E. PROCEDIMIENTO O ENUNCIADO DE LA EXPERIENCIA:
Cree un nuevo proyecto en Android siguiendo los pasos de la Guía de Laboratorio 1:
Recuerde que ya empezamos a utilizar los laboratorio secuencias, por lo que su archivo debe llamarse
AppLabsNApellido1_NApellido2… para el proyecto android y Lab1_NApellido1_NApellid2….rar para los
laboratorios subidos a moodle.
1. Coloque el siguiente código en el archivo .xml que se ha creado

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".SumaActivity">

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">

<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Esto es una suma de dos Valores"
android:textSize="50px"/>

<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Introduzca primer numero"
android:id="@+id/txtNum1"/>

<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Introduzca segundo numero"
android:id="@+id/txtNum2"/>

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Sumar"
android:onClick="SumarNumeros"/>

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/lblRes"
android:textSize="50px"/>

</LinearLayout>

</LinearLayout>

2. Coloque el siguiente código en el archivo .java creado

package com.example.jotaz.sumavalores;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;

public class SumaActivity extends AppCompatActivity {

//declaramos las variables de los controles que vamos a utilizar

EditText txtNum1;
EditText txtNum2;
 TextView lblResultado;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_suma);

this.InicializarControles();
}

private void InicializarControles() {

txtNum1 = (EditText)findViewById(R.id.txtNum1);
txtNum2 = (EditText)findViewById(R.id.txtNum2);

lblResultado = (TextView)findViewById(R.id.lblRes);
}

public void SumarNumeros(View view)

{
try{
int n1 = Integer.parseInt(txtNum1.getText().toString());
int n2 = Integer.parseInt(txtNum2.getText().toString());

int resultado = n1+n2;

lblResultado.setText(Integer.toString(resultado));
}
catch (Exception e)
{
Toast.makeText(this,"Error en la suma de los datos" + e.getMessage(),
Toast.LENGTH_SHORT).show();
}

}
}

3. Compile y ejecute el proyecto en su teléfono celular físico o virtual.

4. Testee el aplicativo

F. RECURSOS: Android Studio, Teléfono celular con Android (físico o virtual).

G. RESULTADOS: una vez realizado el código, responda las siguientes preguntas o realice las siguientes
actividades:
a. Modifique el código para que las operaciones se puedan realizar en base a lo seleccionado (utilice
spinner)
b. Modifique el código para que quede idéntico utilizando Relative Layout. Utilice margin y padding si es
necesario.
c. Coloque un checkbox para mostrar el resultado en un dialog.
// codigo xml

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity"

android:orientation="vertical">

<TextView

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="Super titulo de la calculadora"

android:layout_margin="15dp"

android:textSize="32dp"

android:fontFamily="sans-serif-black"/>

<EditText

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:id="@+id/txtNum1"

android:inputType="numberDecimal"

android:textSize="32dp"

android:hint="Introduzca Num1"

android:layout_margin="15dp"

android:fontFamily="sans-serif-medium"/>

<EditText
 android:layout_width="match_parent"

android:layout_height="wrap_content"

android:id="@+id/txtNum2"

android:inputType="numberDecimal"

android:textSize="32dp"

android:hint="Introduzca Num2"

android:layout_margin="12dp"

android:fontFamily="sans-serif-medium"

/>

<CheckBox

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_marginLeft="13dp"

android:layout_marginRight="45dp"

android:text="Mostar Dialog"

android:id="@+id/chkDialog"

/>

<Button

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="Calcular"

android:textSize="32dp"

android:layout_marginTop="15dp"

android:layout_marginLeft="45dp"

android:layout_marginRight="45dp"

android:backgroundTint="@color/black"

android:onClick="Calcular" />
 <TextView

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:id="@+id/lblRes"

android:text="0"

android:textSize="32dp"

android:textAlignment="center"/>

</LinearLayout>

//Codigo main java

package com.example.calculadoraxd;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

import android.view.View;

import android.widget.CheckBox;

import android.widget.EditText;

import android.widget.TextView;

import com.example.calculadoraxd.Dialog.Alerta;

public class MainActivity extends AppCompatActivity {

EditText txtNum1, txtNum2;

TextView lblRes;

CheckBox chkDialog;

@Override
protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

Inicializar_Controles();

private void Inicializar_Controles(){

txtNum1=(EditText)findViewById(R.id.txtNum1);

txtNum2=(EditText)findViewById(R.id.txtNum2);

chkDialog=(CheckBox)findViewById(R.id.chkDialog);

lblRes=(TextView) findViewById(R.id.lblRes);

public void Calcular(View v){

try {

int num1, num2, res;

num1=Integer.parseInt(txtNum1.getText().toString());

num2=Integer.parseInt(txtNum2.getText().toString());

res=num1+num2;

if(chkDialog.isChecked()){

Alerta dialog =new Alerta(Integer.toString(res));

dialog.show(getSupportFragmentManager(), "Tag");

}else{

lblRes.setText(Integer.toString(res));
 }

lblRes.setText(Integer.toString(res));

}catch (Exception e){

// Codigo Dialog java

package com.example.calculadoraxd.Dialog;
import android.app.AlertDialog;
import android.app.Dialog;
import android.content.DialogInterface;
import android.os.Bundle;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.DialogFragment;

public class Alerta extends DialogFragment {

private String res;

public Alerta(String r){
this.res=r;
}

@NonNull
@Override
public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {
AlertDialog.Builder builder=new AlertDialog.Builder(getActivity());

builder.setTitle("Resultado de la operacion")
.setMessage("El resultado es: "+res)
.setPositiveButton("Dale", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
 dialog.cancel();
}
});
return builder.create();
}
}

//Pruebas del funcionamiento

Prueba del dialog
Bitacora Bairon Santos

Temas abarcados

Creación de una pantalla para calcular con dialog

Reflexiones

En este proyecto pude ver el funcionamiento base para un dialog

1. Dificultades encontradas

ninguna

2. Soluciones establecidas

3. Aprendizaje (que conocimiento nuevo adquirido con la actividad.

Aprendí a como definir y ajustar un código dialog

Bitácora: Arundel Fabrega

Temas abarcados

Creación de una pantalla para calcular con dialog

● Dificultades encontradas

ninguna

● Soluciones establecidas

ninguna

● Aprendizaje (que conocimiento nuevo adquirido con la actividad.

Despliegue de los resultados mediante el dialog

Bitácora: Michael Jordan

Temas abarcados

Creación de una pantalla para calcular con dialog

1. Dificultades encontradas

ninguna

2. Soluciones establecida

ninguna

3. Aprendizaje (que conocimiento nuevo adquirido con la actividad.

Desplegar los datos con el codigo dialog

Taller Login
//Codigo en xml

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@drawable/logoutp"
android:layout_marginTop="20dp"
android:layout_marginLeft="150dp"
/>

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Universidad Tecnologica de panama"
android:textAlignment="center"
android:textSize="20dp"
android:textColor="@color/black"
/>

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Grupo 1LS132"
android:textAlignment="center"
android:textSize="15dp"
android:textColor="@color/black"/>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
 <ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/perfil"
android:layout_marginLeft="50dp"
/>

<EditText
android:id="@+id/txtInputUser"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="50dp"
android:hint="Usuario"/>

</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">

<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/cand"
android:layout_marginLeft="50dp" />

<EditText
android:id="@+id/txtInputPass"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="50dp"
android:hint="Contraseña"/>

</LinearLayout>

<RadioGroup
android:id="@+id/rgroup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginLeft="100dp">

<RadioButton
 android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/prof"
android:text="Profesor"
/>

<RadioButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/est"
android:text="Estudiante"
/>

</RadioGroup>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Iniciar sesion"
android:layout_marginLeft="140dp"
android:onClick="validacion"/>

</LinearLayout>

//Codigo main en java

package com.example.applabbsantos_;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;

import com.example.applabbsantos_.Dialog.Alert;

public class MainActivity extends AppCompatActivity {

EditText txtUser;
EditText txtPass;
RadioGroup rgTipo;
RadioButton est;
RadioButton prof;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
this.inicializarControles();
}
private void inicializarControles(){
txtUser = (EditText)findViewById(R.id.txtInputUser);
txtPass = (EditText) findViewById(R.id.txtInputPass);
rgTipo = (RadioGroup) findViewById(R.id.rgroup);
est = (RadioButton) findViewById(R.id.est);
prof = (RadioButton) findViewById(R.id.prof);
}

public void validacion(View view){

try {
String pass="1234";
String user="Bairon";
int Tipo;

String txtUsusario =txtUser.getText().toString();

String txtContra =txtPass.getText().toString();

if (txtUsusario.isEmpty() && txtContra.isEmpty()) {

Alert alert = new Alert("Campos vacios");
alert.show(getSupportFragmentManager(), "Rellenar");
} else {
if (user.equals(txtUsusario) && pass.equals(txtContra)) {
Tipo = rgTipo.getCheckedRadioButtonId();
if (rgTipo.isEnabled()) {
if (Tipo == est.getId()) {
Alert alert = new Alert("Registro Correcto");
alert.show(getSupportFragmentManager(), "Correcto");
} else if (Tipo == prof.getId()) {
Alert alert = new Alert("No disponible");
alert.show(getSupportFragmentManager(), "Incorrecto");
}
} else if (!rgTipo.isEnabled()){
 Alert alert = new Alert("Seleccione una opcion");
alert.show(getSupportFragmentManager(), "inseleccion");
}
}else {
Alert alert = new Alert("Usuario o Contraseña incorrecta");
alert.show(getSupportFragmentManager(), "Denegado");
}
}
}
catch (Exception e){
Toast.makeText(this, "Error"+e.getMessage(), Toast.LENGTH_SHORT).show();
}

}
}

//Codigo Dialog en java

package com.example.applabbsantos_.Dialog;

import android.app.AlertDialog;

import android.app.Dialog;

import android.content.DialogInterface;

import android.os.Bundle;

import androidx.annotation.NonNull;

import androidx.annotation.Nullable;

import androidx.fragment.app.DialogFragment;

public class Alert extends DialogFragment {

private final String val;

public Alert(String val){

 this.val=val;

@NonNull

@Override

public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

AlertDialog.Builder builder=new AlertDialog.Builder(getActivity());

builder.setMessage(val)

.setPositiveButton("close", new DialogInterface.OnClickListener() {

@Override

public void onClick(DialogInterface dialogInterface, int i) {

dialogInterface.cancel();

});

return builder.create();

}
Pantalla inicial sin ejecutar nada
Registro efectuado correctamente
Validacion de los campos vacios
Validacion de la opcion profesor
Validacion de los datos escritos
Bitacora Bairon Santos

Temas abarcados

Creación de un login validado a través de dialog

Reflexiones

En la creación del código pude verificar que algo puede llegar a ser complejo por muy sencillo
que paresca

1. Dificultades encontradas

ninguna

2. Soluciones establecidas

3. Aprendizaje.

Aprendí a manejar de mejor manera la creación de los dialog y así mismo a controlar
los botones deradio

Bitacora Michael Jordan

Temas abarcados

Creación de un login validado a través de dialog

1. Dificultades encontradas

en la organización de las interfaces

2. Soluciones establecidas

ver videos

3. Aprendizaje.

mejore la posición de las interfaces

Bitacora Arundel Fabrega

Temas abarcados

Creación de un login validado a través de dialog

1. Dificultades encontradas

En la creación del usuario y contraseña y que estos estén en el mismo segmento.

2. Soluciones establecidas

Con la ayuda del profesor y el código [android:layout_toRightOf="@+id/…..”] y ver

videos.

3. Aprendizaje.

Otras formas de colocar la posición de ciertas interfaces, ejecutar alertas con ciertas
acciones y su lógica que lleva a la hora de crearse