TreeView in a ScrollView in Kivy - No Scroll - python-2.7

I'm working on a kivy app that pulls data from an sqlite3 database and populates a TreeView with it. The TreeView becomes too large to fit on my screen when I expand a few of the groups so I want to put it inside a ScrollView so I can still scroll down and see the items that have gone off the bottom of my screen. I can get a basic ScrollView to work, but when I put my TreeView inside it there is no scrolling and the top part of my TreeView is off the top of my screen.
I have trimmed down the code into this working example of the problem that runs without a .kv file:
from kivy.uix.scrollview import ScrollView
from kivy.uix.gridlayout import GridLayout
from kivy.core.window import Window
from kivy.uix.widget import Widget
from kivy.uix.treeview import TreeView, TreeViewNode
from kivy.uix.treeview import TreeViewLabel
from kivy.app import App
from kivy.properties import ObjectProperty, StringProperty
from kivy.uix.button import Button
class TreeViewButton(Button, TreeViewNode):
pass
modGroups = [u'Fruit', u'Fruit', u'Meat', u'Dairy', u'Dairy', u'Fruit']
modItems = [u'Apple', u'Pear', u'Spam', u'Egg', u'Milk', u'Banana']
modDict = dict()
modDictUnique = dict()
def populate_tree_view(tv):
modDict = zip(modGroups, modItems)
print modGroups
print modItems
for k, v in modDict:
if k not in modDictUnique:
modDictUnique[k] = [v]
else:
modDictUnique[k].append(v)
sortedGroups = modDictUnique.keys()
sortedGroups.sort()
#print modItems
#print modDictUnique
n = tv.add_node(TreeViewLabel(text='Food', is_open=True))
for group in sortedGroups:
g = tv.add_node(TreeViewLabel(text='%s' % group), n)
for item in modDictUnique[group]:
tv.add_node(TreeViewButton(text='%s' % item), g)
class POSFMApp(App):
def build(self):
layout = GridLayout(cols=1, spacing=50, size_hint_y=None,width=800)
layout.bind(minimum_height=layout.setter('height'))
#for i in range(30):
# btn = Button(text=str(i), size=(480, 40),
# size_hint=(None, None))
# layout.add_widget(btn)
tv = TreeView(root_options=dict(text='Tree One'), hide_root=True, indent_level=4, minimum_height=5000)
populate_tree_view(tv)
layout.add_widget(tv)
root = ScrollView(size_hint=(None, None), size=(800, 700))
root.center = Window.center
root.add_widget(layout)
return root
if __name__ == '__main__':
POSFMApp().run()
In my actual app, modGroups and modItems are populated from an sqlite3 database, but this example presents the problem without having to mess around with sqlite3. I put in the (commented out) lines:
#for i in range(30):
# btn = Button(text=str(i), size=(480, 40),
# size_hint=(None, None))
# layout.add_widget(btn)
from this kivy ScrollView example to show that if I uncomment these lines and comment out the three lines about my TreeView
tv = TreeView(root_options=dict(text='Tree One'), hide_root=True, indent_level=4, minimum_height=5000)
populate_tree_view(tv)
layout.add_widget(tv)
Then I can get a working ScrollView with a scroll bar on the right as expected when I use my mouse's scroll wheel.
My best guess is that the TreeView doesn't tell the ScrollView how long it is vertically so the ScrollView doesn't realize it needs to scroll on the y-axis. That's just a guess, though.
How can I get a TreeView to work inside a ScrollView so I can scroll (especially on the y-axis) through my TreeView?

