Margin y Padding en Android

Cuando colocamos TextView en android podemos manejar los espacios entre como colaremos los elementos para ello usamos layout_margin y podemos colocarle la medida ya sea para la parte derecha o izquierda, arriba o abajo de nuestro textview a continuacion un ejemplo.

1.- Abrimos el main.xml

2.- Crearemos un TextView y usaremos layout_marginTop y layout_marginLeft y le colocaremos una medida.


3.- A continuacion el codigo y el resultado.

4.- Ahora si colocamos un background podemos ver que no se coloca de una forma adecuada.

5.- Para solucionar esto es mejor usar padding como se muestra a continuacion.

RelativeLayout - layout_alignParent en android

Cuando utilizamos RelativeLayout es necesario colocar los elementos por medio de posicionamientos asi que para este ejemplo usaremos layout_alignParent y utilizaremos el android:id para colocar la posicion de un elemento ya sea arriba o abajo de el mediante uso de su id a continuacion el ejemplo.

1.- Abrimos el main.xml

2.- Crearemos 7 TextView y los colocaremos en las siguientes posiciones, colocaremos 3 texviews
en la parte superior, 2 es la parte inferior izquierda y 2 mas en la parte inferior derecha

3.- A continuacion el codigo y el resultado

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <TextView
            android:id="@+id/Pacman"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"
            android:textSize="35sp"
            android:text="Pacman" />

    <TextView
            android:id="@+id/Depredador1220"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_toRightOf="@id/Pacman"
            android:textSize="35sp"
            android:text="Depredador1220" />


    <TextView
            android:id="@+id/Bomberman"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:textSize="35sp"
            android:text="Bomberman" />

    <TextView
            android:id="@+id/MarioBros"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_above="@id/Bomberman"
            android:textSize="35sp"
            android:text="MarioBros" />



    <TextView
            android:id="@+id/Sonic"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_centerHorizontal="true"
            android:textSize="35sp"
            android:text="Sonic" />

    <TextView
            android:id="@+id/DuckHunt"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_toLeftOf="@id/Sonic"
            android:textSize="35sp"
            android:text="DuckHunt" />

    <TextView
            android:id="@+id/Megaman"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_toRightOf="@id/Sonic"
            android:textSize="35sp"
            android:text="Megaman" />

</RelativeLayout> 

Relative Layout en Android

Usaremos el RelativeLayout el cual permite posicionar los elementos hijos en función del padre o de otros. A diferencia de LinearLayout que te pone los elementos de manera alineada ya sea horizontal o vertical.

1.- Abrimos el main.xml

2.- Colocaremos 3 TextViews con un texto opcional, usaremos la alineacion por emparentamiento o padre usando
    layout_alignParent y la posicion ya sea izquierda, derecha, arriba o abajo, entonces quedaria mas o menos asi --> android:layout_alignParentTop="true".

3.- A continuacion el codigo y el resultado de el espacio entre cada textview en nuestra ventana.

main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
        >

    <TextView
            android:text="Depredador1220"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:textSize="45dp"
            />

    <TextView
            android:text="Mario Bros"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"
            android:textSize="45dp"
            />

    <TextView
            android:text="Goku"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="45dp"
            />

</RelativeLayout>

Layout Weight

Usaremos android:layoutWeight para colocar cierto limite entre nuestro componentes o un espacio entre ellos, lo visualizaremos usando TextView

1.- Abrimos el main.xml

2.- Colocaremos 3 TextViews con un texto opcional, le colocaremos a cada uno un color de fondo distinto para diferenciarlos, usaremos una orientacion vertical y por ultimo usaremos el android:weight para poder ver este espaciado.

3.- A continuacion el codigo y el resultado de el espacio entre cada textview en nuestra ventana.

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
        >

    <TextView
            android:text="Depredador1220"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#4CAF50"
            android:textSize="60dp"
            android:layout_weight="1"
            />

    <TextView
            android:text="Mario Bros"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#2196F3"
            android:textSize="60dp"
            android:layout_weight="1"
            />

    <TextView
            android:text="Goku"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#673AB7"
            android:textSize="60dp"
            android:layout_weight="1"
            />

</LinearLayout>

LinearLayout: Orientation

Usaremos la orientacion en nuestro LinearLayout para colocar nuestros TextView en la pantalla.

1.- Abrimos el main.xml

2.- En nuestro componente LinearLayout pondremos la orientacion para ir acomodando TextView, existen dos tipos el horizontal y el vertical, probaremos los dos para darnos una idea de la colocacion en la pantalla, crearemos TextViews los que queramos para reflejar los textos en la pantalla.

3.- A continuacion el codigo y el resultado de orientacion vertical y orientacion horizontal.

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
        >

    <TextView
        android:text="Lista de Invitados"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="45dp"
        />

    <TextView
            android:text="Depredador1220"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="45dp"
            />

    <TextView
            android:text="Mario Bros"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="45dp"
            />

    <TextView
            android:text="Goku"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="45dp"
            />

</LinearLayout> 

Vertical

Horizontal

ImageView en Android

Usaremos un ImageView para mostrar una imagen en nuestra aplicacion.

1.- Abrimos el main.xml

2.- Primero tenemos que acceder a la fuente donde se encuentra nuestras imagenes en este caso la carpeta drawable, para acceder usamos android:src="ruta"

