创建主框架
这里以一个名为 dear_demo 的项目为例，并在项目下创建几个文件夹：application、data、utils，和两个文件：config.ini 和 main.py，现在的项目结构应该是这样的：
\dear_demo # 项目文件夹
d----- application # 项目的应用文件夹
d----- data # 项目的数据文件夹
d----- utils # 项目的工具文件夹
-a---- config.ini # 项目的配置文件
-a---- main.py # 项目的启动方法
-a---- requirements.txt
然后在 requirements.txt 文件中添加一行：
dearpygui
再通过 pip install -r requirements.txt 安装来自动 DearPyGUI 。
项目主窗口
我们在使用 DearPyGUI 时候会发现，启动时打开的页面是一个随机颜色的背板，因此，我们需要为项目创建一个主页，在 DearPyGUI 中的主页叫 primary_window 即主窗口，在 main.py 文件中，我们添加一下代码：
from dearpygui.core import *
from dearpygui.simple import *
with window('Main Window'):
pass
if __name__ == "__main__":
set_main_window_size(width=900, height=732)
set_main_window_title('Dear Demo (Alpha Version)')
start_dearpygui(primary_window='Main Window')
然后启动 main.py 文件，可以看到一个最简单的主窗口：
最简单的主窗口.png
但是这样的主窗口好像不太好看，我们可以为它加上一张图片，在 utils 目录下创建一个 callback.py 文件，再创建一个 resources 文件夹，把图片文件重命名为 cover_image_pro.png 并存放到 resources 文件夹下，这时的项目结构如下：
\dear_demo # 项目文件夹
d----- application # 项目的应用文件夹
d----- data # 项目的数据文件夹
d----- utils # 项目的工具文件夹
d---------- resources
-a------------- cover_image_pro.png
-a--------- callback.py
-a---- config.ini # 项目的配置文件
-a---- main.py # 项目的启动方法
-a---- requirements.txt
然后在 callback.py 文件中编辑以下代码，添加一个 set_resize_callback 事件的监听回调函数：
from dearpygui.core import *
def on_set_primary_window_resize(sender, data):
delete_item('Main Window Cover', children_only=True)
add_drawing(
name='Main Window Cover Image',
width=get_main_window_size()[0],
height=get_main_window_size()[1] - 100,
parent='Main Window Cover'
)
draw_image(
drawing='Main Window Cover Image',
file='utils/resources/cover_image_pro.png',
pmin=[get_main_window_size()[0] - 325, get_main_window_size()[1] - 100 - 282],
pmax=[get_main_window_size()[0] - 50, get_main_window_size()[1] - 100],
uv_min=[0, 0],
uv_max=[1, 1]
)
在 main.py 文件中也同步进行一些修改：
from dearpygui.core import *
from dearpygui.simple import *
from utils.callback import on_set_primary_window_resize # 添加的代码
with window('Main Window'):
with group('Main Window Cover', horizontal=True): # 添加的代码
pass # 添加的代码
if __name__ == "__main__":
set_main_window_size(width=900, height=732)
set_main_window_title('Dear Demo (Alpha Version)')
set_resize_callback(on_set_primary_window_resize, handler='Main Window') # 添加的代码
start_dearpygui(primary_window='Main Window')
这样，无论我们如何放大缩小页面，图片始终位于屏幕右下角：
加一张图片的主窗口.png
项目主菜单
然后我们再加上一个 “Themes” 和 “Help” 菜单，这些都是 DearPyGUI 自带的方便功能，我们可以把它们整到一起去，方便我们调试用。在 utils 目录下创建一个 widgets.py 文件，创建完成后，项目结构如下：
\dear_demo # 项目文件夹
d----- application # 项目的应用文件夹
d----- data # 项目的数据文件夹
d----- utils # 项目的工具文件夹
d---------- resources
-a------------- cover_image_pro.png
-a--------- callback.py
-a--------- widgets.py
-a---- config.ini # 项目的配置文件
-a---- main.py # 项目的启动方法
-a---- requirements.txt
接下来我们在 widgets.py 文件中编写如下代码：
from dearpygui.core import *
from dearpygui.simple import *
def add_themes_and_help_menu(sender, data):
with menu('Themes', parent=sender):
add_menu_item("Dark", label='Dark (default)', callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Light", callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Classic", callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Dark 2", callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Grey", callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Dark Grey", callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Cherry", callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Purple", callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Gold", callback=lambda sender, data: set_theme(sender), check=True)
add_menu_item("Red", callback=lambda sender, data: set_theme(sender), check=True)
with menu('Help', parent=sender):
add_menu_item('Show Logger', callback=show_logger)
add_menu_item('Show About', callback=show_about)
add_menu_item('Show Metrics', callback=show_metrics)
add_menu_item('Show Documentation', callback=show_documentation)
add_menu_item('Show Debug', callback=show_debug)
add_menu_item('Show Style Editor', callback=show_style_editor)
然后在 main.py 文件中也同步添加一些代码：
from dearpygui.core import *
from dearpygui.simple import *
from utils.widgets import add_themes_and_help_menu # 添加的代码
from utils.callback import on_set_primary_window_resize
with window('Main Window'):
with menu_bar('Main Menu Bar'): # 添加的代码
add_themes_and_help_menu(sender='Main Menu Bar', data=None) # 添加的代码
with group('Main Window Cover', horizontal=True):
pass
if __name__ == "__main__":
set_main_window_size(width=900, height=732)
set_main_window_title('Dear Demo (Alpha Version)')
set_resize_callback(on_set_primary_window_resize, handler='Main Window')
start_dearpygui(primary_window='Main Window')
这样，我们就可以随意选择主题，快速打开 Logger、Debug、Stype Editor 等调试工具：
添加了通用菜单的主窗口.png
可拔插应用
我们可以用 可拔插 的方式在项目中快速添加一个应用，要实现这个功能，需要在 widgets.py 文件中添加一个自动寻找并添加应用到主菜单的方法：
import os # 添加的代码
from dearpygui.core import *
from dearpygui.simple import *
def auto_add_application_to_menu(sender, data): # 添加的方法
application_dirs = []
for file in os.listdir('application/'):
application_dirs.append(file)
application_menu = {}
for application in application_dirs:
exec(f'import application.{application}.views as {application}')
exec(f'application_menu[{application}.app_menu_name]=[]')
for application in application_dirs:
exec(
'application_menu[' + application + '.app_menu_name].append({"app":' + application + ',"name":' + application + '.app_menu_item_name})')
for menu_k, menu_v in application_menu.items():
with menu(f'{menu_k}##Main Menu', parent=sender):
for _item in menu_v:
add_menu_item(f'{_item["name"]}##Main Menu Item', callback=_item['app'].start_app)
def add_themes_and_help_menu(sender, data):
# 省略代码
这个 auto_add_application_to_menu 方法会遍历 application/ 目录下的子目录，即可拔插应用的目录。然后再找到可拔插应用目录下的 views.py 文件，并根据 views.py 文件中的 app_menu_name 和 app_menu_item_name 参数将当前应用上架到主窗口的菜单栏中。
同时，我们可以为这些可拔插应用提供一个通用的 on_close 回调，在 callback.py 文件中添加一个 on_close_callback 方法，用于用户关闭应用时的回调：
from dearpygui.core import *
def on_close_callback(sender, data): # 添加的方法
delete_item(sender)
def on_set_primary_window_resize(sender, data):
# 省略代码
然后我们还要把 auto_add_application_to_menu 方法添加到 main.py 文件中：
from dearpygui.core import *
from dearpygui.simple import *
from utils.widgets import add_themes_and_help_menu, auto_add_application_to_menu # 修改的代码
from utils.callback import on_set_primary_window_resize
with window('Main Window'):
with menu_bar('Main Menu Bar'):
auto_add_application_to_menu(sender='Main Menu Bar', data=None) # 添加的代码
add_themes_and_help_menu(sender='Main Menu Bar', data=None)
with group('Main Window Cover', horizontal=True):
pass
if __name__ == "__main__":
# 省略代码
添加一个应用
我们以一个 “MD5加密工具” 为例，首先在在 application 目录下创建一个 encrypt_md5 文件夹，并在 encrypt_md5 文件夹下创建几个文件，views.py、callback.py、和 handle.py 三个文件，创建后项目结构如下：
\dear_demo # 项目文件夹
d----- application # 项目的应用文件夹
d---------- encrypt_md5
-a------------- views.py
-a------------- callback.py
-a------------- handle.py
d----- data # 项目的数据文件夹
d----- utils # 项目的工具文件夹
d---------- resources
-a------------- cover_image_pro.png
-a--------- callback.py
-a--------- widgets.py
-a---- config.ini # 项目的配置文件
-a---- main.py # 项目的启动方法
-a---- requirements.txt
然后我们先编辑 views.py 文件，在每一个应用的 views.py 文件中，必须要有 app_menu_name、app_menu_item_name 和 app_name 参数，还要有一个 start_app 方法，例如：
from dearpygui.simple import *
from utils.callback import on_close_callback
from .callback import *
app_menu_name = 'Tools'
app_menu_item_name = 'Encrypt MD5 Tools'
app_name = 'Encrypt MD5 Tools'
def start_app(sender, data):
if not is_item_shown(app_name):
add_app_window()
def add_app_window():
with window(app_name, width=360, height=260, on_close=on_close_callback):
add_input_text(f'Plaintext##{app_name}', default_value='Unencrypted Text', multiline=True)
add_button(f'MD5 Encryption##{app_name}', callback=md5_encryption_callback,
callback_data=f'Plaintext##{app_name}')
add_input_text(f'Upper 32##{app_name}')
add_input_text(f'Lower 32##{app_name}')
add_input_text(f'Upper 16##{app_name}')
add_input_text(f'Lower 16##{app_name}')
接下来再编辑 callback.py 文件，我们在 callback.py 文件里要编写一个 md5_encryption_callback 方法，该方法对应 views.py 文件中的 “MD5 Encryption” 按钮：
import hashlib
from dearpygui.core import *
def md5_encryption_callback(sender, data):
plaintext = get_value(data)
m = hashlib.md5()
m.update(plaintext.encode('utf-8'))
app_name = sender.split("##")[1]
set_value(f'Upper 32##{app_name}', m.hexdigest().upper())
set_value(f'Lower 32##{app_name}', m.hexdigest().lower())
set_value(f'Upper 16##{app_name}', m.hexdigest()[8:-8].upper())
set_value(f'Lower 16##{app_name}', m.hexdigest()[8:-8].lower())
最后，我们直接就可以启动项目，会发现， “MD5加密工具” 自动的被找到 auto_add_application_to_menu 方法找到，并上架到主窗口的菜单栏：
添加了MD5工具的主窗口.png
