Python | PageLayout en Kivy usando el archivo .kv

Kivy es una herramienta GUI independiente de la plataforma en Python. Como se puede ejecutar en Android, IOS, Linux y Windows, etc. Básicamente se usa para desarrollar la aplicación de Android, pero eso no significa que no se pueda usar en aplicaciones de escritorio.

Tutorial de Kivy: aprenda Kivy con ejemplos .

Diseño de página:

PageLayout funciona de manera diferente a otros diseños. Es un diseño dinámico, en el sentido de que permite hojear las páginas usando sus bordes. La idea es que sus componentes estén apilados uno frente al otro, y solo podamos ver el que está en la parte superior.
PageLayout es similar a las páginas de una copia en la que podemos mover/cambiar las páginas hacia la derecha o hacia la izquierda.

La clase PageLayout se usa para crear un diseño simple de varias páginas, de una manera que permite pasar fácilmente de una página a otra usando el borde.

Para usar PageLayout, debe importarlo con el siguiente comando:

from kivy.uix.pagelayout import PageLayout

Nota:
PageLayout actualmente no respeta las propiedades size_hint, size_hint_min, size_hint_max o pos_hint. Eso significa que no podemos usar todo esto en un diseño de página.

Ejemplo:

PageLayout:
    Button:
        text: 'page1'
    Button:
        text: 'page2'
    Button:
        text: 'page3'

Las transiciones de una página a la siguiente se realizan deslizando el dedo desde las áreas del borde en el lado derecho o izquierdo. Si desea usar varios widgets en una página, use diseños para hacerlo. Idealmente, cada página debe constar de un solo widget de diseño que contenga los widgets restantes en esa página.

El diseño de página contiene muchas cosas que se pueden usar para hacerlo más efectivo fácilmente en un archivo .kv.

borde: el ancho del borde alrededor de la página actual que se usa para mostrar las áreas de deslizamiento de la página anterior/siguiente cuando sea necesario. border es una NumericProperty y su valor predeterminado es 50dp.
página: La página mostrada actualmente. La página es una propiedad numérica y su valor predeterminado es 0.
swipe_threshold: el umbral utilizado para activar deslizamientos como porcentaje del tamaño del widget. swipe_threshold es una propiedad numérica y su valor predeterminado es 0,5.

Enfoque básico para crear un diseño de página usando un archivo .kv

1) import kivy
2) import kivyApp
3) import Pagelayout
4) Set minimum version(optional)
5) create Layout class
6) create App class
      - create build() function
7) Set up .kv file(name same as the App class)
8) return Layout/widget/Class(according to requirement)
9) Run an instance of the class

A continuación se muestra la implementación de archivos .kv en este código:

1). El archivo kv es simplemente cómo crear páginas en el archivo .kv
2). kv es cómo puedo agregar características como: color, texto, imagen, lienzo, swipe_threshold, botón en las páginas.

Implementación del Enfoque –
archivo main.py

Python3

## Sample Python application demonstrating the
## working of PageLayout in Kivy using .kv file
 
##################################################
# import kivy module  
import kivy
   
# base Class of your App inherits from the App class.  
# app:always refers to the instance of your application 
from kivy.app import App
 
# this restrict the kivy version i.e
# below this kivy version you cannot
# use the app or software
kivy.require('1.9.0')
  
# The PageLayout class is used to create
# a simple multi-page layout,
# in a way that allows easy flipping from
# one page to another using borders.
from kivy.uix.pagelayout import PageLayout
  
# creating the root widget used in .kv file
class PageLayout(PageLayout):
    pass
 
# creating the App class in which name
#.kv file is to be named PageLayout.kv
class PageLayoutApp(App):
    # defining build()
    def build(self):
        # returning the instance of root class
        return PageLayout()
 
# creating object of PageLayoutApp() class
plApp = PageLayoutApp()
 
# run the class
plApp.run()

1) archivo .kv de páginas simples

Python3

# creating simple Pagelayout using.kv
 
<PageLayout>:
     
    # creating Page 1
    Button:
        text: "Page 1"
 
    # creating Page 2
    Button:
        text: "Page 2"
 
    # creating Page 3
    Button:
        text: "Page 3"
 
    # creating Page 3
    Button:
        text: "Page 4"
 
    # create Page as may as you want

Salida:
imagen de la página 1

Imagen de la página 2

Similar es la página 3 y 4.
2) Archivo .kv con algunas características en las páginas

Python3

# creating simple Pagelayout using.kv
 
# creating page Layout
<PageLayout>:
 
    # Creating Page 1
     
    # Using BoxLayout inside PageLayout
    BoxLayout:
 
        # creating Canvas
        canvas:
            Color:
                rgb: 0, .5, .95, 1
            Rectangle:
                pos: self.pos
                size: self.size
 
        # Providing orientation to the BoxLayout
        orientation: "vertical"
 
        # creating Button
        Button:
            text: "Page 1"
            size_hint_y: .4
 
        # Adding Label to Page 1
             
        Label:
            markup: True
            text: "GFG[b]:):):):)[/b]"
            color: 0, 0, 0, 1
            outline_color: 0, 0.5, 0.5, 1
            font_size: 30
 
 
    # Creating Page 2
    BoxLayout:
        orientation: "vertical"
         
        canvas:
            Color:
                rgba: 109 / 255., 8 / 255., 57 / 255., 1
            Rectangle:
                pos: self.pos
                size: self.size
        Label:
            markup: True
            text: " Kivy[b]PageLayout[/b]!!!!! "
            color: 0, 0, 0, 1
            outline_color: 0, 0.5, 0.5, 1
            font_size: 30
 
             
        Button:
            text: "Page 2"
            size_hint_y: .2
 
 
    # Creating Page 3
    BoxLayout:
         
        orientation: 'vertical'
 
        canvas:
            Color:
                rgba: 100 / 555., 9 / 155., 37 / 455., 1
            Rectangle:
                pos: self.pos
                size: self.size
 
        Label:
            text: 'page 3'
 
        # This Image is directly from the websource
        # By using AsyncImage you can use that
        AsyncImage:
            source: 'http://kivy.org / logos / kivy-logo-black-64.png'
         
 
 
    # Creating Page 4
    Button:
        # Adding image
        # image must be .png
        # and present at the same folder where
        # .kv and main file is saved
        Image:
            source: "download.png"
            center_x: self.parent.center_x
            center_y: self.parent.center_y

Salida:
Página 1