2. INDICE
1.- Hola Mundo …………………………………………………02 y 03
2.-Lista de invitados …………………………………………………..04
3.-Lista de invitados (Pantalla verde) …………………………05
4.-Lista de invitados (Pantalla colores) ..…………………….06
5.-Imagen y texto………………………….……………………………07
6.-imagen y texto pantalla completa ..……………………….08
7.-imagen con margen……………………………………………….09
8.- Distribucion de texto 1…………………………………….…….10
9.- Distribucion de texto 2………………………….…………11y12
3. Practica: HOLA MUNDO
Objetivo: Realizar un App, que contenga 2 objtos un botón(button) y un texto(textiew)
Archivo MainActivity.java
public classMainActivity extends AppCompatActivity {
Button bn_presiona;//aquí vamos a declarar una variabletipo Button llamada bn_presiona
TextView texto; //aquí vamos a declarar una variabletipo TextView llamada texto
String mensaje="Soy del cuatro J";//aquí vamos a darleun valor tipo String a nuestra variabletexto
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);//aqui llamaremos a la partede diseño
bn_presiona = (Button) findViewById(R.id.bn_aceptar);//aquí llamaremos al id button de la partede diseño
texto = (TextView) findViewById(R.id.tw_mensaje); );//aquí llamaremos al id button de la parte de diseño
bn_presiona.setOnClickListener(new View.OnClickListener() {//aqui da la orden que si el botón es clickeado va mostrar lo
siguiente
@Override
public void onClick(Viewv) {
texto.setText(mensaje);
}
});
}
}
Archivo: activity_main.xml
PARTE DISEÑO (text)
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayoutxmlns: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"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
tools:context=".MainActivity">
<TextView//Es un atributo que se utiliza paraponer un texto
android:id="@+id/tw_mensaje"//aqui pondremo el id que lepondremos a este textview
android:layout_width="wrap_content"//aquí es parte de la anchura aquí decidiremos queparámetro vamos a usar
como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="wrap_content"//aquí es parte de la altura aquí decidiremos queparámetro vamos a usar como
aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_marginEnd="124dp"//aqui pondremos un margen en la parte de abajo junto a su tamaño
android:layout_marginRight="124dp"//aqui pondremos un margen en la partede arriba junto a su tamaño
android:text="Soy Neli"//aqui pondremos el texto que quieres que aparezca en el TextView
android:textSize="30sp"//aqui estara el tamaño de la letra del texto que estará en el TextView
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"//aqui se pondran las anclas donde estara el TextView
app:layout_constraintLeft_toLeftOf="parent""//aqui se pondranlasanclasdonde estara el TextView
app:layout_constraintTop_toTopOf="parent""//aqui se pondranlas anclas donde estara el TextView
app:layout_constraintVertical_bias="0.227"/>//aqui pondremos la orientación del TextView
<Button Es un atributo que se utiliza para poner un boton
android:id="@+id/bn_aceptar""//aqui pondremo el id que le pondremos a este Button
android:layout_width="wrap_content""//aquí es parte de la anchura aquí decidiremos queparámetro vamos a usar
como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="wrap_content""aquí es parte de la altura aquí decidiremos queparámetro vamos a usar como
aquí utilizamos el wrap content para poner el tamaño real en si
4. android:text="Aceptar""//aqui pondremos el texto que quieres que aparezca en el Button
tools:layout_editor_absoluteX="175dp"//aqui es el ancho del tamaño del Button
tools:layout_editor_absoluteY="350dp" />"//aqui es el alto del tamaño del Button
</android.support.constraint.ConstraintLayout>
PARTE DISEÑO (Desing)
Primero agregamos un textView en nustro apartado de atributos y le agregamos el id tw_mensaje
Segundo ponemos un Button con el id bn_aceptar
Concluciones
5. Practica: Lista de invitados
Objetivo: Realizar un App, que contenga 4objetos de textview con los siguientes nombres y con uno que abarque
toda la pantalla
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:orientation="vertical"//aqui sepondrá la orientación en la que se presentara la app
android:background="@android:color/darker_gray">//aquí estamos poniendo el fondo que tendrá nuetra apk
<TextView
android:text="Lista de Invitados""//aqui pondremos el texto que quieres que aparezca en el TextView
android:layout_width="wrap_content"""//aquí es parte de la anchura aquí decidiremos que parámetro vamos a usar
como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="wrap_content"""//aquí es parte de la altura aquí decidiremos queparámetro vamos a usar
como aquí utilizamos el wrap content para poner el tamaño real en si
android:background="#4CAF50"//aqui ponemos el fondo de color de nuestro TextView
android:textSize="24sp" />"//aqui estara el tamaño de la letra del texto que estará en el TextView
<TextView
android:text="Oswaldo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#4CAF50"
android:textSize="24sp" />
<TextView
android:text="Axel"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:background="#4CAF50"
android:textSize="24sp" />
<TextView
android:text="Elian"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#4CAF50"
android:textSize="24sp" />
</LinearLayout>
Desing
1. Agregamos 4 textview
2. Al primero lepondremos Lista de invitados
3. Al segundo le pondremos Oswaldo
4. Al tercero Axel
5. Al quinto Elian
6. Practica: Lista de invitados (Pantalla verde)
Objetivo: Realizar un App, que contenga 4objetos de textview con los siguientes nombres y dividirlos en cuatro
partes iguales con un fondo verde
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:orientation="vertical"//aqui sepondrá la orientación en la que se presentara la app
android:background="@android:color/darker_gray">//aquí estamos poniendo el fondo que tendrá nuetra apk
<TextView//aquí esta el objeto llamado texto
android:text="Lista de Invitados""//aqui pondremos el texto que quieres que aparezca en el TextView
android:layout_width="match_content"""//aquí es parte de la anchura aquí decidiremos queparámetro vamos a usar
como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="181dp""//aquí es parte de la altura aquí decidiremos que parámetro vamos a usar como aquí
utilizamos el un tamaño
android:background="#4CAF50"//aqui ponemos el fondo de color de nuestro TextView
android:textSize="24sp" />"//aqui estara el tamaño de la letra del texto que estará en el TextView
<TextView
android:text="Oswaldo"
android:layout_width="match_parent"
android:layout_height="181dp"
android:background="#4CAF50"
android:textSize="24sp" />
<TextView
android:text="Axel"
android:layout_width="match_parent"
android:layout_height="181dp"
android:background="#4CAF50"
android:textSize="24sp" />
<TextView
android:text="Elian"
android:layout_width="match_parent"
android:layout_height="181dp"
android:background="#4CAF50"
android:textSize="24sp" />
</LinearLayout>
Desing
1. Agregamos 4 textview
2. Al primero lepondremos Lista de invitados
3. Al segundo le pondremos Oswaldo
4. Al tercero Axel
5. Al quinto Elian
7. Practica: Lista de invitados (Pantalla colores)
Objetivo: Realizar un App, que contenga 4objetos de textview con los siguientes nombres y dividirlos en cuatro
partes iguales con un fondo verde otro azul otro gris y por ultimo blanco
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:orientation="vertical"//aqui sepondrá la orientación en la que se presentara la app
android:background="@android:color/darker_gray">//aquí estamos poniendo el fondo que tendrá nuetra apk
<TextView
android:text="Lista de Invitados""//aqui pondremos el texto que quieres que aparezca en el TextView
android:layout_width="match_content"""//aquí es parte de la anchura aquí decidiremos queparámetro vamos a usar
como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="181dp""//aquí es parte de la altura aquí decidiremos que parámetro vamos a usar como aquí
utilizamos el un tamaño
android:layout_weigth="1"//sirvepara repartir en partes nuestra pantalla
android:background="#4CAF50"//aqui ponemos el fondo de color de nuestro TextView
android:textSize="24sp" />"//aqui estara el tamaño de la letra del texto que estará en el TextView
<TextView
android:text="Oswaldo"
android:layout_width="match_parent"
android:layout_height="181dp"
android:layout_weigth="2”
android:background="#4CAF50"
android:textSize="24sp" />
<TextView
android:text="Axel"
android:layout_width="match_parent"
android:layout_height="181dp"
android:layout_weigth="3"
android:background="#4CAF50"
android:textSize="24sp" />
<TextView
android:text="Elian"
android:layout_width="match_parent"
android:layout_height="181dp"
android:layout_weigth="4"
android:background="#4CAF50"
android:textSize="24sp" />
</LinearLayout>
Desing
1. Agregamos 4 textview
2. Al primero lepondremos Lista de invitados
3. Al segundo le pondremos Oswaldo
4. Al tercero Axel
5. Al quinto Elian
8. Practica:Imagen y texto
Objetivo: Realizar un App, que contenga 2 objetos un textview y imageview,y el el texto contendrá lo siguiente
<LinearLayout
xmlns:android=http://schemas.android.com/apk/res/android
android:layout_width="match_parent"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:orientation="vertical"//aqui sepondrá la orientación en la que se presentara la app
<ImageView//aquí esta el objeto llamado imagen
android:src="@drawable/android"//aquí llamamos a la imagen quequeremos que se muestre
android:layout_width="wrap_content"""//aquí es parte de la anchura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="wrap_content"""//aquí es parte de la altura aquí decidiremos que parámetro vamos a usar como
aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_weight="1"//ancho que abarcaránuestra imagen(1 a 6)
android:scaleType="centerCrop"//para que nuestra imageView este centrado
/>
<TextView//aquí esta el objeto llamado texto
android:text="You're invited!"//aqui pondremos el texto que quieres que muestre el TextView
android:layout_width="wrap_content"//aquí es parte de la anchura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="wrap_content"//aquí es parte de la altura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_weight="0"//ancho que abarcaránuestra imagen(1 a 6)
android:textColor="@android:color/white"//aquí pondremos de que color va ser nuestra letra
android:textSize="54sp"//aqui pondremos el tamaño de letra
android:background="#009688"/>//aqui pondremos el fondo que tendrá nuestro TextView
<TextView
android:text="Bofire at the beach"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:textColor="@android:color/white"
android:textSize="34sp"
android:background="#009688"
/>
</LinearLayout>
Desing
1. Descargamos una imagen y la pondremos en
drawable
2. Agregamos 1 Imageview y budcaremos nuestra
imagen
3. Agregamos 2 textview
4. A uno le prondremos You’re invited
5. Al otro le pondremos Bofire at the beach
9. Practica:imagen y texto pantalla completa
Objetivo:RealizarunApp,que contenga 2 objetosuntextview y imageview,y el el texto contendrá un formato que
abarque toda la pantalla completa
<LinearLayout
xmlns:android=http://schemas.android.com/apk/res/android
android:layout_width="match_parent"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:orientation="vertical"//aqui sepondrá la orientación en la que se presentara la app
<ImageView//aquí esta el objeto llamado imagen
android:src="@drawable/android"//aquí llamamos a la imagen quequeremos que se muestre
android:layout_width="match_parent"""//aquí es parte de la anchura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el match_parent que abarque toda la anchura
android:layout_height="wrap_content"""//aquí es parte de la altura aquí decidiremos que parámetro vamos a usar como
aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_weight="1"//ancho que abarcaránuestra imagen(1 a 6)
android:scaleType="centerCrop"//para que nuestra imageView este centrado
/>
<TextView//aquí esta el objeto llamado texto
android:text="You're invited!"//aqui pondremos el texto que quieres que muestre el TextView
android:layout_width="match_parent"//aquí es parte de la anchura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content paraquéabarquetoda la anchura
android:layout_height="wrap_content"//aquí es parte de la altura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_weight="0"//ancho que abarcaránuestra imagen(1 a 6)
android:textColor="@android:color/white"//aquí pondremos de que color va ser nuestra letra
android:textSize="54sp"//aqui pondremos el tamaño de letra
android:background="#009688"/>//aqui pondremos el fondo que tendrá nuestro TextView
<TextView
android:text="Bofire at the beach"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:textColor="@android:color/white"
android:textSize="34sp"
android:background="#009688"
/>
</LinearLayout>
Desing
1. Descargamos una imagen y la pondremos en
drawable
2. Agregamos 1 Imageview y budcaremos nuestra
imagen
3. Agregamos 2 textview
4. A uno le prondremos You’re invited
5. Al otro le pondremos Bofire at the beach
10. Practica:imagen con margen
Objetivo:RealizarunApp,que contenga 2 objetosuntextview y imageview,y el el texto contendrá un formato que
divida en márgenes los objetos
<LinearLayout
xmlns:android=http://schemas.android.com/apk/res/android
android:layout_width="match_parent"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:orientation="vertical"//aqui sepondrá la orientación en la que se presentara la app
<ImageView//aquí esta el objeto llamado imagen
android:src="@drawable/android"//aquí llamamos a la imagen quequeremos que se muestre
android:layout_width="match_parent"""//aquí es parte de la anchura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el match_parent que abarque toda la anchura
android:layout_marginHorizontal=”20dp”//sirvepara dar un margen
android:layout_marginTop=”20dp” //sirvepara dar un margen
android:layout_height="wrap_content"""//aquí es parte de la altura aquí decidiremos que parámetro vamos a usar como
aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_weight="1"//ancho que abarcaránuestra imagen(1 a 6)
android:scaleType="centerCrop"//para que nuestra imageView este centrado
/>
<TextView//aquí esta el objeto llamado texto
android:text="You're invited!"//aqui pondremos el texto que quieres que muestre el TextView
android:layout_width="match_parent"//aquí es parte de la anchura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content paraquéabarquetoda la anchura
android:layout_marginHorizontal=”20dp”//sirvepara dar un margen
android:layout_marginTop=”20dp” //sirvepara dar un margen
android:layout_height="wrap_content"//aquí es parte de la altura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_weight="0"//ancho que abarcaránuestra imagen(1 a 6)
android:textColor="@android:color/white"//aquí pondremos de que color va ser nuestra letra
android:textSize="54sp"//aqui pondremos el tamaño de letra
android:background="#009688"/>//aqui pondremos el fondo que tendrá nuestro TextView
<TextView
android:text="Bofire at the beach"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal=”20dp”
android:layout_marginButtom=”20dp” //sirvepara dar un margen
android:layout_weight="0"
android:textColor="@android:color/white"
android:textSize="34sp"
android:background="#009688"
/>
</LinearLayout>
Desing
1. Descargamos una imagen y la pondremos en
drawable
2. Agregamos 1 Imageview y budcaremos nuestra
imagen
3. Agregamos 2 textview
4. A uno le prondremos You’re invited
5. Al otro le pondremos Bofire at the beach
11. Practica: Distribución de texto 1
Objetivo: Realizar un App, que contenga 4 objetos textview y que se repartan en cada esquina de la pantalla
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android" //ubicamos laloscomponentes
xmlns:app="http://schemas.android.com/apk/res-auto" //ubicamos la app
xmlns:tools="http://schemas.android.com/tools" //ubicamos lasherramientas
android:layout_width="match_parent"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:padding="16dp" //las dimensiones quetendrá nuestra anchura
tools:context=".MainActivity">
<TextView
android:text="I`m in this corner"// lo que queremos que muestre el textview
android:layout_width="wrap_content""//aquí es parte de la anchura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="wrap_content""//aquí es parte de la altura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_alignParentBottom="true"//para que se visible
android:layout_alignParentLeft="true"//la posicion a dondese anclara />
<TextView
android:text="No,up here"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true" />
<TextView
android:text="Wait, I´m here"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:text="Actually,I´m here" />
</RelativeLayout>
Desing
1. Agregamos 4 textview
2. Al primero lepondremos I`m in this corner
3. Al segundo le pondremos No,up here
4. Al tercero Wait,I´m here
5. Al quinto Actually,I´mhere
12. Practica: Distribucion de texto 2
Objetivo:RealizarunApp,que contenga 8 objetostextview yque se repartanencada esquinade lapantallay que se
muestre la siguiente manera
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android" //ubicamos laloscomponentes
xmlns:app="http://schemas.android.com/apk/res-auto" //ubicamos la app
xmlns:tools="http://schemas.android.com/tools" //ubicamos lasherramientas
android:layout_width="match_parent"//la altura quepresentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:layout_height="match_parent"//la altura que presentara nuestro fondo el cual estará
con el parámetro match_parent que haceun efecto de pantalla completa con el fondo
android:padding="16dp" //las dimensiones quetendrá nuestra anchura
tools:context=".MainActivity">
<TextView//aquí esta el objeto llamado texto
android:id="@+id/lyla_text_view" //ponemos el idde nuestro textView
android:layout_width="wrap_content""//aquí es parte de la anchura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_height="wrap_content""//aquí es parte de la altura aquí decidiremos que
parámetro vamos a usar como aquí utilizamos el wrap content para poner el tamaño real en si
android:layout_alignParentBottom="true"//para que se visible
android:layout_alignParentLeft="true"//la posicion a dondese anclara
android:textSize="24sp"//tamaño del texto fuente
android:text="Lyla"//texto que se mostrara
/>
<TextView
android:id="@+id/Me_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toRightOf="@id/lyla_text_view"
android:textSize="24sp"
android:text="Me"
/>
<TextView
android:id="@+id/natalie_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="24sp"
android:text="Natalie"
/>
<TextView
android:id="@+id/jennie_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:textSize="24sp"
android:text="jennie"
/>
<TextView
android:id="@id/KunalBen_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentTop="true”
