53. GTK: elementos para posicionar

Rejillas (Grid)

Posicionar los diferentes widgets dentro de una ventana implica usar widgets que, a su vez, dividen las ventanas en zonas. En el siguiente ejemplo, usamos GtkGrid, o rejilla, cuyo método más fundamental es grid.attach(). En él, debemos indicar que widget "hijo" (child) vamos a posicionar dentro del grid. Y los siguientes parámetros son left, top, width, height.

• left: posición de la columna empezando por cero.
• top: posición de la fila, empezando por cero
• width: el "hijo" ocupará tantas celdas de ancho
• height: el hijo ocupará tantas celdas de alto.

Otro método a tener en cuenta es grid.attach_next_to() en el que colocamos nuestro "hijo" al lado de otro ya existente. El primer parámetro es el nuevo "hijo" a posicionar, el segundo el "pariente" que ya existe, el tercero el lado a colocar en referencia al pariente (Gtk.PositionType.BOTTOM, por ejemplo) y después quedan width y height como en el caso anterior. También se puede usar LEFT, RIGHT y TOP.

Un ejemplo, lo tenemos en:

from gi.repository import Gtk
import sys


class MyWindow(Gtk.ApplicationWindow):

    def __init__(self, app):
        Gtk.Window.__init__(self, title="Grid Example", application=app)

        # three labels
        label_top_left = Gtk.Label(label="This is Top Left")
        label_top_right = Gtk.Label(label="This is Top Right")
        label_bottom = Gtk.Label(label="This is Bottom")

        # a grid
        grid = Gtk.Grid()

        # some space between the columns of the grid
        grid.set_column_spacing(20)

        # in the grid:
        # attach the first label in the top left corner
        grid.attach(label_top_left, 0, 0, 1, 1)
        # attach the second label
        grid.attach(label_top_right, 1, 0, 1, 1)
        # attach the third label below the first label
        grid.attach_next_to(label_bottom, label_top_left, Gtk.PositionType.BOTTOM, 2, 1)

        # add the grid to the window
        self.add(grid)


class MyApplication(Gtk.Application):

    def __init__(self):
        Gtk.Application.__init__(self)

    def do_activate(self):
        win = MyWindow(self)
        win.show_all()

app = MyApplication()
exit_status = app.run(sys.argv)
sys.exit(exit_status)

= = =

Otro ejemplo, que establece una rejilla de 10x10

from gi.repository import Gtk
import sys


class MyWindow(Gtk.ApplicationWindow):

    def __init__(self, app):
        Gtk.Window.__init__(self, title="Grid Example", application=app)
        
        tope = 10
        
        # muchas etiquetas
        labels=[]
        for i in xrange(0,tope):
            for j in xrange(0,tope):
                labels.append(Gtk.Label(label="Etiqueta "+str(i)+":"+str(j)))


        # a grid
        grid = Gtk.Grid()

        # some space between the columns of the grid
        grid.set_column_spacing(5)

        # 
        for i in xrange(0,tope):
            for j in xrange(0,tope):
                grid.attach(labels[i+j*10],i,j,1,1)
        

        # add the grid to the window
        self.add(grid)


class MyApplication(Gtk.Application):

    def __init__(self):
        Gtk.Application.__init__(self)

    def do_activate(self):
        win = MyWindow(self)
        win.show_all()

app = MyApplication()
exit_status = app.run(sys.argv)
sys.exit(exit_status)

Otros métodos útiles (copiado del tutorial)

• insert_row(posición) e insert_column(posición) hacen que los hijos añadidos en esa posición o por debajo se muevan una fila hacia abajo, y que los hijos que se extienden a lo largo de esta posición crezcan para ocupar la siguiente fila. insert_next_to(hermano, lado) inserta una fila o columna en la posición especificada. La fila o columna nueva se pone al lado del hermano, a su lado; si es Gtk.PositionType.TOP or Gtk.PositionType.BOTTOM, se inserta una fila; si es Gtk.PositionType.LEFT o Gtk.PositionType.RIGHT, se inserta una columna.
• set_row_homogeneous(True) y set_column_homogeneous(True) se aseguran de que (respectivamente) cada fila o cada columna tengan la misma anchura o altura.
• set_row_spacing(espaciado) y set_column_spacing(espaciado) fuerzan un espaciado entre (respectivamente) filas o columnas. El valor de espaciado puede estar entre 0, que es el valor predeterminado, y 32767.

Separadores

Los separadores son elementos como los otros, que se colocan, preferentemente, en una rejilla. Creo que un simple estudio del ejemplo será suficiente (GtkLabel):

# coding: utf-8
from gi.repository import Gtk
import sys


