【記錄】python3 使用tkinter製作tkinterUI編輯器 《十一》

archmage199發表於2020-11-13
PythonUI

使用tkinter製作tkinterUI編輯器

目錄

前言

這篇文章記錄一下最新的tkinterEditor.xml,tkinterEditor.py,components.py。

一、components.py

#!/usr/bin/python
# -*- coding: utf-8 -*-

import sys
from tkinter import *
from componentProperty import update_all_property, get_default_component_info

# 下面匯入自己的控制元件
from EditorTree import EditorTree
from EditorTabControl import EditorTabControl
from ScrollCols import ScrollButtonCols
from ScrollCanvas import ScrollCanvas
from EditorPropertyList import EditorPropertyList


def create_component_from_dict(master, component_info):
    """
    根據字典裡面給定的屬性建立控制元件
    :param master: 父控制元件
    :param component_info: 控制元件資訊
    :return: 建立的控制元件
    """
    gui_type = component_info["gui_type"]
    class_name = getattr(sys.modules[__name__], gui_type)

    component = class_name(master, name=component_info["component_name"])
    update_all_property(component, component_info, gui_type)

    return component


def create_default_component(master, component_type, component_name, prop=None, use_name=True):
    """
    建立預設控制元件
    :param master: 父控制元件
    :param component_type: 控制元件型別
    :param component_name: 控制元件名字
    :param prop: 需要更新的屬性
    :param use_name: 是否使用控制元件名字
    :return: 控制元件
    """
    class_name = getattr(sys.modules[__name__], component_type)
    if use_name:
        component = class_name(master, name=component_name)
    else:
        component = class_name(master)

    component_info = get_default_component_info(component_type, prop)
    update_all_property(component, component_info, component_type)

    return component, component_info

二、tkinterEditor.py

#!/usr/bin/python
# -*- coding: UTF-8 -*-

import os

from tkinter import Tk
from componentMgr import componentMgr


class tkinterEditor(componentMgr):

    def __init__(self, master, gui_path):
        componentMgr.__init__(self, master)
        self.load_from_xml(master, gui_path, True)

    @property
    def editor_window(self):
        return self.master.children.get("editor_window", None)

    @property
    def file_tab_window(self):
        return self.editor_window.children.get("file_tab_window", None)

    @property
    def property_list(self):
        return self.editor_window.children.get("property_list", None)

    @property
    def quick_list(self):
        return self.editor_window.children.get("quick_list", None)

    @property
    def treeview(self):
        return self.editor_window.children.get("treeview", None)

    @property
    def top_level(self):
        return self.editor_window.children.get("top_level", None)

    @property
    def entry_location(self):
        return self.top_level.children.get("entry_location", None)

    @property
    def entry_name(self):
        return self.top_level.children.get("entry_name", None)

def main():
    root = Tk()
    #root.resizable(0, 0)
    path = os.path.join(os.getcwd(), "tkinterEditor.xml")
    tkinterEditor(root, path)
    root.mainloop()


if __name__ == "__main__":
    main()

三、tkinterEditor.xml

