python中pywebview框架使用方法记录_F11 - 专业站长和开发者的学习网站

pywebview是python的一个库，类似于flask框架，这也是用来构建网页的软件包，它的特点就是不用更多的和html语言和js语言，更多的使用python语言就可以完成网页的创建和元素的监听该库的简介和示例，简单使用看示例足够，但是其中也不够详尽：https://pywebview.flowrl.com/

一、安装pywebview

首先，确保已经安装了pywebview，可以通过以下命令进行安装：

1	pip install pywebview

二、简单使用

简单的创建界面和一些基础操作，这里不再赘述，也没什么营养，官方示例都已给出，这里只贴上一些示例：

一个示例界面;

import webview

if __name__ == '__main__':

# Create a standard webview window

window = webview.create_window('Simple browser', 'https://pywebview.flowrl.com/hello')

webview.start()

一个自制界面：

import webview

html = """

<html>

<body>

<h2>Links</h2>

<p><a href='https://pywebview.flowrl.com'>Regular links</a> are opened in the application window.</p>

<p><a href='https://pywebview.flowrl.com' target='_blank'>target='_blank' links</a> are opened in an external browser.</p>

</body>

</html>

"""

if __name__ == '__main__':

window = webview.create_window('Link types', html=html)

webview.start()

调用的是外部界面：

import webview

if __name__ == '__main__':

window = webview.create_window(title='Webview App', url="https://hailuoai.com/?type=chat&chatID=251739240281759747/", confirm_close=True,

zoomable=True, vibrancy=True, width=1275, height=745)

webview.start(user_agent='Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/125.0.0.0 Safari/537.36 Edg/125.0.0.0',

debug=True)

于是可以从这几个例子看出来，pywebview主要有两种，可以是自制的网页html参数，又或者是url的外部链接。

三、高级使用

主要是关于dom的元素创建选择何使用：按钮等等，关于bind函数

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

import random

import webview

rectangles = []

def random_color():

red = random.randint(0, 255)

green = random.randint(0, 255)

blue = random.randint(0, 255)

return f'rgb({red}, {green}, {blue})'

def bind(window):

def toggle_disabled():

disabled = None if len(rectangles) > 0 else True

remove_button.attributes = { 'disabled': disabled }

empty_button.attributes = { 'disabled': disabled }

move_button.attributes = { 'disabled': disabled }

def create_rectangle(_):

color = random_color()

rectangle = window.dom.create_element(f'<div class="rectangle" style="background-color: {color};"></div>', rectangle_container)

rectangles.append(rectangle)

toggle_disabled()

def remove_rectangle(_):

if len(rectangles) > 0:

rectangles.pop().remove()

toggle_disabled()

def move_rectangle(_):

if len(rectangle_container.children) > 0:

rectangle_container.children[-1].move(circle_container)

def empty_container(_):

rectangle_container.empty()

rectangles.clear()

toggle_disabled()

def change_color(_):

circle.style['background-color'] = random_color()

def toggle_class(_):

circle.classes.toggle('circle')

rectangle_container = window.dom.get_element('#rectangles')

circle_container = window.dom.get_element('#circles')

circle = window.dom.get_element('#circle')

toggle_button = window.dom.get_element('#toggle-button')

toggle_class_button = window.dom.get_element('#toggle-class-button')

duplicate_button = window.dom.get_element('#duplicate-button')

remove_button = window.dom.get_element('#remove-button')

move_button = window.dom.get_element('#move-button')

empty_button = window.dom.get_element('#empty-button')

add_button = window.dom.get_element('#add-button')

color_button = window.dom.get_element('#color-button')

toggle_button.events.click += lambda e: circle.toggle()

duplicate_button.events.click += lambda e: circle.copy()

toggle_class_button.events.click += toggle_class

remove_button.events.click += remove_rectangle

move_button.events.click += move_rectangle

empty_button.events.click += empty_container

add_button.events.click += create_rectangle

color_button.events.click += change_color

if __name__ == '__main__':

window = webview.create_window(

'DOM Manipulations Example', html='''

<html>

<head>

<style>

button {

font-size: 100%;

padding: 0.5rem;

margin: 0.3rem;

text-transform: uppercase;

}

.rectangle {

width: 100px;

height: 100px;

display: flex;

justify-content: center;

align-items: center;

margin: 0.5rem;

border-radius: 5px;

background-color: red;

}

.circle {

border-radius: 50px;

background-color: red;

}

.circle:hover {

background-color: green;

}

.container {

display: flex;

flex-wrap: wrap;

}

</style>

</head>

<body>

<button id="toggle-button">Toggle circle</button>

<button id="toggle-class-button">Toggle class</button>

<button id="color-button">Change color</button>

<button id="duplicate-button">Duplicate circle</button>

<button id="add-button">Add rectangle</button>

<button id="remove-button" disabled>Remove rectangle</button>

<button id="move-button" disabled>Move rectangle</button>

<button id="empty-button" disabled>Remove all</button>

</div>

</body>

</html>

'''

)

webview.start(bind, window)

并且使用event可以监听按钮等等的事件发生

并且是支持动态生成元素的：

with open(file_path, 'r', encoding='utf-8') as file:

for line in file:

count += 1

window.dom.create_element(

f"<input id='word{count}' writingsuggestions='true' type='text' class='editable-textbox'>111</input>"

)

temp = window.dom.get_element(f'#word{count}')

line = line.rstrip('\n')

temp.value = line