a) Using a GridLayout just for one child, pease don't. I'll asume that it's a left over from when/if you add more children to it.
b) Documentation of TreeView states that it has minimun_height property which indicates the minimum width/height needed to hold all it's children. The Treeview does not change it's height on it's own depending on the no of children. You should update (in this case) TreeViews height to it's minimum_height... tv.bind(minimum_height=tv.setter('height'))
c) taking into account the information provided in the points above, you can just do::
tv = TreeView(root_options=dict(text='Tree One'), hide_root=True, indent_level=4)
tv.size_hint = 1, None
tv.bind(minimum_height = tv.setter('height'))
populate_tree_view(tv)
root = ScrollView(pos = (0, 0))
root.add_widget(tv)
Here is the entire code including these changes so one can just copy and paste the code to a .py file and run it.
from kivy.uix.scrollview import ScrollView
from kivy.uix.gridlayout import GridLayout
from kivy.core.window import Window
from kivy.uix.widget import Widget
from kivy.uix.treeview import TreeView, TreeViewNode
from kivy.uix.treeview import TreeViewLabel
from kivy.app import App
from kivy.properties import ObjectProperty, StringProperty
from kivy.uix.button import Button
class TreeViewButton(Button, TreeViewNode):
pass
modGroups = [u'Fruit', u'Fruit', u'Meat', u'Dairy', u'Dairy', u'Fruit']
modItems = [u'Apple', u'Pear', u'Spam', u'Egg', u'Milk', u'Banana']
modDict = dict()
modDictUnique = dict()
def populate_tree_view(tv):
modDict = zip(modGroups, modItems)
print modGroups
print modItems
for k, v in modDict:
if k not in modDictUnique:
modDictUnique[k] = [v]
else:
modDictUnique[k].append(v)
sortedGroups = modDictUnique.keys()
sortedGroups.sort()
#print modItems
#print modDictUnique
n = tv.add_node(TreeViewLabel(text='Food', is_open=True))
for group in sortedGroups:
g = tv.add_node(TreeViewLabel(text='%s' % group), n)
for item in modDictUnique[group]:
tv.add_node(TreeViewButton(text='%s' % item), g)
class POSFMApp(App):
def build(self):
#for i in range(30):
# btn = Button(text=str(i), size=(480, 40),
# size_hint=(None, None))
# layout.add_widget(btn)
tv = TreeView(root_options=dict(text='Tree One'), hide_root=True, indent_level=4)
tv.size_hint = 1, None
tv.bind(minimum_height = tv.setter('height'))
populate_tree_view(tv)
root = ScrollView(pos = (0, 0))
root.add_widget(tv)
return root
if __name__ == '__main__':
POSFMApp().run()

Add hight to TreeView then it will scroll. Like this.
ScrollView:
id: kr_scroll
do_scroll_x: False
TreeView:
id: trvMenu
root_options: { 'text': 'Home', 'font_size': 15}
hide_root: False
indent_level: 4
size_hint_y: None
height: self.parent.height*2

Related

Kivy/MD - How do I place an icon to the right of a text list item (with code and image) ..?

