Calificación:
  • 0 voto(s) - 0 Media
  • 1
  • 2
  • 3
  • 4
  • 5
Poner scrollbar horizontal en treeview (tkinter)
#1
Hola a todos. Estoy aprendiendo a programar con Python y tengo el siguiente problema: En la imagen que adjunto verán que estoy ingresando datos a una tabla que tiene 8 campos pero no los puedo ver todos porque la barra de desplazamiento (scrollbar) que estoy utilizando no es capaz de mostrarlos. Yo necesito que la barra sea como la que muestro en la imagen y que al desplazarla pueda ver el resto de los campos. El código para grabar los campos en la tabla lo tengo, solo estoy perdido en esta barra de desplazamiento. Si alguien me puede ayudar se le agradecería mucho. Aquí también dejo el código :

Código:
import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfo
root = tk.Tk()
root.title('Treeview demo')
root.geometry('620x200')
columns = ('first_name', 'last_name', 'email','col1','col2','col3','col4','col5','col6','col7','col8')
tree = ttk.Treeview(root, columns=columns, show='headings')
tree.heading('first_name', text='First Name')
tree.heading('last_name', text='Last Name')
tree.heading('email', text='Email')
tree.heading('col1', text='col1')
tree.heading('col2', text='col2')
tree.heading('col3', text='col3')
tree.heading('col4', text='col4')
tree.heading('col5', text='col5')
tree.heading('col6', text='col5')
tree.heading('col7', text='col7')
tree.heading('col8', text='col8')
contacts = []
for n in range(1, 100):
    contacts.append((f'first {n}', f'last {n}', f'email{n}@example.com'))
for contact in contacts:
    tree.insert('', tk.END, values=contact)
def item_selected(event):
    for selected_item in tree.selection():
        item = tree.item(selected_item)
        record = item['values']
        showinfo(title='Information', message=','.join(record))
tree.bind('<<TreeviewSelect>>', item_selected)
tree.grid(row=0, column=0)
scrollbar = ttk.Scrollbar(root, orient=tk.HORIZONTAL, command=tree.yview)
tree.configure(yscroll=scrollbar.set)
scrollbar.grid(row=2, column=0)
root.mainloop()

Y esta es la imagen de lo que necesito:


Archivos adjuntos Miniatura(s)
   
Responder
#2
Tongue 
(06-04-2022, 02:43 AM)xmelfos escribió: Hola a todos. Estoy aprendiendo a programar con Python y tengo el siguiente problema: En la imagen que adjunto verán que estoy ingresando datos a una tabla que tiene 8 campos pero no los puedo ver todos porque la barra de desplazamiento (scrollbar) que estoy utilizando no es capaz de mostrarlos. Yo necesito que la barra sea como la que muestro en la imagen y que al desplazarla pueda ver el resto de los campos. El código para grabar los campos en la tabla lo tengo, solo estoy perdido en esta barra de desplazamiento. Si alguien me puede ayudar se le agradecería mucho. Aquí también dejo el código :

*****
import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfo
root = tk.Tk()
root.title('Treeview demo')
root.geometry('620x200')
columns = ('first_name', 'last_name', 'email','col1','col2','col3','col4','col5','col6','col7','col8')
tree = ttk.Treeview(root, columns=columns, show='headings')
tree.heading('first_name', text='First Name')
tree.heading('last_name', text='Last Name')
tree.heading('email', text='Email')
tree.heading('col1', text='col1')
tree.heading('col2', text='col2')
tree.heading('col3', text='col3')
tree.heading('col4', text='col4')
tree.heading('col5', text='col5')
tree.heading('col6', text='col5')
tree.heading('col7', text='col7')
tree.heading('col8', text='col8')
contacts = []
for n in range(1, 100):
    contacts.append((f'first {n}', f'last {n}', f'email{n}@example.com'))
for contact in contacts:
    tree.insert('', tk.END, values=contact)
def item_selected(event):
    for selected_item in tree.selection():
        item = tree.item(selected_item)
        record = item['values']
        showinfo(title='Information', message=','.join(record))
tree.bind('<<TreeviewSelect>>', item_selected)
tree.grid(row=0, column=0)
scrollbar = ttk.Scrollbar(root, orient=tk.HORIZONTAL, command=tree.yview)
tree.configure(yscroll=scrollbar.set)
scrollbar.grid(row=2, column=0)
root.mainloop()


******

Y esta es la imagen de lo que necesito:
Buenas:

