mirror of
https://github.com/TomSchimansky/CustomTkinter.git
synced 2023-08-10 21:13:13 +03:00
improved CTkProgressBar rendering
This commit is contained in:
parent
ab1dafc20c
commit
47f7c3189f
@ -132,6 +132,12 @@ class CTkEntry(tkinter.Frame):
|
|||||||
self.entry.configure(fg=self.text_color,
|
self.entry.configure(fg=self.text_color,
|
||||||
insertbackground=self.text_color)
|
insertbackground=self.text_color)
|
||||||
|
|
||||||
|
def config(self, *args, **kwargs):
|
||||||
|
self.configure(*args, **kwargs)
|
||||||
|
|
||||||
|
def configure(self, *args, **kwargs):
|
||||||
|
super().configure(*args, **kwargs)
|
||||||
|
|
||||||
def change_appearance_mode(self, mode_string):
|
def change_appearance_mode(self, mode_string):
|
||||||
if mode_string.lower() == "dark":
|
if mode_string.lower() == "dark":
|
||||||
self.appearance_mode = 1
|
self.appearance_mode = 1
|
||||||
|
@ -44,9 +44,9 @@ class CTkLabel(tkinter.Frame):
|
|||||||
if sys.platform == "darwin": # macOS
|
if sys.platform == "darwin": # macOS
|
||||||
self.text_font = ("Avenir", 13)
|
self.text_font = ("Avenir", 13)
|
||||||
elif "win" in sys.platform: # Windows
|
elif "win" in sys.platform: # Windows
|
||||||
self.text_font = ("Century Gothic", 11)
|
self.text_font = ("Century Gothic", 10)
|
||||||
else:
|
else:
|
||||||
self.text_font = ("TkDefaultFont", 11)
|
self.text_font = ("TkDefaultFont", 10)
|
||||||
else:
|
else:
|
||||||
self.text_font = text_font
|
self.text_font = text_font
|
||||||
self.configure(width=self.width, height=self.height)
|
self.configure(width=self.width, height=self.height)
|
||||||
@ -143,17 +143,8 @@ class CTkLabel(tkinter.Frame):
|
|||||||
else:
|
else:
|
||||||
self.text_label.configure(bg=self.fg_color)
|
self.text_label.configure(bg=self.fg_color)
|
||||||
|
|
||||||
def configure_color(self, bg_color=None, fg_color=None, text_color=None):
|
def config(self, *args, **kwargs):
|
||||||
if bg_color is not None:
|
self.configure(*args, **kwargs)
|
||||||
self.bg_color = bg_color
|
|
||||||
|
|
||||||
if fg_color is not None:
|
|
||||||
self.fg_color = fg_color
|
|
||||||
|
|
||||||
if text_color is not None:
|
|
||||||
self.text_color = text_color
|
|
||||||
|
|
||||||
self.draw()
|
|
||||||
|
|
||||||
def configure(self, *args, **kwargs):
|
def configure(self, *args, **kwargs):
|
||||||
require_redraw = False # some attribute changes require a call of self.draw() at the end
|
require_redraw = False # some attribute changes require a call of self.draw() at the end
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
|
import sys
|
||||||
import tkinter
|
import tkinter
|
||||||
|
|
||||||
from .customtkinter_frame import CTkFrame
|
from .customtkinter_frame import CTkFrame
|
||||||
@ -46,52 +47,146 @@ class CTkProgressBar(tkinter.Frame):
|
|||||||
|
|
||||||
self.draw()
|
self.draw()
|
||||||
|
|
||||||
|
# set progress
|
||||||
|
self.set(self.value)
|
||||||
|
|
||||||
def detect_color_of_master(self):
|
def detect_color_of_master(self):
|
||||||
if isinstance(self.master, CTkFrame):
|
if isinstance(self.master, CTkFrame):
|
||||||
return self.master.fg_color
|
return self.master.fg_color
|
||||||
else:
|
else:
|
||||||
return self.master.cget("bg")
|
return self.master.cget("bg")
|
||||||
|
|
||||||
def draw(self):
|
def draw(self, no_color_updates=False):
|
||||||
self.canvas.delete("all")
|
|
||||||
self.border_parts = []
|
# decide the drawing method
|
||||||
self.fg_parts = []
|
if sys.platform == "darwin":
|
||||||
self.progress_parts = []
|
# on macOS draw button with polygons (positions are more accurate, macOS has Antialiasing)
|
||||||
|
self.draw_with_polygon_shapes()
|
||||||
|
else:
|
||||||
|
# on Windows and other draw with ovals (corner_radius can be optimised to look better than with polygons)
|
||||||
|
self.draw_with_ovals_and_rects()
|
||||||
|
|
||||||
|
if no_color_updates is False:
|
||||||
|
self.canvas.configure(bg=CTkColorManager.single_color(self.bg_color, self.appearance_mode))
|
||||||
|
self.canvas.itemconfig("border_parts", fill=CTkColorManager.single_color(self.border_color, self.appearance_mode))
|
||||||
|
self.canvas.itemconfig("inner_parts", fill=CTkColorManager.single_color(self.fg_color, self.appearance_mode))
|
||||||
|
self.canvas.itemconfig("progress_parts", fill=CTkColorManager.single_color(self.progress_color, self.appearance_mode))
|
||||||
|
|
||||||
|
def draw_with_polygon_shapes(self):
|
||||||
|
""" draw the progress bar parts with just three polygons that have a rounded border """
|
||||||
|
|
||||||
|
coordinate_shift = -1
|
||||||
|
width_reduced = -1
|
||||||
|
|
||||||
|
# create border button parts (only if border exists)
|
||||||
|
if self.border_width > 0:
|
||||||
|
if not self.canvas.find_withtag("border_parts"):
|
||||||
|
self.canvas.create_line((0, 0, 0, 0), tags=("border_line_1", "border_parts"))
|
||||||
|
|
||||||
|
self.canvas.coords("border_line_1",
|
||||||
|
(self.height / 2,
|
||||||
|
self.height / 2,
|
||||||
|
self.width - self.height / 2 + coordinate_shift,
|
||||||
|
self.height / 2))
|
||||||
|
self.canvas.itemconfig("border_line_1",
|
||||||
|
capstyle=tkinter.ROUND,
|
||||||
|
width=self.height + width_reduced)
|
||||||
|
|
||||||
|
# create inner button parts
|
||||||
|
if not self.canvas.find_withtag("inner_parts"):
|
||||||
|
self.canvas.create_line((0, 0, 0, 0), tags=("inner_line_1", "inner_parts"))
|
||||||
|
|
||||||
|
self.canvas.coords("inner_line_1",
|
||||||
|
(self.height / 2,
|
||||||
|
self.height / 2,
|
||||||
|
self.width - self.height / 2 + coordinate_shift,
|
||||||
|
self.height / 2))
|
||||||
|
self.canvas.itemconfig("inner_line_1",
|
||||||
|
capstyle=tkinter.ROUND,
|
||||||
|
width=self.height - self.border_width * 2 + width_reduced)
|
||||||
|
|
||||||
|
# progress parts
|
||||||
|
if not self.canvas.find_withtag("progress_parts"):
|
||||||
|
self.canvas.create_line((0, 0, 0, 0), tags=("progress_line_1", "progress_parts"))
|
||||||
|
|
||||||
|
self.canvas.coords("progress_line_1",
|
||||||
|
(self.height / 2,
|
||||||
|
self.height / 2,
|
||||||
|
self.height / 2 + (self.width + coordinate_shift - self.height) * self.value,
|
||||||
|
self.height / 2))
|
||||||
|
self.canvas.itemconfig("progress_line_1",
|
||||||
|
capstyle=tkinter.ROUND,
|
||||||
|
width=self.height - self.border_width * 2 + width_reduced)
|
||||||
|
|
||||||
|
def draw_with_ovals_and_rects(self):
|
||||||
|
""" draw the progress bar parts with ovals and rectangles """
|
||||||
|
|
||||||
|
if sys.platform == "darwin":
|
||||||
|
oval_bottom_right_shift = 0
|
||||||
|
rect_bottom_right_shift = 0
|
||||||
|
else:
|
||||||
|
# ovals and rects are always rendered too large on Windows and need to be made smaller by -1
|
||||||
|
oval_bottom_right_shift = -1
|
||||||
|
rect_bottom_right_shift = -1
|
||||||
|
|
||||||
# frame_border
|
# frame_border
|
||||||
self.border_parts.append(self.canvas.create_oval(0, 0,
|
if self.border_width > 0:
|
||||||
self.height, self.height))
|
if not self.canvas.find_withtag("border_parts"):
|
||||||
self.border_parts.append(self.canvas.create_rectangle(self.height/2, 0,
|
self.canvas.create_oval((0, 0, 0, 0), tags=("border_oval_1", "border_parts"), width=0)
|
||||||
self.width-(self.height/2), self.height))
|
self.canvas.create_rectangle((0, 0, 0, 0), tags=("border_rect_1", "border_parts"), width=0)
|
||||||
self.border_parts.append(self.canvas.create_oval(self.width-self.height, 0,
|
self.canvas.create_oval((0, 0, 0, 0), tags=("border_oval_2", "border_parts"), width=0)
|
||||||
self.width, self.height))
|
|
||||||
|
self.canvas.coords("border_oval_1", (0,
|
||||||
|
0,
|
||||||
|
self.height + oval_bottom_right_shift,
|
||||||
|
self.height + oval_bottom_right_shift))
|
||||||
|
self.canvas.coords("border_rect_1", (self.height/2,
|
||||||
|
0,
|
||||||
|
self.width-(self.height/2) + rect_bottom_right_shift,
|
||||||
|
self.height + rect_bottom_right_shift))
|
||||||
|
self.canvas.coords("border_oval_2", (self.width-self.height,
|
||||||
|
0,
|
||||||
|
self.width + oval_bottom_right_shift,
|
||||||
|
self.height + oval_bottom_right_shift))
|
||||||
|
|
||||||
# foreground
|
# foreground
|
||||||
self.fg_parts.append(self.canvas.create_oval(self.border_width, self.border_width,
|
if not self.canvas.find_withtag("inner_parts"):
|
||||||
self.height-self.border_width, self.height-self.border_width))
|
self.canvas.create_oval((0, 0, 0, 0), tags=("inner_oval_1", "inner_parts"), width=0)
|
||||||
self.fg_parts.append(self.canvas.create_rectangle(self.height/2, self.border_width,
|
self.canvas.create_rectangle((0, 0, 0, 0), tags=("inner_rect_1", "inner_parts"), width=0)
|
||||||
self.width-(self.height/2), self.height-self.border_width))
|
self.canvas.create_oval((0, 0, 0, 0), tags=("inner_oval_2", "inner_parts"), width=0)
|
||||||
self.fg_parts.append(self.canvas.create_oval(self.width-self.height+self.border_width, self.border_width,
|
|
||||||
self.width-self.border_width, self.height-self.border_width))
|
|
||||||
|
|
||||||
if type(self.bg_color) == tuple:
|
self.canvas.coords("inner_oval_1", (self.border_width,
|
||||||
self.canvas.configure(bg=self.bg_color[self.appearance_mode])
|
self.border_width,
|
||||||
else:
|
self.height-self.border_width + oval_bottom_right_shift,
|
||||||
self.canvas.configure(bg=self.bg_color)
|
self.height-self.border_width + oval_bottom_right_shift))
|
||||||
|
self.canvas.coords("inner_rect_1", (self.height/2,
|
||||||
|
self.border_width,
|
||||||
|
self.width-(self.height/2 + rect_bottom_right_shift),
|
||||||
|
self.height-self.border_width + rect_bottom_right_shift))
|
||||||
|
self.canvas.coords("inner_oval_2", (self.width-self.height+self.border_width,
|
||||||
|
self.border_width,
|
||||||
|
self.width-self.border_width + oval_bottom_right_shift,
|
||||||
|
self.height-self.border_width + oval_bottom_right_shift))
|
||||||
|
|
||||||
for part in self.border_parts:
|
# progress parts
|
||||||
if type(self.border_color) == tuple:
|
if not self.canvas.find_withtag("progress_parts"):
|
||||||
self.canvas.itemconfig(part, fill=self.border_color[self.appearance_mode], width=0)
|
self.canvas.create_oval((0, 0, 0, 0), tags=("progress_oval_1", "progress_parts"), width=0)
|
||||||
else:
|
self.canvas.create_rectangle((0, 0, 0, 0), tags=("progress_rect_1", "progress_parts"), width=0)
|
||||||
self.canvas.itemconfig(part, fill=self.border_color, width=0)
|
self.canvas.create_oval((0, 0, 0, 0), tags=("progress_oval_2", "progress_parts"), width=0)
|
||||||
|
|
||||||
for part in self.fg_parts:
|
self.canvas.coords("progress_oval_1", (self.border_width,
|
||||||
if type(self.fg_color) == tuple:
|
self.border_width,
|
||||||
self.canvas.itemconfig(part, fill=self.fg_color[self.appearance_mode], width=0)
|
self.height - self.border_width + oval_bottom_right_shift,
|
||||||
else:
|
self.height - self.border_width + oval_bottom_right_shift))
|
||||||
self.canvas.itemconfig(part, fill=self.fg_color, width=0)
|
self.canvas.coords("progress_rect_1", (self.height / 2,
|
||||||
|
self.border_width,
|
||||||
self.set(self.value)
|
self.height / 2 + (self.width - self.height) * self.value + rect_bottom_right_shift,
|
||||||
|
self.height - self.border_width + rect_bottom_right_shift))
|
||||||
|
self.canvas.coords("progress_oval_2",
|
||||||
|
(self.height / 2 + (self.width - self.height) * self.value - self.height / 2 + self.border_width,
|
||||||
|
self.border_width,
|
||||||
|
self.height / 2 + (self.width - self.height) * self.value + self.height / 2 - self.border_width + oval_bottom_right_shift,
|
||||||
|
self.height - self.border_width + oval_bottom_right_shift))
|
||||||
|
|
||||||
def set(self, value):
|
def set(self, value):
|
||||||
self.value = value
|
self.value = value
|
||||||
@ -101,33 +196,7 @@ class CTkProgressBar(tkinter.Frame):
|
|||||||
elif self.value < 0:
|
elif self.value < 0:
|
||||||
self.value = 0
|
self.value = 0
|
||||||
|
|
||||||
for part in self.progress_parts:
|
self.draw(no_color_updates=True)
|
||||||
self.canvas.delete(part)
|
|
||||||
|
|
||||||
# progress
|
|
||||||
self.progress_parts.append(self.canvas.create_oval(self.border_width,
|
|
||||||
self.border_width,
|
|
||||||
self.height - self.border_width,
|
|
||||||
self.height - self.border_width))
|
|
||||||
|
|
||||||
self.progress_parts.append(self.canvas.create_rectangle(self.height / 2,
|
|
||||||
self.border_width,
|
|
||||||
self.height / 2 + (self.width - self.height) * self.value,
|
|
||||||
self.height - self.border_width))
|
|
||||||
|
|
||||||
self.progress_parts.append(self.canvas.create_oval(self.height / 2 + (self.width - self.height) * self.value - (self.height) / 2 + self.border_width,
|
|
||||||
self.border_width,
|
|
||||||
self.height / 2 + (self.width - self.height) * self.value + (self.height) / 2 - self.border_width,
|
|
||||||
self.height - self.border_width))
|
|
||||||
|
|
||||||
for part in self.progress_parts:
|
|
||||||
if type(self.progress_color) == tuple:
|
|
||||||
self.canvas.itemconfig(part, fill=self.progress_color[self.appearance_mode], width=0)
|
|
||||||
else:
|
|
||||||
self.canvas.itemconfig(part, fill=self.progress_color, width=0)
|
|
||||||
|
|
||||||
self.canvas.update()
|
|
||||||
self.canvas.update_idletasks()
|
|
||||||
|
|
||||||
def change_appearance_mode(self, mode_string):
|
def change_appearance_mode(self, mode_string):
|
||||||
if mode_string.lower() == "dark":
|
if mode_string.lower() == "dark":
|
||||||
|
@ -107,7 +107,7 @@ class CTkSlider(tkinter.Frame):
|
|||||||
for part in self.button_parts:
|
for part in self.button_parts:
|
||||||
self.canvas.itemconfig(part, fill=CTkColorManager.single_color(self.button_color, self.appearance_mode), width=0)
|
self.canvas.itemconfig(part, fill=CTkColorManager.single_color(self.button_color, self.appearance_mode), width=0)
|
||||||
|
|
||||||
def clicked(self, event=0):
|
def clicked(self, event=None):
|
||||||
self.value = event.x / self.width
|
self.value = event.x / self.width
|
||||||
|
|
||||||
if self.value > 1:
|
if self.value > 1:
|
||||||
|
@ -90,8 +90,10 @@ class App(tkinter.Tk):
|
|||||||
|
|
||||||
self.progressbar = customtkinter.CTkProgressBar(master=self.frame_info,
|
self.progressbar = customtkinter.CTkProgressBar(master=self.frame_info,
|
||||||
width=250,
|
width=250,
|
||||||
height=15,
|
height=16,
|
||||||
border_width=0)
|
border_color="gray10",
|
||||||
|
progress_color="green",
|
||||||
|
border_width=2)
|
||||||
self.progressbar.place(relx=0.5, rely=0.85, anchor=tkinter.S)
|
self.progressbar.place(relx=0.5, rely=0.85, anchor=tkinter.S)
|
||||||
|
|
||||||
# ============ frame_right <- ============
|
# ============ frame_right <- ============
|
||||||
@ -142,7 +144,7 @@ class App(tkinter.Tk):
|
|||||||
corner_radius=8)
|
corner_radius=8)
|
||||||
self.button_5.place(relx=0.66, rely=0.92, anchor=tkinter.CENTER)
|
self.button_5.place(relx=0.66, rely=0.92, anchor=tkinter.CENTER)
|
||||||
|
|
||||||
self.progressbar.set(0.65)
|
#self.progressbar.set(0.65)
|
||||||
|
|
||||||
def button_event(self):
|
def button_event(self):
|
||||||
print("Button pressed")
|
print("Button pressed")
|
||||||
|
Loading…
x
Reference in New Issue
Block a user