I am trying to put an icon to the right hand side of a text list item, but this code below is giving me an error AttributeError: 'super' object has no attribute '__getattr__'
at this line: items.add_widget(icon).
Here's what I want it to look like:
List item with icon
Here's my code. It can be copied, and run as-is.
from kivy.lang import Builder
from kivy.uix.boxlayout import BoxLayout
from kivymd.app import MDApp
from kivymd.uix.button import MDFlatButton
from kivymd.uix.list import OneLineIconListItem, IconRightWidget, MDList
from kivymd.uix.dialog import MDDialog
KV = '''
<Content>
orientation: "vertical"
spacing: "12dp"
size_hint_y: None
height: "400dp"
ScrollView:
MDList:
id: Mcontainer
MDFloatLayout:
'''
class Content(BoxLayout):
pass
class Example(MDApp):
def on_start(self):
Mcontent=Content()
for x in range(0,7):
icon = IconRightWidget(icon="lock")
items = OneLineIconListItem(text="This is a test")
items.add_widget(icon)
Mcontent.ids.Mcontainer.add_widget(items)
self.MSetFileOptionsdialog = MDDialog(type="custom",content_cls=Mcontent,)
self.MSetFileOptionsdialog.open()
def build(self):
return Builder.load_string(KV)
Example().run()
from kivy.lang import Builder
from kivy.uix.boxlayout import BoxLayout
from kivymd.app import MDApp
from kivymd.uix.list import OneLineAvatarIconListItem
from kivymd.uix.dialog import MDDialog
KV = '''
<Item>
_txt_left_pad: "12dp"
IconRightWidget:
icon: root.icon
<Content>
orientation: "vertical"
spacing: "12dp"
size_hint_y: None
height: "400dp"
ScrollView:
MDList:
id: Mcontainer
MDFloatLayout:
'''
class Item(OneLineAvatarIconListItem):
icon = StringProperty()
class Content(BoxLayout):
pass
class Example(MDApp):
def on_start(self):
Mcontent = Content()
for x in range(0, 7):
items = Item(text="This is a test", icon="lock")
Mcontent.ids.Mcontainer.add_widget(items)
self.MSetFileOptionsdialog = MDDialog(type="custom", content_cls=Mcontent)
self.MSetFileOptionsdialog.open()
def build(self):
return Builder.load_string(KV)
Example().run()
When you want to add widget to an Id from your load_string or .kv file, you can just use the following; this is to be done in the .py file. There are limitations if screens are involved.
self.root.ids.name_of_the_id_referenced_container_widget_or_layout.add_widget(the one you already have in your.kv file)

Adding notebook tabs in tkinter - how do I do it with a class-based structure? (Python 2)

I want each tab to come from it's own class (classes are in their own files - I am just testing the first one for now).
Here is what I tried:
tab1.py
from Tkinter import *
import Tkinter as tk
class Tab(tk.Frame):
def __init__(self, master):
tk.Frame.__init__(self, master)
fr = Frame(self).pack()
Label(fr, text="one", bg='red', bd=2).pack()
Label(fr, text="two", bg='yellow', bd=2).pack()
if __name__ == '__main__':
root = Tk()
frame = Frame(root).pack()
Tab(frame)
Button(frame, text='only if class', command=root.destroy).pack()
mainloop()
noteBook.py
from Tkinter import *
from ttk import *
from tab1 import Tab
root = Tk()
note = Notebook(root)
main_frame = Frame(note)
button1 = Button(main_frame, text='test').pack()
#tab1 = Tab(note)
tab1 = Frame(note)
tab2 = Frame(note)
tab3 = Frame(note)
Tab(tab1)
Button(tab1, text='Exit', command=root.destroy).pack()
note.add(tab1, text = "Tab One", compound=TOP)
note.add(tab2, text = "Tab Two")
note.add(tab3, text = "Tab Three")
note.pack()
root.mainloop()
exit()
run with:
python2.7 noteBook.py
The problem is that the content of tab1.py does not appear within the first tab, it instead appears within the frame that contains the whole noteBook.
Also when running tab1.py directly with python2.7 noteBook.py I need it to behave properly meaning from what it has now it should show just the tab with an extra button from the if __name___... part.
I have come accros multiple examples but only found one that was what I want but it had no working solution and it was for python3 - I would like python2. python3 question with no working answer Thanks.
The problem is this line of code:
fr = Frame(self).pack()
When you do the above, fr is None because .pack() returns None (because x().y() returns the value of y()). Later, you do this:
Label(fr, text="one", bg='red', bd=2).pack()
Since fr is None, the label is created in the root window.
Unrelated to the problem, here's some advice: you are creating too many frames. You don't need fr inside of Tab, and you don't need tab1, tab2, or tab3
Here's all you need for Tab:
class Tab(tk.Frame):
def __init__(self, master):
tk.Frame.__init__(self, master, background="pink")
Label(self, text="one", bg='red', bd=2).pack()
Label(self, text="two", bg='yellow', bd=2).pack()
To add it to the notebook, you just need two lines:
tab1 = Tab(note)
note.add(tab1, text = "Tab One", compound=TOP)
This works perfectly and just for fun I've illustrated the populating of tabs 2 and 3 althought I just reused the same class for simplicity here. The goal was to be able to run the tabs directly to view them alone during developpement without having to run the whole thing every time.
noteBook.py
from Tkinter import *
from ttk import *
from tab1 import Tab
root = Tk()
note = Notebook(root)
main_frame = Frame(note)
button1 = Button(main_frame, text='test').pack()
tab1 = Frame(note)
tab2 = Frame(note)
tab3 = Frame(note)
Tab(tab1)
Tab(tab2)
Tab(tab3)
Button(tab1, text='Exit', command=root.destroy).pack()
note.add(tab1, text = "Tab One", compound=TOP)
note.add(tab2, text = "Tab Two")
note.add(tab3, text = "Tab Three")
note.pack()
root.mainloop()
exit()
tab1.py
import Tkinter as tk
class Tab(tk.Frame):
def __init__(self, parent_widget):
tk.Frame.__init__(self, parent_widget)
self.fr = tk.Frame(parent_widget, width=200, height=200, bg='pink', bd=2)
tk.Label(self.fr, text="one", bg='red', bd=2).pack()
tk.Label(self.fr, text="two", bg='yellow', bd=2).pack()
self.fr.pack() # this packing must be done after 2 above packings
if __name__ == '__main__':
root = tk.Tk() # the app window
main_frame = tk.Frame(root, height=200, width=200, bg='blue', bd=2) # main frame
Tab(main_frame) # instatiate Tab(), sending main_frame as the parent_widget
tk.Button(main_frame, text='only if class', command=root.destroy).pack()
main_frame.pack() # display main frame on window
tk.mainloop()

