tkinter-TinUI-xml实战(11)多功能TinUIxml编辑器

news2025/3/3 18:19:47

引言

在TinUIXml简易编辑器中,我们通过TinUI搭建了一个简易的针对TinUIXml布局的编辑器,基本掌握了TinUIXml布局和TinUIXml的导入与导出。现在,就在此基础上,对编辑器进行升级。

本次升级的功能:

  1. 更合理的xml编辑与UI展示布局,python代码导出放到另一个子窗口
  2. python代码使用语法高亮显示
  3. 在UI展示中,允许打开鼠标十字线坐标定位
  4. 允许右键单击创建标记坐标点,并能够通过坐标点管理窗口来操作坐标点

新版TinUIXml简易编辑器内置到了TinUI包中,/test/tuxmltest.py,xml资源文件在/test/xmltestpage目录下。

重新布局

新的主界面main.xml

<tinui>
<line anchor='w' y='20'>
    <button2 text='导入xml' command='self.funcs["inxml"]'></button2>
    <button2 text='python代码' command='self.funcs["pycode"]'></button2>
    <checkbutton text='启用十字线定位' command='self.funcs["if_location"]'></checkbutton>
    <paragraph text='x: y:'>loctext</paragraph>
</line>
<line>
    <ui width='870' height='630' scrollbar='True'>xmlui</ui>
</line>
<line x='710' y='20' anchor='w'>
    <button2 text='打开标记点管理窗口' command='self.funcs["open_markw"]'></button2>
</line>
</tinui>

生成界面:
在这里插入图片描述

在新版TinUIXml编辑器中,默认添加了一段来自于TinUI.test.maintest里的back介绍界面xml,这样就可以一目了然明确文本框的交互意义,点击“导入xml”后如图:
在这里插入图片描述

新python代码窗口

在新版TinUIXml简易编辑器中,python代码部分被划归到了新的子窗口,名为pycodew,资源文件为pytest.xml

<!--弹窗显示python代码(IDO)部分-->
<tinui>
<line>
    <textbox width='500' height='500' scrollbar='True'>textbox</textbox>
</line>
<line anchor='w' y='530'>
    <button text='复制' command='self.funcs["copy_pycode"]'></button>
    <button text='标注重点' command='self.funcs["highlight"]'></button>
    <label text='※该内容不可更改'></label>
</line>
</tinui>

tuxmltest.py中,创建新的窗口:

import idlelib.colorizer as idc
import idlelib.percolator as idp

#...

#弹窗窗口
pycodew=Toplevel()
pycodew.title("Python代码")
# 设置窗口大小
window_width = 520
window_height = 550
# 获取屏幕大小
screen_width = pycodew.winfo_screenwidth()
screen_height = pycodew.winfo_screenheight()
# 计算窗口居中的x和y坐标
x_coordinate = int((screen_width/2) - (window_width/2))
y_coordinate = int((screen_height/2) - (window_height/2))
# 设置窗口的位置和大小,并禁止改变尺寸
pycodew.geometry("{}x{}+{}+{}".format(window_width, window_height,
                                      x_coordinate, y_coordinate))
pycodew.resizable(width=False, height=False)  # 禁止改变窗口大小
pctinui=BasicTinUI(pycodew)
pctinui.pack(fill='both',expand=True)
pycodew.protocol("WM_DELETE_WINDOW", lambda: pycodew.withdraw())  # 忽略关闭窗口的协议
pycodew.withdraw()
pctinuix=TinUIXml(pctinui)

xmlf=open(os.path.dirname(__file__)+r'\xmltestpage\pytest.xml','r',encoding='utf-8')
xml=xmlf.read()
xmlf.close()
pctinuix.environment(globals())
pctinuix.loadxml(xml)
textbox=pctinuix.tags['textbox'][0]
idc.color_config(textbox)
p = idp.Percolator(textbox)
d = idc.ColorDelegator()
p.insertfilter(d)

注意到其中的idc, idp等,都是从idlelib中导入的,用来对文本框进行python语法高亮处理。

新xml编辑器对于python代码的处理,与上一版一样,都是重新生成一遍TinUI界面,在此过程中生成对应IDO片段部分python代码,这里不做赘述。新的变化是能够直接复制python代码,同时可以通过注释生成重点内容。

功能代码如下:

def copy_pycode(e):#复制
    textbox.clipboard_clear()
    copyText = textbox.get(1.0,'end')
    textbox.clipboard_append(copyText)