Yo no soy un experto pero tienes que meter el treeview en un canvas y luego añadir la opción scrollregion. (La pega es que ya no funcionará el scroll hacia arriba y hacia abajo con la ruleta y hay que añadir otro vertical(Esto aún no he podido solucionarlo).

Te pongo un ejemplo que uso yo y para lo que necesito es suficiente. Francisco probablamente te sea de más ayuda. Tongue

Código:
# PANEL 11 (With 2 Scrollbar)


self.frame11ccl = ttk.Frame(self.frame_canccl, width=1425, height=200, style="Frames02.TFrame")
self.frame11ccl.grid(row=5, column=0)

self.scroll11ccl = ttk.Scrollbar(self.frame11ccl, orient='vertical', style="S.Vertical.TScrollbar")
self.scroll11ccl.grid(row=0, column=1, sticky=tk.N+tk.S)

self.scroll11accl = ttk.Scrollbar(self.frame11ccl, orient='horizontal', style="S.Horizontal.TScrollbar")
self.scroll11accl.grid(row=1, column=0, sticky=tk.W+tk.E)

self.canvas11ccl = tk.Canvas(self.frame11ccl, bg='#181812', width=1105, height=220)
self.canvas11ccl.grid(row=0, column=0, sticky=tk.N+tk.S+tk.E+tk.W)

self.scroll11ccl.configure(command=self.canvas11ccl.yview)

self.scroll11accl.configure(command=self.canvas11ccl.xview)

self.canvas11ccl.configure(yscrollcommand=self.scroll11ccl.set)

self.canvas11ccl.configure(xscrollcommand=self.scroll11accl.set, scrollregion=(0,0,1775,1000))

self.canvas11ccl.configure(scrollregion=self.canvas11ccl.bbox(tk.ALL))

self.frame_can11ccl = ttk.Frame(self.canvas11ccl, style="Frames02.TFrame")

self.canvas11ccl.create_window(0,0, window=self.frame_can11ccl, anchor="nw")

#TREEVIEW

self.treeviewccl1 = ttk.Treeview(self.frame_can11ccl, style="TVIEW1.Treeview", columns=('col1', 'col2','col3', 'col4', 'col5', 'col6'))

self.treeviewccl1.grid(row=1, column=0, ipady=1600)
Responder
#3
(06-04-2022, 05:48 AM)Myszowor escribió:
(06-04-2022, 02:43 AM)xmelfos escribió: Hola a todos. Estoy aprendiendo a programar con Python y tengo el siguiente problema: En la imagen que adjunto verán que estoy ingresando datos a una tabla que tiene 8 campos pero no los puedo ver todos porque la barra de desplazamiento (scrollbar) que estoy utilizando no es capaz de mostrarlos. Yo necesito que la barra sea como la que muestro en la imagen y que al desplazarla pueda ver el resto de los campos. El código para grabar los campos en la tabla lo tengo, solo estoy perdido en esta barra de desplazamiento. Si alguien me puede ayudar se le agradecería mucho. Aquí también dejo el código :

*****
import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfo
root = tk.Tk()
root.title('Treeview demo')
root.geometry('620x200')
columns = ('first_name', 'last_name', 'email','col1','col2','col3','col4','col5','col6','col7','col8')
tree = ttk.Treeview(root, columns=columns, show='headings')
tree.heading('first_name', text='First Name')
tree.heading('last_name', text='Last Name')
tree.heading('email', text='Email')
tree.heading('col1', text='col1')
tree.heading('col2', text='col2')
tree.heading('col3', text='col3')
tree.heading('col4', text='col4')
tree.heading('col5', text='col5')
tree.heading('col6', text='col5')
tree.heading('col7', text='col7')
tree.heading('col8', text='col8')
contacts = []
for n in range(1, 100):
    contacts.append((f'first {n}', f'last {n}', f'email{n}@example.com'))
for contact in contacts:
    tree.insert('', tk.END, values=contact)
def item_selected(event):
    for selected_item in tree.selection():
        item = tree.item(selected_item)
        record = item['values']
        showinfo(title='Information', message=','.join(record))
tree.bind('<<TreeviewSelect>>', item_selected)
tree.grid(row=0, column=0)
scrollbar = ttk.Scrollbar(root, orient=tk.HORIZONTAL, command=tree.yview)
tree.configure(yscroll=scrollbar.set)
scrollbar.grid(row=2, column=0)
root.mainloop()


******

Y esta es la imagen de lo que necesito:
Buenas:

Yo no soy un experto pero tienes que meter el treeview en un canvas y luego añadir la opción scrollregion. (La pega es que ya no funcionará el scroll hacia arriba y hacia abajo con la ruleta y hay que añadir otro vertical(Esto aún no he podido solucionarlo).

Te pongo un ejemplo que uso yo y para lo que necesito es suficiente. Francisco probablamente te sea de más ayuda. Tongue

Código:
# PANEL 11 (With 2 Scrollbar)


self.frame11ccl = ttk.Frame(self.frame_canccl, width=1425, height=200, style="Frames02.TFrame")
self.frame11ccl.grid(row=5, column=0)

self.scroll11ccl = ttk.Scrollbar(self.frame11ccl, orient='vertical', style="S.Vertical.TScrollbar")
self.scroll11ccl.grid(row=0, column=1, sticky=tk.N+tk.S)

self.scroll11accl = ttk.Scrollbar(self.frame11ccl, orient='horizontal', style="S.Horizontal.TScrollbar")
self.scroll11accl.grid(row=1, column=0, sticky=tk.W+tk.E)

self.canvas11ccl = tk.Canvas(self.frame11ccl, bg='#181812', width=1105, height=220)
self.canvas11ccl.grid(row=0, column=0, sticky=tk.N+tk.S+tk.E+tk.W)

self.scroll11ccl.configure(command=self.canvas11ccl.yview)

self.scroll11accl.configure(command=self.canvas11ccl.xview)

self.canvas11ccl.configure(yscrollcommand=self.scroll11ccl.set)

self.canvas11ccl.configure(xscrollcommand=self.scroll11accl.set, scrollregion=(0,0,1775,1000))

self.canvas11ccl.configure(scrollregion=self.canvas11ccl.bbox(tk.ALL))

self.frame_can11ccl = ttk.Frame(self.canvas11ccl, style="Frames02.TFrame")

self.canvas11ccl.create_window(0,0, window=self.frame_can11ccl, anchor="nw")

#TREEVIEW

self.treeviewccl1 = ttk.Treeview(self.frame_can11ccl, style="TVIEW1.Treeview", columns=('col1', 'col2','col3', 'col4', 'col5', 'col6'))

self.treeviewccl1.grid(row=1, column=0, ipady=1600)

Muchas gracias por tomarte tu tiempo y responderme pero  no entiendo eso que dices de "canvas" porque apenas estoy dando mis primeros pasos con Python. Por ahí estuve buscando soluciones y encontré unos videos que un peruano que hace una aplicación de punto de venta con Node.Js y en una pantalla donde lista los inventarios de productos hace un manejo muy parecido a lo que busco. Entonces voy a echarle una estudiada a ese lenguaje a ver como me va porque con Python no he podido, y eso que he buscado y leído bastante.
Responder
#4
Hola, bienvenido.

Siguiendo un poco la línea de @Myszowor, creo que habría que poner el treeview y el scrollbar dentro de un marco (ttk.Frame) y luego usar las funciones y los parámetros que presentaste en tu código. El código para la barra de desplazamiento vertical es similar: https://foro.recursospython.com/Thread-P...en-tkinter. En este caso habría que usar la propiedad xview en lugar de yview. Algo así:

Código:
import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfo
root = tk.Tk()
root.title('Treeview demo')
root.geometry('620x300')
columns = ('first_name', 'last_name', 'email','col1','col2','col3','col4','col5','col6','col7','col8')
frame = ttk.Frame()
tree = ttk.Treeview(frame, columns=columns, show='headings')
tree.heading('first_name', text='First Name')
tree.heading('last_name', text='Last Name')
tree.heading('email', text='Email')
tree.heading('col1', text='col1')
tree.heading('col2', text='col2')
tree.heading('col3', text='col3')
tree.heading('col4', text='col4')
tree.heading('col5', text='col5')
tree.heading('col6', text='col5')
tree.heading('col7', text='col7')
tree.heading('col8', text='col8')
contacts = []
for n in range(1, 100):
    contacts.append((f'first {n}', f'last {n}', f'email{n}@example.com'))
for contact in contacts:
    tree.insert('', tk.END, values=contact)
def item_selected(event):
    for selected_item in tree.selection():
        item = tree.item(selected_item)
        record = item['values']
        showinfo(title='Information', message=','.join(record))
tree.bind('<<TreeviewSelect>>', item_selected)
scrollbar = ttk.Scrollbar(frame, orient=tk.HORIZONTAL, command=tree.xview)
tree.configure(xscroll=scrollbar.set)
tree.grid(row=0, column=0, sticky="nsew")
scrollbar.grid(row=1, column=0, sticky="new")
frame.grid(row=0, column=0, sticky="nsew")
frame.columnconfigure(0, weight=1)
frame.rowconfigure(0, weight=1)
frame.rowconfigure(1, weight=1)
root.columnconfigure(0, weight=1)
root.rowconfigure(0, weight=1)
root.mainloop()

Vista previa:

   

Tengo pendiente hacer un artículo en el blog sobre las barras de desplazamiento en la vista de árbol, pero más o menos esto es lo fundamental.

Saludos
¡No te pierdas nuestro curso oficial en Udemy para aprender Python, bases de datos SQL, orientación a objetos, tkinter y mucho más!

También ofrecemos consultoría profesional de desarrollo en Python para personas y empresas.
Responder
#5
(06-04-2022, 09:43 PM)Francisco escribió: Hola, bienvenido.

Siguiendo un poco la línea de @Myszowor, creo que habría que poner el treeview y el scrollbar dentro de un marco (ttk.Frame) y luego usar las funciones y los parámetros que presentaste en tu código. El código para la barra de desplazamiento vertical es similar: https://foro.recursospython.com/Thread-P...en-tkinter. En este caso habría que usar la propiedad xview en lugar de yview. Algo así:

Código:
import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showinfo
root = tk.Tk()
root.title('Treeview demo')
root.geometry('620x300')
columns = ('first_name', 'last_name', 'email','col1','col2','col3','col4','col5','col6','col7','col8')
frame = ttk.Frame()
tree = ttk.Treeview(frame, columns=columns, show='headings')
tree.heading('first_name', text='First Name')
tree.heading('last_name', text='Last Name')
tree.heading('email', text='Email')
tree.heading('col1', text='col1')
tree.heading('col2', text='col2')
tree.heading('col3', text='col3')
tree.heading('col4', text='col4')
tree.heading('col5', text='col5')
tree.heading('col6', text='col5')
tree.heading('col7', text='col7')
tree.heading('col8', text='col8')
contacts = []
for n in range(1, 100):
    contacts.append((f'first {n}', f'last {n}', f'email{n}@example.com'))
for contact in contacts:
    tree.insert('', tk.END, values=contact)
def item_selected(event):
    for selected_item in tree.selection():
        item = tree.item(selected_item)
        record = item['values']
        showinfo(title='Information', message=','.join(record))
tree.bind('<<TreeviewSelect>>', item_selected)
scrollbar = ttk.Scrollbar(frame, orient=tk.HORIZONTAL, command=tree.xview)
tree.configure(xscroll=scrollbar.set)
tree.grid(row=0, column=0, sticky="nsew")
scrollbar.grid(row=1, column=0, sticky="new")
frame.grid(row=0, column=0, sticky="nsew")
frame.columnconfigure(0, weight=1)
frame.rowconfigure(0, weight=1)
frame.rowconfigure(1, weight=1)
root.columnconfigure(0, weight=1)
root.rowconfigure(0, weight=1)
root.mainloop()

Vista previa:



Tengo pendiente hacer un artículo en el blog sobre las barras de desplazamiento en la vista de árbol, pero más o menos esto es lo fundamental.

Saludos

GRACIAS!!!! Me has dado la solución que esperaba y veo que dominas mucho el tema. Para mi sigue siendo un poco confuso entender como se forman estas barras de desplazamiento y sobre todo, viniendo yo de programar en VisualFox Pro en donde no era sino tomar un objeto grid de las herramientas y arrastrarlo al formulario donde queriamos que se desplagara y este ya tenia todos las barras de desplazamiento incluidas. Solo me tenia que preocupar por la programación o la lógica de los eventos. Pero bueno, hay que aprender python también.  Espero con ansias lo que vayas a publicar en tu blog sobre este tema. De nuevo, gracias
Responder
#6
De nada! Smile. Es cierto que es un poco extraño el rodeo que hay que hacer en Tkinter para obtener barras de desplazamiento (en otras librerías, como bien comentás, esto es automático). Tal vez se deba al hecho de que es multiplataforma (vs. FoxPro), trabaja con controles nativos (vs. Qt) y por ende debe proveer una solución capaz de ser implementada en varios sistemas operativos.

Saludos
¡No te pierdas nuestro curso oficial en Udemy para aprender Python, bases de datos SQL, orientación a objetos, tkinter y mucho más!

También ofrecemos consultoría profesional de desarrollo en Python para personas y empresas.
Responder


Salto de foro:


Usuarios navegando en este tema: 3 invitado(s)