Thumbnailctrl size (trying to get it to fullscreen)

I've been trying to insert two Thubmnailctrl under a Multisplitter, I have managed to put them in there, but I can't manage to make them ocuppy the full space. On thumbnailctrl.py I've seen that on the the maximum size it can be is 350x280:
def SetThumbSize(self, width, height, border=6):
"""
Sets the thumbnail size as width, height and border.
:param `width`: the desired thumbnail width;
:param `height`: the desired thumbnail height;
:param `border`: the spacing between thumbnails.
"""
if width > 350 or height > 280:
return
self._tWidth = width
self._tHeight = height
self._tBorder = border
self.SetScrollRate((self._tWidth + self._tBorder)/4,
(self._tHeight + self._tBorder)/4)
self.SetSizeHints(self._tWidth + self._tBorder*2 + 16,
self._tHeight + self._tBorder*2 + 8)
But on the other hand on the demo under ThumbnailCtrl, it uses an Splitter to create a Thumbnailctrl as big as you want, so I don't know if I'm doing something wrong (maybe with Sizers) or is some feature from Splitter (totally diferent than multisplitter) that allows the Thumbnailctrl to occupy it's full space.
Thumbnailctrl + Splitter Demo:
import wx
import os
import sys
try:
dirName = os.path.dirname(os.path.abspath(__file__))
except:
dirName = os.path.dirname(os.path.abspath(sys.argv[0]))
sys.path.append(os.path.split(dirName)[0])
try:
from agw import thumbnailctrl as TC
except ImportError: # if it's not there locally, try the wxPython lib.
import wx.lib.agw.thumbnailctrl as TC
class MainFrame(wx.Frame):
def __init__(self, redirect=False, filename=None):
wx.Frame.__init__(self, None, title="Elephant")
# self.SetMenuBar(self.CreateMenuBar())
splitter = wx.SplitterWindow(self, -1, style=wx.CLIP_CHILDREN | wx.SP_3D | wx.WANTS_CHARS | wx.SP_LIVE_UPDATE)
self.panel = wx.Panel(splitter, -1)
sizer = wx.BoxSizer(wx.HORIZONTAL)
scroll = TC.ThumbnailCtrl(splitter, -1, imagehandler=TC.NativeImageHandler)
scroll.ShowFileNames()
if os.path.isdir("../bitmaps"):
scroll.ShowDir(os.path.normpath(os.getcwd() + "/../bitmaps"))
else:
scroll.ShowDir(os.getcwd())
self.TC = scroll
splitter.SplitVertically(scroll, self.panel, 180)
splitter.SetMinimumPaneSize(140)
self.SetMinSize((700, 590))
self.CenterOnScreen()
if __name__ == "__main__":
app = wx.App(False)
frame = MainFrame()
# import wx.lib.inspection
# wx.lib.inspection.InspectionTool().Show()
app.MainLoop()
My attempt at a Multisplitter with two thumbnails (and when that works a third panel with text and stuff):
import wx
import os
import cv2
import ctypes
from PIL import Image
from wx.lib.splitter import MultiSplitterWindow
try:
from agw import thumbnailctrl as TC
except ImportError: # if it's not there locally, try the wxPython lib.
import wx.lib.agw.thumbnailctrl as TC
class SamplePane(wx.Panel):
def __init__(self, parent):
wx.Panel.__init__(self, parent)
self.thumbnail11 = TC.ThumbnailCtrl(self, imagehandler=TC.NativeImageHandler, thumboutline=4)
self.thumbnail11.EnableDragging(True)
# self.thumbnail11.SetThumbSize(350, screensize[0] / 15, 25) # For images -> Max values 350,280
# ################VID################ #
topmostSizer = wx.BoxSizer(wx.VERTICAL)
topmostSizer.Add(self.thumbnail11, proportion=0, flag=wx.EXPAND)
self.SetSizer(topmostSizer)
self.MaxSize
# topmostSizer.Fit(self)
class MainFrame(wx.Frame):
""""""
def __init__(self):
"""Constructor"""
wx.Frame.__init__(self, None, title="Elephant")
splitter = MultiSplitterWindow(self, style=wx.SP_LIVE_UPDATE)
# t1Sizer = wx.BoxSizer(wx.VERTICAL)
# self.thumbnail11 = TC.ThumbnailCtrl(splitter, imagehandler=TC.NativeImageHandler, thumboutline=4)
panel = SamplePane(splitter)
splitter.AppendWindow(panel)
panel2 = SamplePane(splitter)
splitter.AppendWindow(panel2)
# t1Sizer.Add(panel, proportion=0, flag=wx.EXPAND)
self.Show()
if __name__ == "__main__":
app = wx.App(False)
frame = MainFrame()
# import wx.lib.inspection
# wx.lib.inspection.InspectionTool().Show()
app.MainLoop()
As you can see there are two thumbnails and they expand left to right, but they are capped at a maximum height.
Thanks a lot for the help!
Not 100% sure what it is that you're trying achieve with this but I suspect that your problem is with the topmostSizer's proportion attribute.
Try:
topmostSizer.Add(self.thumbnail11, proportion=1, flag=wx.EXPAND)
From the manual:
proportion - Although the meaning of this parameter is undefined in
wx.Sizer, it is used in wx.BoxSizer to indicate if a child of a sizer
can change its size in the main orientation of the wx.BoxSizer - where
0 stands for not changeable and a value of more than zero is
interpreted relative (a proportion of the total) to the value of other
children of the same wx.BoxSizer.
In this case, you have defined topmostSizer as VERTICAL