def highlight(e):#标注funcs,datas等重点
    havefunc,havedata=False,False
    textbox.configure(state='normal')
    write('\n#TinUIXml导入重点:\n')
    for i in textbox.result:
        if i[0]=='funcs':
            if havefunc==False:
                havefunc=True
                write('#函数/方法(funcs):\n')
            write(f'#  {i[1]}(...)\n')
        elif i[0]=='datas':
            if havedata==False:
                havedata=True
                write('#数据(datas):\n')
            write(f'#  {i[1]}=...\n')
    havetag=False
    for tag in duixml.tags.keys():
        if havetag==False:
            havetag=True
            write('\n#TinUIXml导出重点:\n')
        write(f'#  {tag}\n')
    textbox.configure(state='disabled')

在这里插入图片描述

十字线定位

TinUIXml只是解决了每块包含若干控件元素的行元素默认布局问题,但是行元素<line>的起始位置是可以自定义的,同时,行元素内部也可以嵌套新的行元素,起始位置也可以自定义。如果我们要在TinUIXml布局时也保持绝对坐标布局的灵活性,就需要知道在当前xml布局(新xml布局编写之前)下,界面元素所占的空间位置状态。

在新TinUIXml编辑器中,直接使用了BasicTinUI自带的设计模式,通过display.show_location控制开启和关闭。

TinUI(BasicTinUI)设计模式在5.1版本中加入。

loclines=False#坐标十字线是否存在
def if_location(e):#是否显示坐标十字线
    global loclines
    loclines=e
    if loclines:
        tinui.itemconfig(loctext,state='normal')
        displayui.show_location(command=getloc)
    else:
        tinui.itemconfig(loctext,text='x:? y:?',state='hidden')
        displayui.show_location(False)

def getloc(x,y):
    tinui.itemconfig(loctext,text=f'x:{x} y:{y}')

在这里插入图片描述

标记点绘制

在新TinUIXml编辑器中,我们设计右键单击绘制标记点,这个功能非常简单,就先不在这里给出详细代码,稍后会随标记点的管理给出。不过需要注意的是,当ui界面重绘,也就是inxml()方法执行后,我们也需要重绘这些点,因此,我们使用mark_points:list=[]来记录这些点的位置信息和画布对象id。

只需要在inxml()后加入reset_marks()即可。

def inxml(e):#注入xml界面
    xml=text.get(1.0,'end')
    duixml.funcs=dict()
    duixml.datas=dict()
    duixml.tags=dict()
    result=re.findall("self\.(.*?)\[.(.*?).\]'",xml,re.M|re.S)
    for i in result:
        if i[0]=='funcs':
            duixml.funcs[i[1]]=None
        elif i[0]=='datas':
            duixml.datas[i[1]]=(None,None)
    duixml.yendy=5
    duixml.clean()
    duixml.loadxml(xml)
    rescroll()
    reset_marks()#!!!

def reset_marks():#重新绘制标记点
    if len(mark_points)==0:
        return
    index=1
    for i in mark_points[1:]:
        mark=displayui.create_oval((i[0][0],i[0][1],i[0][0]+3,i[0][1]+3),outline='red',fill="red")
        mark_points[index]=(i[0],mark)
        index+=1

标记点管理

仅仅有十字线坐标定位是不够的,有时候,我们需要记录几个关键标记点,比如窗口大小对角点、预留控件位置等等。在新TinUIXml编辑器中,我们可以通过另一个窗口,来管理这些标记点。

窗口布局marks.xml

<!--标记点控制窗口-->
<tinui>
<line y='14' anchor='w'>
    <paragraph text='鼠标右键单击确立标记点'></paragraph>
    <button2 text='删除标记点' command='self.funcs["del_mark"]'></button2>
</line>
<line>
    <listbox data='("TinUIXml编辑器标记点",)' width="365" height="535" command='self.funcs["sel_mark"]'>listbox</listbox>
</line>
</tinui>

这个窗口中的listbox列表框,就是我们的主要交互方式,我们也需要保持mark_points列表与列表框的同步更新。

now_mark=None#mark_index
def open_markw(e):
    markw.deiconify()
def del_mark(e):#删除选定标记点
    global now_mark
    if now_mark==None:
        return
    listbox.delete(now_mark)
    displayui.delete(mark_points[now_mark][1])
    del mark_points[now_mark]
    now_mark=None
def sel_mark(name):#选定标记点
    global now_mark
    if name.index==0:
        now_mark=None
    else:
        if now_mark!=None:
            displayui.itemconfigure(mark_points[now_mark][1],outline='red',fill="red")
        now_mark=name.index
        displayui.itemconfigure(mark_points[now_mark][1],outline='blue',fill='blue')