class miventana(Gtk.ApplicationWindow):

    def __init__(self, app):
        Gtk.Window.__init__(self, title="Ejemplo de separador", application=app)

        # Las etiquetas
        label1 = Gtk.Label()
        label1.set_text("Abajo, un separador horizontal.")

        label2 = Gtk.Label()
        label2.set_text("A la derecha, un separador vertical.")

        label3 = Gtk.Label()
        label3.set_text("A la izquierda, un separador vertical")

        # separador horizontal        
        hseparator = Gtk.Separator(orientation=Gtk.Orientation.HORIZONTAL, width=2)
        # separador vertical
        vseparator = Gtk.Separator(orientation=Gtk.Orientation.VERTICAL)

        # una rejilla donde incrustar los separadores
        grid = Gtk.Grid()
        grid.attach(label1, 0, 0, 3, 1)
        grid.attach(hseparator, 0, 1, 3, 1)
        grid.attach(label2, 0, 2, 1, 1)
        grid.attach(vseparator, 1, 2, 1, 1)
        grid.attach(label3, 2, 2, 1, 1)
        grid.set_column_homogeneous(True)
        # añado a la ventana la rejilla.
        self.add(grid)


class miaplicacion(Gtk.Application):

    def __init__(self):
        Gtk.Application.__init__(self)

    def do_activate(self):
        win = miventana(self)
        win.show_all()

app = miaplicacion()
exit_status = app.run(sys.argv)
sys.exit(exit_status)

= = =

Ventanas con scroll

Las ventanas con scroll son aquellas que presentan barras verticales u horizontales ( o ambas) en las que se puede navegar por su contenido desplazándolas. En el ejemplo (elegir una imagen mayor que la ventana) (GtkScrolledWindow):

# coding: utf-8
from gi.repository import Gtk
import sys

class miventana(Gtk.ApplicationWindow):

    def __init__(self, app):
        Gtk.Window.__init__(self, title="Ejemplo de scroll", application=app)
        self.set_default_size(5, 5)

        # La ventana con scroll
        scrolled_window = Gtk.ScrolledWindow()
        scrolled_window.set_border_width(10)
        #política de scroll: que siempre aparezca
        scrolled_window.set_policy(
            Gtk.PolicyType.ALWAYS, Gtk.PolicyType.ALWAYS)

        # una imagen más grande que la ventana
        image = Gtk.Image()
        image.set_from_file("coche.png")

        # la añade a la ventana con scroll
        scrolled_window.add_with_viewport(image)

        # y la ventana con scroll a la ventana en sí
        self.add(scrolled_window)


class miaplicacion(Gtk.Application):

    def __init__(self):
        Gtk.Application.__init__(self)

    def do_activate(self):
        win = miventana(self)
        win.show_all()

app = miaplicacion()
exit_status = app.run(sys.argv)
sys.exit(exit_status)

= = =

Métodos útiles para un widget «ScrolledWindow» (del tutorial)

• set_policy(norma_barra_despl_h, norma_barra_despl_v) donde cada uno de los argumentos puede ser Gtk.Policy.AUTOMATIC, Gtk.Policy.ALWAYS, Gtk.Policy.NEVER. Regulan si deben las aparecer barras de desplazamiento horizontal y vertical: con AUTOMATIC sólo aparecen si se necesitan, con ALWAYS aparecen siempre, y con NEVER no aparecen nunca.
• add_with_viewport(widget) se usa para añadir el widget «Gtk.Widget» sin capacidad de desplazamiento nativo dentro de la ventana.
• set_placement(lugar_de_ventana) establece la ubicación del contenido con respecto a las barras de desplazamiento de la ventana. Las opciones para el argumento son Gtk.CornerType.TOP_LEFT (predeterminada: las barras de desplazamiento están en la parte inferior y derecha de la ventana), Gtk.CornerType.TOP_RIGHT, Gtk.CornerType.BOTTOM_LEFT, Gtk.CornerType.BOTTOM_RIGHT.
• set_hadjustment(ajuste) y set_vadjustment(ajuste) establecen el ajuste «Gtk.Adjustment». Este es la representación de un valor con un límite superior e inferior, junto con pasos y páginas de incrementos, y un tamaño de página, y se construye como Gtk.Adjustment(valor, mínimo, ,máximo, paso, página, tamaño_de_página) donde los campos son del tipo float. Tenga en cuenta que paso no se usa en este caso, y puede establecerse a 0.

= = =

Paneles

También se pueden insertar paneles... (Gtk.Paned)

...
class miventana(Gtk.ApplicationWindow):

    def __init__(self, app):
        Gtk.Window.__init__(self, title="Paned Example", application=app)
        self.set_default_size(450, 350)

        # widget paned con orientación horizontal
        paned = Gtk.Paned.new(Gtk.Orientation.HORIZONTAL)

        # dos imágenes
        image1 = Gtk.Image()
        image1.set_from_file("gnome.png")
        image2 = Gtk.Image()
        image2.set_from_file("tux.png")

        # añado imágenes y al panel.
        paned.add1(image1)
        paned.add2(image2)
        self.add(paned)
...