Click signal in Pyqt4

I have a list of buttons which is shown to the user according to a particular number which the user enters.For e.g. If the user enters 2 then only 2 buttons will be shown.
The code that does this is here:
def set(self):
global seismicAttributeCount,lineEditlist
seismicAttributeCount=int(self.ui.lineEdit_23.text())
mygroupbox = QtGui.QGroupBox()
myform = QtGui.QFormLayout()
labellist = []
buttonList= []
for i in range(seismicAttributeCount):
lineEditlist.append(QtGui.QLineEdit())
buttonList.append(QtGui.QPushButton('Browse Attribute %i'%(i+1)))
myform.addRow(lineEditlist[i],buttonList[i])
mygroupbox.setLayout(myform)
self.ui.scrollArea_12.setWidget(mygroupbox)
self.ui.scrollArea_12.setWidgetResizable(True)
for i in range(seismicAttributeCount):
if buttonList[i].clicked.connect():
print i
I want to get the index of the button clicked. Any help would be appreciated.
You probably want to look into functools.partial. This allows you to connect an event with a method and a particular input. I've made here a minimal example of a GUI that does what you want
from PyQt4 import QtGui, QtCore
import sys
import functools
class test(QtGui.QWidget):
def __init__(self,parent=None):
self.widget=QtGui.QWidget.__init__(self, parent)
# Button to add buttons
self.btnAdd = QtGui.QPushButton('Add')
self.btnAdd.connect(self.btnAdd, QtCore.SIGNAL('clicked()'), self.btnAddPressed)
# Line edit for number of buttons
self.qleN = QtGui.QLineEdit(str(0))
# List to keep track of buttons
self.buttons=[]
# Layout
self.hbox = QtGui.QHBoxLayout()
self.hbox.addWidget(self.btnAdd)
self.hbox.addWidget(self.qleN)
self.setLayout(self.hbox)
self.show()
def btnAddPressed(self):
"""Adds number of buttons."""
# Get number of buttons to add
n=int(self.qleN.text())
self.buttons=[]
for i in range(n):
# Create new button
newBtn = QtGui.QPushButton(str(i))
self.buttons.append(newBtn)
# Connect
newBtn.clicked.connect(functools.partial(self.btnPressed,i))
self.hbox.addWidget(newBtn)
def btnPressed(self,idx):
"""Returns idx of btn."""
print idx
return idx
def main():
#Creating application
app = QtGui.QApplication(sys.argv)
main_win = test()
sys.exit(app.exec_())
if __name__ == '__main__':
main()
Note how I connect the button with a functools call and the index of the button.
By the way, next time, please make the effort and format your question properly.