def __set_mark(x,y):
    mark=displayui.create_oval((x,y,x+3,y+3),outline='red',fill="red")
    mark_points.append(((x,y),mark))
    listbox.add(f'({x} , {y})')
def set_mark(e):#绘制标记点
    __set_mark(e.x,e.y)

注意其中每次listbox的变动,都要伴随mark_points的变动,UI展示区域则视情况而定。

在这里插入图片描述
至此,完成一个新的TinUIXml简易编辑器。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1917596.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【洞见】智算操作系统,推进算力迈入普惠智算新时代

WAIC 2024世界人工智能大会暨人工智能全球治理高级别会议正式拉开帷幕&#xff0c;面向世界徐徐展示人工智能技术最前沿的理念和成果。九章云极DataCanvas公司董事长方磊受邀参加大会开幕式&#xff0c;并在“迈向AGI&#xff1a;大模型焕新与产业赋能”论坛发表主题演讲&#…

docker 上传镜像到hub仓库

要将 Docker 镜像上传到 Docker Hub&#xff0c;你需要按照以下步骤操作&#xff1a; 登录 Docker Hub 首先&#xff0c;你需要登录到 Docker Hub。打开终端并运行以下命令&#xff1a;docker login系统会提示你输入 Docker Hub 的用户名和密码。 如果密码忘记可以token登录&a…

函数式接口、匿名内部类、lambda表达式

一、函数式接口 只有一个抽象方法的接口叫函数式接口&#xff0c;不能有两个&#xff0c;也不能有方法实现。 FunctionalInterface注解标记&#xff0c;在idea中可以用这个注解验证是不是函数式接口。实现函数式接口可以转成lambda表达式。 二、匿名内部类 匿名内部类的格式&a…

[k8s源码]1.client-go集群外部署

client-go是由k8s发布且维护的专门用于开发者和kubernetes交互的客户端库。它支持对k8s资源的CRUD操作&#xff08;create、read、update、delete&#xff09;&#xff0c;事件监听和处理&#xff0c;访问kubernetes集群的上下文和配置。 client go是独立于kubernetes集群之外…

爬虫如此简单?一文教会网络爬虫!

在今天的网络环境中&#xff0c;数据的获取对于许多电商和信息分析人员来说至关重要。但是频繁的数据采集行为可能会导致目标网站对你的IP进行封锁或限制访问频率。这时候&#xff0c;使用代理IP可以是一个有效的解决方案。本文将向你介绍如何使用代理IP进行网络爬虫&#xff0…

《计算机研究与发展》投稿经验

前言 记录下投计研展正刊的经验。跟专刊不同哈&#xff0c;专刊会更快&#xff0c;我看好像也有专刊的经验分享。【计算机研究与发展投稿记录】 期刊简介 来源计研展官网&#xff1a; 《计算机研究与发展》是中国科学院计算技术研究所和中国计算机学会联合主办的学术性期刊&a…

sqlmap确定目标/实操

安装kali&#xff0c;kali自带sqlmap&#xff0c;在window系统中跟linux系统操作有区别 sqlmap是一款自动化SQL工具&#xff0c;打开kali终端&#xff0c;输入sqlmap&#xff0c;出现以下界面&#xff0c;就说明sqlmap可用。 sqlmap确定目标 一、sqlmap直连数据库 1、直连数据库…

电机控制杂谈——基于偏置电压注入的载波PWM策略/简化版SVPWM

1.前言 SVPWM策略需要非常繁琐的计算过程&#xff08;扇区判断、电压矢量作用时间计算、各相开关切换顺序排布、各相开关切换时间计算&#xff0c;同时SVPWM还存在大量的查表法&#xff09;。这在一定程度上限制了控制频率的提高&#xff08;因为SVPWM计算复杂&#xff0c;会占…

centos 安装ffmpeg

这个错误表明在你的 CentOS 系统的默认仓库中没有 ffmpeg 包。CentOS 的默认仓库通常不包含 ffmpeg&#xff0c;因为它涉及一些许可证问题。但是&#xff0c;你可以通过添加第三方仓库来安装 ffmpeg。 使用 EPEL 和 RPM Fusion 仓库 # 安装 EPEL 仓库 sudo yum install epel-…

TIA博途Wincc中画箭头和管道的具体方法示例

