import tkinter as tk
from PIL import Image, ImageDraw, ImageTk
import numpy as np
import random
class TransparentChartApp:
def __init__(self, root, jpg_path):
self.root = root
self.root.title("现代风格控制面板")
self.root.geometry("1600x800") # 初始窗口大小
# 先创建背景标签
self.bg_label = tk.Label(self.root)
self.bg_label.place(x=0, y=0, relwidth=1, relheight=1)
# 加载JPG图片
try:
self.original_image = Image.open(jpg_path)
# 生成模拟数据
self.generate_data()
# 创建UI元素
self.create_ui()
# 更新背景
self.update_background()
except Exception as e:
# 如果加载失败，使用纯色背景
self.bg_label.configure(bg="gray", text=f"无法加载图片: {e}")
return
# 绑定窗口大小变化事件
self.root.bind("<Configure>", self.on_resize)
def generate_data(self):
"""生成模拟数据 - 增加更多数据点"""
self.data_points = []
# 生成50个数据点
for i in range(50):
# 添加一些随机波动，使折线更自然
base_value = 100 + 50 * np.sin(i / 5)
self.data_points.append(base_value + random.randint(-15, 15))
# 创建标签 - 更简洁的标签
self.labels = [f"{i+1}" for i in range(0, 50, 5)] # 每5个点一个标签
def create_ui(self):
"""创建UI元素 - 更现代的界面"""
# 创建左侧控制面板框架
self.left_control_frame = tk.Frame(self.root, bg="#283040", bd=0)
self.left_control_frame.place(x=20, y=20, width=200, height=220)
# 添加左侧面板按钮
left_btn = tk.Button(self.left_control_frame, text="左侧按钮",
bg="#4FC3F7", fg="white", relief=tk.FLAT,
font=("Segoe UI", 9), padx=20, pady=5)
left_btn.pack(pady=10)
# 创建按钮面板框架
self.top_left_frame = tk.Frame(self.root, bg="#323241", bd=0) # 使用与背景更匹配的颜色
# 添加标题
top_title = tk.Label(self.top_left_frame, text="信息面板",
font=("Segoe UI", 11, "bold"), fg="white", bg="#323241")
top_title.pack(pady=(10, 5)) # 上边距10，下边距5
# 创建框架容纳按钮，以便更好地控制间距
self.button_container = tk.Frame(self.top_left_frame, bg="#323241")
self.button_container.pack(fill=tk.BOTH, expand=True, padx=10, pady=5)
# 按钮样式 - 使用更明显的蓝色
button_style = {
"bg": "#3498db", # 更亮的蓝色
"fg": "white",
"relief": tk.FLAT,
"font": ("Segoe UI", 9),
"padx": 10,
"pady": 6,
"activebackground": "#2980b9", # 激活时颜色
"highlightthickness": 0, # 移除高亮边框
"border": 0, # 移除边框
"anchor": "w" # 文本左对齐
}
# 添加四个垂直排列的按钮
buttons = [
("总体信息", self.show_general_info),
("LMU信息", self.show_lmu_info),
("CPU信息", self.show_cpu_info),
("任务信息", self.show_task_info)
]
for text, command in buttons:
# 使用Frame包裹按钮以实现更好的间距控制
btn_frame = tk.Frame(self.button_container, bg="#323241", height=35) # 固定高度
btn_frame.pack(fill=tk.X, pady=(0, 5)) # 按钮之间的垂直间距
btn = tk.Button(btn_frame, text=text, **button_style, command=command)
btn.pack(fill=tk.X, expand=True)
# 添加悬停效果
btn.bind("<Enter>", lambda e, b=btn: b.config(bg="#2980b9"))
btn.bind("<Leave>", lambda e, b=btn: b.config(bg="#3498db"))
def show_general_info(self):
"""显示总体信息"""
print("显示总体信息")
def show_lmu_info(self):
"""显示LMU信息"""
print("显示LMU信息")
def show_cpu_info(self):
"""显示CPU信息"""
print("显示CPU信息")
def show_task_info(self):
"""显示任务信息"""
print("显示任务信息")
def draw_transparent_chart(self, img):
"""在背景图片上绘制半透明左侧栏和右侧栏"""
# 创建RGBA图层用于绘制透明元素
overlay = Image.new('RGBA', img.size, (0, 0, 0, 0))
draw = ImageDraw.Draw(overlay)
# 在左侧添加半透明矩形区域
rect_width = img.width * 0.17 # 矩形宽度为窗口宽度的17%
rect_height = img.height # 矩形高度为整个窗口高度
# 左侧矩形
left_rect_x = 0
left_rect_y = 0
draw.rectangle(
[(left_rect_x, left_rect_y), (left_rect_x + rect_width, left_rect_y + rect_height)],
fill=(40, 40, 50, 180) # 半透明深蓝色
)
# 2. 在右侧添加相同的半透明矩形区域
right_rect_x = img.width - rect_width
right_rect_y = 0
draw.rectangle(
[(right_rect_x, right_rect_y), (right_rect_x + rect_width, right_rect_y + rect_height)],
fill=(50, 40, 40, 180) # 半透明深红色，与左侧区分
)
# 添加标题文字
try:
# 尝试使用系统字体
from PIL import ImageFont
font = ImageFont.truetype("arial", 24)
except ImportError:
font = None
# 添加标题文字
draw.text((img.width/2, 50),
"INFO",
fill=(255, 255, 255, 230),
anchor="mt",
font=font,
stroke_width=1,
stroke_fill=(0, 0, 0, 100))
# 合并图层
return Image.alpha_composite(img.convert('RGBA'), overlay).convert('RGB')
def update_background(self):
"""更新背景图片以适应窗口大小"""
if not hasattr(self, 'original_image'):
return
# 获取当前窗口尺寸
width = self.root.winfo_width()
height = self.root.winfo_height()
if width < 10 or height < 10: # 防止过小尺寸
return
# 调整图片大小以适应窗口
resized_img = self.original_image.resize(
(width, height),
Image.Resampling.LANCZOS
)
# 在调整后的图片上绘制半透明区域
chart_img = self.draw_transparent_chart(resized_img)
# 转换为Tkinter可用的格式
self.bg_photo = ImageTk.PhotoImage(chart_img)
# 更新背景标签
self.bg_label.configure(image=self.bg_photo)
# 更新按钮面板的位置和大小
if width > 100 and height > 100: # 确保窗口足够大
rect_width = width * 0.17
top_left_x = rect_width * 0
top_left_y = height * 0
top_left_width = rect_width * 1
top_left_height = height * 0.25 # 增加高度以容纳按钮
# 设置按钮面板的位置和大小
self.top_left_frame.place(
x=top_left_x,
y=top_left_y,
width=top_left_width,
height=top_left_height
)
def on_resize(self, event):
"""当窗口大小改变时更新背景"""
if event.widget == self.root: # 确保是主窗口的大小改变
self.update_background()
if __name__ == "__main__":
# 替换为您自己的JPG文件路径
jpg_path = "e:/Python_test/technology.jpg" # 请确保此路径正确
root = tk.Tk()
app = TransparentChartApp(root, jpg_path)
root.mainloop()该代码左上角应该是有两个面板，现在保留按钮面板，去掉另一个面板，怎么修改，写出完整修改代码
最新发布
本文详细介绍了ON_CONTROL_RANGE宏的使用方法及参数说明。该宏用于将一系列连续的控件ID映射到单一的消息处理函数中，适用于指定的Windows通知消息如BN_CLICKED等。文章通过示例展示了如何定义宏来响应特定范围内控件ID的通知代码。
扫一扫
2413
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
