Tipos de Layouts en kivy

Bienvenidos amigos en esta ocasión aprendernos un poquito sobre los diferentes tipos de Layouts que kivy nos ofrece y como funciona de forma que los podamos usar en nuestros proyectos. Si no te quieres perder ningún detalle lee con mucho cuidado este post.


Que es un Layout?

Se le llama layout a la parte donde colocaremos los elementos ya sea de una aplicación o algún sitio web, un layout es como un contenedor donde ordenamos los elementos visuales como un widget, botones o cuadros de texto.

En que nos ayudan los layouts?
Simplemente en el ordenamiento adecuado de dos los elementos que una aplicación puede contener gráficamente.

Kivy no es la excepción ya que cuenta con muchos layouts cada uno con características diferentes de los cuales puedes sacarle provecho. Hací podemos crear bellas interfaces para nuestros queridos usuarios.


Tipos de layout:

  • FloatLayout
  • Gridlayout
  • Boxlayout
  • Stacklayout
  • Relavitelayout
  • Anchorlayout


Donde los mas utilizados son los primeros tres, tu puedes usar el que mas se adapte a tus necesidades. 

Para poder mostrarte como funciona cada tipo de layout te dejare imagenes donde veras el código de como trabaja cada uno de los layouts.

Primero crea un archivo de texto como el nombre layouts.py, ahora as click derecho sobre el archivo y selecciona editar con IDLE. ahora escribe todo el código que muestra cada imagen y haciendo F5 veras el resultado. lo mas importante para aprender a usar los layouts es experimentando con ellos, haci que te recomiendo que juegues con el código y lo modifiques ya que de esta manera aprenderás a usarlos rápidamente.

Nota: utilizare imágenes donde estará en código para impedir que solo copies y pegues, ya que no es una buena practica.  

Floatlayout

Este es uno de los utilizados, gracias a la gran ventaja que tenemos de poner elementos en el lugar que mas nos guste. ejemplo:


codigo para aprender a usar el FloatLayout en kivy



Gridlayout

Para utilizar este layout tenemos que definir por lo menos su dimensión, si queremos que tenga una columna o mas de igual forma que las filas, puedes ver este layout como una hoja de cálculo donde cada elemento toma su lugar de acuerdo al orden que los agregues por ejemplo:
codigo para aprender a usar el GridLayout en kivy


Boxlayout

En este layout puedes agregar varios elemento los cuales se ordenan dependiendo del  tamaño de cada elemento dentro del mismo.
Por ejemplo:

codigo para aprender a usar el Boxlayout en kivy



Stacklayout

En este layout podemos agregar varios elementos cada elemento se acomoda dependiendo del espacio que el Stacklayout tenga para utilizar. Nos seria de mucha utilidad si queremos agregar varios elementos y deseamos que tengan el mismo tamaño, El layout le define el espacio a cada elemento dependiendo del espacio total que el layout tenga disponible. Ejemplo.
código para aprendera a usar el StackLayout en kivy

Nota: en este caso definimos la orientación, usando comandos como:  ‘lr-tb’, ‘tb-lr’, ‘rl-tb’, ‘tb-rl’, ‘lr-bt’, ‘bt-lr’, ‘rl-bt’ ‘bt-rl', donde lr significa que nuestros elementos se ordenaran de izquierda a derecha y rl lo contrario, al igual tb significa que los elementos se ordenaran de arriba para abajo, otra vez bt lo contrario a lo anterior. También en este caso para definir en padding(espacio entre los widgets) tenemos que definir de la siguiente forma padding:[5,5,5,5]

Relativelayout

Es muy similar al Floatlayout  solo que este caso cada elemento se acomoda de acuerdo a la posición del layout. Ejemplo:
codigo para aprender a usar el relativelayout en kivy



AnchorLayout

Este layout nos permite agregar elementos basándonos en los bordes del mismo. Ejemplo:

codigo para aprender a usar el anchorlayout en kivy


Ahora te toca a ti experimentar con todos los layouts y usa el que mas te guste en tus proyectos.

0 comentarios:

Publicar un comentario

Queremos saber que opinas del post, por favor comentamos todas tus opiniones, sugerencias y dudas