TIA博途Wincc中画箭头和管道的具体方法示例 如何画箭头? 如下图所示,在右侧的工具箱中找到基本对象—线,点击选中, 如下图所示,在画面中添加一条线段,然后右键进入该线段的属性,设置线的外观: 宽度、样式、颜色; 线端:这里可以选择起始和结束的样式,选择“箭头”,则…

压测引擎数据库设计(下)

压测引擎数据库设计&#xff08;下&#xff09; 引言 上一篇博文讲述了我们压测引擎数据库设计的上半部分的内容&#xff0c;这一篇博文将会把压测引擎数据库设计最后的内容也讲完。 上一篇博文已经把下图的“项目”、“环境”和“压测模块”三张表已经设计完成&#xff0c;这…

零基础STM32单片机编程入门(十三) 红外避障传感器模块实战含源码

文章目录 一.概要二.红外避障模块主要参数1.模块引脚定义2.模块特点3.模块原理图 三.STM32单片机红外避障模块检测实验四.CubeMX工程源代码下载五.小结 一.概要 红外避障模块具有一对红外线发射与接收管&#xff0c;发射管发射出一定频率的红外线&#xff0c;当检测遇到障碍物…

【香橙派5】使用frp建立香橙派内网穿透

1、首先进入github下载需要用的tar包 https://github.com/fatedier/frp/releases请一定一定看清楚&#xff0c;一个是amd&#xff0c;一个是arm不要上传岔了&#xff01;&#xff01;&#xff01; 2、上传之后&#xff0c;服务器端进行修改 首先进行压缩包解压 tar -zxvf f…

ENSP软件中DHCP的相关配置以及终端通过域名访问服务器

新建拓扑 配置路由器网关IP 设备配置命令&#xff1a;<Huawei> Huawei部分为设备名 <>代表当下所在的模式&#xff0c;不同模式下具有不同的配置权限<Huawei> 第一级模式&#xff0c;最低级模式 查看所有参数<Huawei>system-view 键入系统视图…

html5——表单

目录 表单基本结构 表单标签 常用表单元素 文本框 密码框 邮箱 单选按钮 复选框 文件域 隐藏域 列表框 多行文本域 lable标签 表单按钮 常用表单属性 只读与禁用 placeholder required pattern autofocus autocomplete 用于指定表单是否有自动完…

脉脉高聘:面对薪资福利减少,超40%职场人自动缩短工时

近日&#xff0c;脉脉高聘人才智库发布《2024职场生存洞察》&#xff08;下称《洞察》&#xff09;。 数据显示&#xff0c;2024上半年&#xff0c;新经济行业求职压力居高不下&#xff0c;人才供需比达到1.97&#xff0c;相当于2个人竞争1个岗位。求职压力也让职场人心态趋于…

【ACM珠海分会,IEEE Fellow加盟,CPS出版】第四届管理科学和软件工程国际学术会议(ICMSSE 2024,7月19-21)

第四届管理科学和软件工程国际学术会议(ICMSSE 2024)由ACM珠海分会&#xff0c;广州番禺职业技术学院主办&#xff1b;全国区块链行业产教融合共同体&#xff0c;AEIC学术交流中心承办&#xff0c;将于2024年7月19-21日于广州召开。 会议旨在为从事管理与软件工程领域的专家学…

爆款文案管理系统设计

设计一个爆款文案管理系统&#xff0c;目标是帮助营销团队高效地创建、管理并分析吸引人的文案&#xff0c;以提升产品或服务的市场吸引力和销售转化率。以下是一些关键功能和设计考量点&#xff1a; 1. 用户友好界面 简洁直观的界面&#xff1a;确保系统界面清晰&#xff0c…

zigbee笔记:七、zigbee系统电源管理与睡眠唤醒

zigbee的低功耗、近距离无线传输的特点使得其在一众近距离无线传输方案中备受青睐。而zigbee低功耗优势是通过根据不同工况选择运行在不同的运行模式&#xff08;供电模式&#xff09;实现的&#xff0c;因此&#xff0c;掌握zigbee的系统电源管理与睡眠唤醒的相关知识&#xf…

STM32的Code、RO-data、RW-data、ZI-data和RAM以及flash的关系

对于刚接触stm32编程的同学来说&#xff0c;通常不知道如何选择合适型号的芯片来开发自己的项目&#xff0c;下面就分析一下多大的片内ram以及flash能符合我们项目的需求。 不知道大家有没有注意到&#xff0c;我们的项目每次编译完成后&#xff0c;都会出现这个Program Size&…