how to display a form within a frame using python and tkinter

I have created a notebook(file1.py) using python and tkinter. This notebook has three tabs A,B,C. I have another python file(file2.py) which contains few text fields. Now I am looking for a way to display the contents of the other file2.py within the tab A which is in file1.py.The following is the code I used in file1.py
import tkinter as tk
import tkinter.ttk as ttk
root = tk.Tk()
# use width x height + x_offset + y_offset (no spaces!)
root.geometry("%dx%d+%d+%d" % (300, 200, 100, 50))
root.title('test the ttk.Notebook')
nb = ttk.Notebook(root)
nb.pack(fill='both', expand='yes')
# create a child frame for each page
f1 = tk.Frame(bg='red')
f2 = tk.Frame(bg='blue')
f3 = tk.Frame(bg='green')
# create the pages
nb.add(f1, text='A')
nb.add(f2, text='B')
nb.add(f3, text='C')
# put a button widget on child frame f1 on page1
btn1 = tk.Button(f1, text='button1')
btn1.pack(side='left', anchor='nw', padx=3, pady=5)
root.mainloop()
File2.py
import sys
from PyQt4 import Qt
from taurus.qt.qtgui.application import TaurusApplication
app = TaurusApplication(sys.argv)
panel = Qt.QWidget()
layout = Qt.QHBoxLayout()
panel.setLayout(layout)
from taurus.qt.qtgui.panel import TaurusForm
panel = TaurusForm()
model = [ 'test/i1/1/%s' % p for p in props ]
panel.setModel(model)
panel.show()
sys.exit(app.exec_())
I am new to using tkinter and python so could you let me know how I could achieve it. Also in the other file(file2.py) I have few import statements like 'import sys" etc.Thanks.
You cannot mix those two files. One uses Tkinter, one uses PyQT. Those two libraries are incompatible with each other.