<?xml version="1.0" encoding="utf-8"?>
<root>
	<editor_window>
		<anchor>nw</anchor>
		<background>#252b39</background>
		<borderwidth>0</borderwidth>
		<children>
			<file_tab_window>
				<anchor>nw</anchor>
				<background>#252b39</background>
				<borderwidth>0</borderwidth>
				<component_name>file_tab_window</component_name>
				<height>952</height>
				<x>406</x>
				<y>59</y>
				<width>1514</width>
				<gui_type>EditorTabControl</gui_type>
			</file_tab_window>
			<property_list>
				<anchor>nw</anchor>
				<background>#252b39</background>
				<borderwidth>-2</borderwidth>
				<component_name>property_list</component_name>
				<closeenough>1.0</closeenough>
				<height>632</height>
				<is_always_show_scroll>1</is_always_show_scroll>
				<is_show_scroll_x>1</is_show_scroll_x>
				<is_show_scroll_y>1</is_show_scroll_y>
				<relief>flat</relief>
				<x>0</x>
				<y>59</y>
				<width>405</width>
				<gui_type>EditorPropertyList</gui_type>
			</property_list>
			<treeview>
				<anchor>nw</anchor>
				<background>white</background>
				<borderwidth>-2</borderwidth>
				<component_name>treeview</component_name>
				<height>300</height>
				<width>405</width>
				<relief>flat</relief>
				<is_always_show_scroll>1</is_always_show_scroll>
				<is_show_scroll_x>1</is_show_scroll_x>
				<is_show_scroll_y>1</is_show_scroll_y>
				<x>0</x>
				<y>692</y>
				<gui_type>EditorTree</gui_type>
			</treeview>
			<quick_list>
				<anchor>nw</anchor>
				<background>#252b39</background>
				<borderwidth>0</borderwidth>
				<component_name>quick_list</component_name>
				<height>55</height>
				<is_always_show_scroll>1</is_always_show_scroll>
				<is_show_scroll_x>1</is_show_scroll_x>
				<is_show_scroll_y>0</is_show_scroll_y>
				<pos_x_default>3</pos_x_default>
				<x>0</x>
				<y>0</y>
				<gui_type>ScrollButtonCols</gui_type>
				<width>1920</width>
			</quick_list>
			<top_level>
				<anchor>nw</anchor>
				<background>#ffffff</background>
				<children>
					<btn_browse>
						<activebackground>red</activebackground>
						<activeforeground>None</activeforeground>
						<anchor>nw</anchor>
						<background>#8080c0</background>
						<borderwidth>0</borderwidth>
						<component_name>btn_browse</component_name>
						<compound>None</compound>
						<cursor>None</cursor>
						<disabledforeground>None</disabledforeground>
						<font>None</font>
						<foreground>None</foreground>
						<height>1</height>
						<highlightbackground>None</highlightbackground>
						<highlightcolor>None</highlightcolor>
						<highlightthickness>0</highlightthickness>
						<image>None</image>
						<justify>None</justify>
						<padx>0</padx>
						<pady>0</pady>
						<x>340</x>
						<y>44</y>
						<relief>groove</relief>
						<repeatdelay>0</repeatdelay>
						<repeatinterval>0</repeatinterval>
						<state>None</state>
						<takefocus>0</takefocus>
						<text>Browse...</text>
						<underline>99</underline>
						<width>10</width>
						<wraplength>0</wraplength>
						<gui_type>Button</gui_type>
					</btn_browse>
					<btn_cancel>
						<activebackground>red</activebackground>
						<activeforeground>None</activeforeground>
						<anchor>nw</anchor>
						<background>#8080c0</background>
						<borderwidth>0</borderwidth>
						<component_name>btn_cancel</component_name>
						<compound>center</compound>
						<cursor>arrow</cursor>
						<disabledforeground>None</disabledforeground>
						<font>None</font>
						<foreground>None</foreground>
						<height>1</height>
						<highlightbackground>red</highlightbackground>
						<highlightcolor>None</highlightcolor>
						<highlightthickness>0</highlightthickness>
						<image>None</image>
						<justify>center</justify>
						<padx>0</padx>
						<pady>0</pady>
						<x>230</x>
						<y>84</y>
						<relief>raised</relief>
						<repeatdelay>0</repeatdelay>
						<repeatinterval>0</repeatinterval>
						<state>normal</state>
						<takefocus>0</takefocus>
						<text>cancel</text>
						<underline>-1</underline>
						<width>15</width>
						<wraplength>0</wraplength>
						<gui_type>Button</gui_type>
					</btn_cancel>
					<btn_ok>
						<activebackground>red</activebackground>
						<activeforeground>None</activeforeground>
						<anchor>nw</anchor>
						<background>#8080c0</background>
						<borderwidth>0</borderwidth>
						<component_name>btn_ok</component_name>
						<compound>center</compound>
						<cursor>arrow</cursor>
						<disabledforeground>None</disabledforeground>
						<font>None</font>
						<foreground>None</foreground>
						<height>1</height>
						<highlightbackground>red</highlightbackground>
						<highlightcolor>None</highlightcolor>
						<highlightthickness>0</highlightthickness>
						<image>None</image>
						<justify>center</justify>
						<padx>0</padx>
						<pady>0</pady>
						<x>100</x>
						<y>84</y>
						<relief>raised</relief>
						<repeatdelay>0</repeatdelay>
						<repeatinterval>0</repeatinterval>
						<state>normal</state>
						<takefocus>0</takefocus>
						<text>ok</text>
						<underline>-1</underline>
						<width>15</width>
						<wraplength>0</wraplength>
						<gui_type>Button</gui_type>
					</btn_ok>
					<entry_location>
						<anchor>nw</anchor>
						<background>#ffffff</background>
						<borderwidth>1</borderwidth>
						<component_name>entry_location</component_name>
						<cursor>xterm</cursor>
						<exportselection>1</exportselection>
						<font>None</font>
						<foreground>None</foreground>
						<highlightbackground>red</highlightbackground>
						<highlightcolor>None</highlightcolor>
						<highlightthickness>0</highlightthickness>
						<insertbackground>SystemWindowText</insertbackground>
						<insertborderwidth>0</insertborderwidth>
						<insertofftime>300</insertofftime>
						<insertontime>600</insertontime>
						<insertwidth>2</insertwidth>
						<justify>center</justify>
						<x>90</x>
						<y>45</y>
						<relief>sunken</relief>
						<selectbackground>SystemHighlight</selectbackground>
						<selectborderwidth>0</selectborderwidth>
						<selectforeground>SystemHighlightText</selectforeground>
						<state>normal</state>
						<takefocus>0</takefocus>
						<width>30</width>
						<gui_type>Entry</gui_type>
					</entry_location>
					<entry_name>
						<anchor>nw</anchor>
						<background>#ffffff</background>
						<borderwidth>1</borderwidth>
						<component_name>entry_name</component_name>
						<cursor>xterm</cursor>
						<exportselection>1</exportselection>
						<font>None</font>
						<foreground>None</foreground>
						<highlightbackground>red</highlightbackground>
						<highlightcolor>None</highlightcolor>
						<highlightthickness>0</highlightthickness>
						<insertbackground>SystemWindowText</insertbackground>
						<insertborderwidth>0</insertborderwidth>
						<insertofftime>300</insertofftime>
						<insertontime>600</insertontime>
						<insertwidth>2</insertwidth>
						<justify>center</justify>
						<x>90</x>
						<y>20</y>
						<relief>sunken</relief>
						<selectbackground>SystemHighlight</selectbackground>
						<selectborderwidth>0</selectborderwidth>
						<selectforeground>SystemHighlightText</selectforeground>
						<state>normal</state>
						<takefocus>0</takefocus>
						<width>30</width>
						<gui_type>Entry</gui_type>
					</entry_name>
					<label_location>
						<activebackground>None</activebackground>
						<activeforeground>None</activeforeground>
						<anchor>nw</anchor>
						<background>#ffffff</background>
						<borderwidth>0</borderwidth>
						<component_name>label_location</component_name>
						<compound>center</compound>
						<cursor>arrow</cursor>
						<disabledforeground>None</disabledforeground>
						<font>None</font>
						<font_anchor>w</font_anchor>
						<foreground>None</foreground>
						<height>1</height>
						<highlightbackground>red</highlightbackground>
						<highlightcolor>None</highlightcolor>
						<highlightthickness>0</highlightthickness>
						<image>None</image>
						<justify>center</justify>
						<padx>0</padx>
						<pady>0</pady>
						<x>9</x>
						<y>48</y>
						<relief>flat</relief>
						<state>normal</state>
						<takefocus>0</takefocus>
						<text>Location:</text>
						<underline>-1</underline>
						<width>10</width>
						<wraplength>0</wraplength>
						<gui_type>Label</gui_type>
					</label_location>
					<label_name>
						<activebackground>None</activebackground>
						<activeforeground>None</activeforeground>
						<anchor>nw</anchor>
						<background>#ffffff</background>
						<borderwidth>0</borderwidth>
						<component_name>label_name</component_name>
						<compound>None</compound>
						<cursor>None</cursor>
						<disabledforeground>None</disabledforeground>
						<font>None</font>
						<font_anchor>w</font_anchor>
						<foreground>None</foreground>
						<height>1</height>
						<highlightbackground>red</highlightbackground>
						<highlightcolor>None</highlightcolor>
						<highlightthickness>0</highlightthickness>
						<image>None</image>
						<justify>None</justify>
						<padx>0</padx>
						<pady>0</pady>
						<x>9</x>
						<y>22</y>
						<relief>None</relief>
						<state>None</state>
						<takefocus>0</takefocus>
						<text>Name:</text>
						<underline>0</underline>
						<width>10</width>
						<wraplength>0</wraplength>
						<gui_type>Label</gui_type>
					</label_name>
				</children>
				<component_name>top_level</component_name>
				<height>130</height>
				<x>735</x>
				<y>450</y>
				<positionfrom>program</positionfrom>
				<title>new_project</title>
				<topmost>1</topmost>
				<takefocus>0</takefocus>
				<width>450</width>
				<gui_type>Toplevel</gui_type>
			</top_level>
		</children>
		<component_name>editor_window</component_name>
		<height>990</height>
		<highlightbackground>None</highlightbackground>
		<x>500</x>
		<y>300</y>
		<width>1920</width>
		<gui_type>Frame</gui_type>
		<title>tkinterEditor</title>
		<is_main>1</is_main>
	</editor_window>
</root>

四、執行效果

在這裡插入圖片描述

上一篇記錄

相關文章