Ткинтер, создай кадр с полосой прокрутки, получи сериал arduino

Question

Я хочу создать рамку в определенной части моего приложения, где будет отображаться последовательный вход, поступающий от моего arduino, вместе с полосой прокрутки для прокрутки вверх.

В идеале, я хотел бы функциональность Autoscroll. По сути, я хочу заменить arduino IDE для получения последовательных данных своей собственной программой.

Я уверен, что кто-то уже сделал это, поэтому я публикую здесь несколько указателей.

Я уже создал основное окно tkinter c, которое положит начало моему приложению.

Это мой код (функциональность неполная - только графика):

import tkinter as tk
import tkinter.ttk as ttk
import serial.tools.list_ports


#to be used on our canvas
HEIGHT = 700
WIDTH = 800

# --- functions ---
def serial_ports():    
    return serial.tools.list_ports.comports()

def on_select(event=None):

    # get selection from event    
    print("event.widget:", event.widget.get())

    # or get selection directly from combobox
    print("comboboxes: ", cb.get())

def single_Sensor():    
    clicked_new = int(clicked)
# --- functions ---



# --- main ---
root = tk.Tk() #here we create our tkinter window
root.title("Sensor Interface")

#we use canvas as a placeholder, to get our initial screen size (we have defined HEIGHT and WIDTH)
canvas = tk.Canvas(root, height=HEIGHT, width=WIDTH)
canvas.pack()

#we use frames to organize all the widgets in the screen

# --- frame 1 ---
frame1 = tk.Frame(root)
frame1.place(relx=0, rely=0.05, relheight=0.03, relwidth=1, anchor='nw') #we use relheight and relwidth to fill whatever the parent is - in this case- root

label0 = tk.Label(frame1, text="Select the COM port that the device is plugged in: ")
label0.config(font=("TkDefaultFont", 8))
label0.place(relx = 0.1, rely=0.3, relwidth=0.3, relheight=0.5)


cb = ttk.Combobox(frame1, values=serial_ports())
cb.place(relx=0.5, rely=0.5, anchor='center')
# assign function to combobox
cb.bind('<<ComboboxSelected>>', on_select)
# --- frame 1 ---



# --- frame 2 ---
frame2 = tk.Frame(root, bd=5) #REMOVED THIS bg='#80c1ff' (i used it to see the borders of the frame)
frame2.place(relx=0, rely=0.1, relheight=0.07, relwidth=1, anchor='nw')

#button
button = tk.Button(frame2, text="Measure all Sensors", bg='#80c1ff', fg='red')  #bg='gray'
button.place(relx=0.2, rely=0.5, anchor='center')

#label
label1 = tk.Label(frame2, text="OR, select a single sensor to measure: ")
label1.config(font=("TkDefaultFont", 9))
label1.place(relx = 0.32, rely=0.3, relwidth=0.3, relheight=0.4)

#dropdown
OPTIONS = [0,1,2,3,4,5,6,7]
clicked = tk.StringVar()
clicked.set(OPTIONS[0]) # default value
drop = tk.OptionMenu(frame2, clicked, *OPTIONS)
drop.place(relx = 0.65, rely=0.25, relwidth=0.08, relheight=0.6)

dropDownButton = tk.Button(frame2, text="Measure this sensor", bg='#80c1ff', fg='red', command=single_Sensor) #bg='gray'
dropDownButton.place(relx = 0.85, rely=0.5, anchor='center')
# --- frame 2 ---



# --- frame 3 ---
frame3 = tk.Frame(root, bd=5) #REMOVED THIS bg='#80c1ff' (i used it to see the borders of the frame)
frame3.place(relx=0, rely=0.2, relheight=0.07, relwidth=1, anchor='nw')

stop_button = tk.Button(frame3, text="STOP measurement(s)", bg='#80c1ff', fg='red')
stop_button.place(relx=0.5, rely=0.5, anchor='center')
# --- frame 3 ---



# --- frame 4 ---
frame4 = tk.Frame(root, bd=5)
frame4.place(relx=0, rely=0.3, relheight=0.09, relwidth=1, anchor='nw')

label2 = tk.Label(frame4, text="Select a sensor to plot data: ")
label2.place(relx = 0.1, rely=0.3, relwidth=0.3, relheight=0.5)

clickedForPlotting = tk.StringVar()
clickedForPlotting.set(OPTIONS[0]) # default value
dropPlot = tk.OptionMenu(frame4, clickedForPlotting, *OPTIONS)
dropPlot.place(relx=0.5, rely=0.5, anchor='center')

dropDownButton = tk.Button(frame4, text="Plot sensor data", bg='#80c1ff', fg='red', command=single_Sensor) #bg='gray'
dropDownButton.place(relx = 0.85, rely=0.5, anchor='center')
# --- frame 4 ---


root.mainloop() #here we run our app
# --- main ---

И это то, что я получаю:

Как вы видите, там много места внизу, где рамка с прокруткой бар где быть. здесь появится серийный текст arduino.

Answer 1

Я недавно построил нечто подобное в управляющей программе для своего робота. Вот некоторые фрагменты того, что я сделал:

Я создал фрейм и полосу прокрутки (self является фреймом, наследующим класс):

self.logFrame = tk.Frame(self, **SharedDiscoBot.frameConfig)
self.scrollbar = tk.Scrollbar(self.logFrame)
self.scrollbar.pack(side=tk.RIGHT, fill=tk.Y)
self.log = tk.Text(self.logFrame, width=60, height=10, padx=5, pady=5, takefocus=0, yscrollcommand=self.scrollbar.set, **SharedDiscoBot.textboxConfig)
self.scrollbar.config(command=self.log.yview)
self.log.pack()    
self.logFrame.pack(side=tk.TOP)

У меня также есть объект tk IntVar для установки автопрокрутка и флажок, который устанавливает его.

self.autoscroll = tk.IntVar()
self.asCheck = tk.Checkbutton(self.checkFrame, variable=self.autoscroll, text='Auto-Scroll   ', **SharedDiscoBot.checkboxConfig)
self.asCheck.select()

А затем моя программа считывает последовательные данные и либо анализирует их, либо передает их этой функции для отображения в этой текстовой области.

 def redirect(self, aString):
        self.log.insert(tk.END, str(aString))
        if self.autoscroll.get() == 1:
            self.log.see(tk.END)        
        return

Если вы хотите увидеть остальную часть этого кода, это часть этого проекта на моем github. https://github.com/delta-G/DiscoBot Специально: https://github.com/delta-G/DiscoBot/blob/master/GUI/TermFrame.py