3.- Tambien tenemos que poner como se vera la imagen en nuestra pantalla para ello se maneja el android:scaleType tiene varios parametros para ajustar la imagen, para este ejemplo  utilizare "center" y "centerCrop" aqui el codigo.

TextView: textColor

Podemos cambiar el color de nuestro texto usando android:textColor

1.- Abrimos el ejemplo anterior o creamos un TextView en main.xml

2.- Introducimos el siguiente codigo para darle un color a nuestro texto.

    Color Hex Android

TextView: textSize y textAppearance

Podemos cambiar el tamaño de nuestro texto usando android:textSize o podemos usar una unidad

de medida standar usando textAppearance

1.- Abrimos el ejemplo anterior o creamos un TextView en main.xml

2.- Introducimos el siguiente código para darle un tamaño a nuestro texto.

3.- También podemos darle un texto pequeño, mediano o grande usando textAppearance

  ?android:textAppearanceSmall mide 14sp

  ?android:textAppearanceMedium mide 18sp

  ?android:textAppearanceLarge mide 22sp

TextView - wrap_content

La primera vez que creamos un TextView nos salia por default las dimensiones de nuestra
TextView en las declaraciones de android:layout_width y height respectivamente, en esta parte
podemos dimensionar nuestro TextView, podemos ver este ejemplo mejor representado usando un
android:background.

1.- Abrimos el ejemplo anterior o creamos un TextView en main.xml

2.- Observamos que anteriormente habíamos creado los layout con un numero y con un dp, los dp son
una unidad de medida concretamente "Densidad independiente de pixeles" que es una unidad
abstracta basada en una densidad física de la pantalla, existen otras unidades de medida como "px"
que son las unidades en pixeles y "sp" que es una escala independiente de pixeles, puedes probar
con ellas en layout_width o layout_height.

3.- Existe un variable predeterminada llamada wrap_content que lo que hace es ajustarse a la
distancia de nuestro TextView sin pasarse, podemos verlo mejor representado en el background tanto del primer ejemplo como en este.

TextView android:background en Android

Ahora que hemos declarado nuestro TextView podemos declarar algunas características para este

apartado crearemos un fondo para nuestro TextView con android:background

1.- Abrimos el proyecto anterior con el que creamos un TextView o crea un TextView.

2.- Crearemos un background introduciendo el siguiente código, primeramente pondremos un color por default que android ya tiene preestablecido.

3.- Podemos poner un color en Hex para colocarse con un color deseado. Aquí un link de la paleta de colores en android 

Colores Paleta Android.

4.- Podemos colocar una imagen de fondo usando las imágenes que se encuentran en nuestra carpeta de drawable de la siguiente manera.

5.- Puedes ver siempre tu resultado en un visualizador si cuenta con ello tu IDE para ver tus

    GUI para que no ejecutes el programa.

Creando TextView en Android

Los TextView son controles de nuestra interfaz de usuario "GUI" que nos sirven para introducir texto

en la pantalla para indicar alguna información.

1.- Iniciamos un proyecto en android.

2.- seleccionamos nuestro archivo main.xml y nos situamos en el apartado de Text para ver el XML.

3.- Aquí declararemos nuestro TextView colocando el siguiente texto, recuerda que para poner

    comentarios en XML usas <!-- aquí comentario -->, por si deseas hacer anotaciones.

4.- Puedes ver siempre tu resultado en un visualizador si cuenta con ello tu IDE para ver tus

    GUI para que no ejecutes el programa o si lo deseas tambien para verlo en acción.

Prefabs en Unity 5+

Los Prefabs son un tipo de Asset que le permite almacenar un objeto GameObject completamente con componentes y propiedades para poderse reutilizar las veces que sea.

1.- Creamos un proyecto 3D o uno existente.

2.- Creamos dos carpetas una textura y la otra material.

3.- Dentro de la carpeta Textura, introduciremos una textura de un archivo jpg o png.

4.- Ahora entramos en la carpeta material y le daremos clic derecho, Create > Material para crear un nuevo material y lo llamaremos como deseemos.

5.- Ahora en propiedades del inspector nos situamos en el apartado de colores y le daremos el color que mas nos guste.

6.- Ahora crearemos un cubo, nos situamos en GameObject > 3D Object > Cube.

7.- Lo Primero que haremos ahora es seleccionar el cubo y tomaremos el material que hemos creado, entonces arrastramos el material hacia el inspector para añadirlo al objeto o solo lo arrastramos hacia el cubo para que tome el material.

8.- Ahora podemos crear nuestros prefabs, para ello crearemos una carpeta y la llamaremos prefabs.

9.- Ahora seleccionamos el cubo en la jerarquía y lo arrastramos hasta la carpeta prefabs veras un icono que se crea al hacer eso, nos daremos cuenta que es un prefabs por que ahora el texto de cube se pone de color azul, eso quiere decir que es un prefab, cambiaremos el nombre a CuboMaterial.

10.- Ahora podemos eliminar el cubo de la jerarquía, con esto ahora solo podemos arrastrar nuestro prefabs del cubo material y ya no tendremos que repetir mas los pasos.

11.- Borramos los cubos, ahora crearemos un nuevo cubo(paso 6) ahora le asignaremos la textura, y repetimos el proceso(paso 9, paso 10) lo llamaremos CuboTextura y podemos arrastrar los cubos que queramos sin repetir de nuevo los pasos y para que sean reutilizables.