常用的页面模板
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta http-equiv=”X-UA-Compatible” content=”ie=edge”>
<link rel=”shortcut icon” href=”/favicon.ico” />
<link rel=”bookmark” href=”/favicon.ico” type=”image/x-icon”/>
<!– 设置缓存 –>
<!– 设定网页的到期时间 –>
<meta http-equiv=”Expires” content=”-1″>
<!– 清除缓存(再访问这个网站要重新下载!) –>
<meta http-equiv=”Cache-Control” content=”no-cache”>
<!– 禁止浏览器从本地机的缓存中调阅页面内容,访问者将无法脱机浏览 –>
<meta http-equiv=”Pragma” content=”no-cache”>
<!– author用于定义网页作者 –>
<meta name=”author” content=”aicoder.com”>
<!– 就是当点击网页添加至主屏幕功能时,会在主屏幕上生成一个图标。点击该图标会进入webapp功能。就是模拟本地应用的模式来浏览web页面。 –>
<meta name=”apple-mobile-web-app-capable” content=”yes”>
<!– 当启动webapp功能时,显示手机信号、时间、电池的顶部导航栏的颜色。默认值为default(白色),可以定为black(黑色)和black-translucent(灰色半透明)。这个主要是根据实际的页面设计的主体色为搭配来进行设置。 –>
<meta name=”apple-mobile-web-app-status-bar-style” content=”black”>
<!– 添加到主屏幕后,app全屏显示 –>
<meta content=”yes” name=”apple-touch-fullscreen” />
<!– 默认设备会自动识别任何可能是电话和邮箱的字符串。设置telephone=no可以禁用这项功能。 –>
<meta content=”telephone=no,email=no” name=”format-detection” />
<!– UC浏览器私有 –>
<!– 全屏模式 –>
<meta name=”full-screen” content=”yes”>
<!– 应用模式 –>
<meta name=”browsermode” content=”application”>
<!– QQ浏览器私有 –>
<!– 全屏模式 –>
<meta name=”x5-fullscreen” content=”true”>
<!– 应用模式 –>
<meta name=”x5-page-mode” content=”app”>
<meta name=”App-Config” content=”fullscreen=yes,useHistoryState=yes,transition=yes” />
<!– iOS下页面启动加载时显示的画面图片,避免加载时的白屏。 –>
<!– <link rel=”apple-touch-startup-image” href=”start.png” /> –>
<!– 苹果为iOS设备配备了apple-touch-icon私有属性,添加该属性,在iPhone,iPad,iTouch的safari浏览器上可以使用添加到主屏按钮将网站添加到主屏幕上,方便用户以后访问。 –>
<!– <link rel=”apple-touch-icon” href=”/custom_icon.png” /> –>
<!– 系统会自动为apple-touch-icon图标添加圆角及高光。如果不想系统对图标添加效果,可以用apple-touch-icon-precomposed代替apple-touch-icon, –>
<!– <link href=”//gw.alicdn.com/tps/i2/TB1nmqyFFXXXXcQbFXXE5jB3XXX-114-114.png” rel=”apple-touch-icon-precomposed”> –>
<link rel=”stylesheet” href=”./lib/swiper/css/swiper.min.css”>
<link rel=”stylesheet” href=”./font/font-shop/iconfont.css”>
<link rel=”stylesheet” href=”./css/common.css”>
<link rel=”stylesheet” href=”./css/index.css”>
<script src=”./js/rem.js”></script>
<title></title>
</head>
<body>
</body>
</html>
学生html静态网页模板
#第一部分:主函数html_view.py文件,网页查看主页,点击标签lable响应循环切换加载html网页
from PyQt5.Qt import *
import os
from PyQt5.QtCore import QUrl
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
from PyQt5.QtWebEngineWidgets import QWebEngineView
class EventFilter(QWidget):
def __init__(self,parent=None):
super(EventFilter, self).__init__(parent)
self.file_name = self.setup_dir_fullname()
self.index = 0
self.setWindowTitle(“html_view”)
# 设置窗口图标
self.setWindowIcon(QIcon(‘icons/two.ico’))
self.label1 = QLabel(“prev”)
self.label2 = QLabel(“next”)
self.LabelState=QLabel(“测试提示”)
self.image1 = QImage(“G:/Projectfile/icons/back.png”)
self.image2 = QImage(“G:/Projectfile/icons/next.png”)
self.resize(400, 200)
# 关键1、对要过滤的控件设置installEventFilter,这些控件的所有事件都会被eventFilter函数接受并处理。
self.label1.installEventFilter(self)
self.label2.installEventFilter(self)
#设置网格布局
mainLayout=QGridLayout(self)
mainLayout.addWidget(self.label1,500,0)
mainLayout.addWidget(self.label2, 500, 2)
mainLayout.addWidget(self.LabelState, 600, 1)
self.setLayout(mainLayout)
print(self.file_name)
# 关键2、在eventFiltr函数中处理这些控件的事件信息。
def eventFilter(self, watched,event):
if watched == self.label1: #只对label1的点击事件进行过滤,重写行为,其他事件忽略
#鼠标按下事件(这里仅设置鼠标左键响应)
if event.type() ==QEvent.MouseButtonPress:
mouseEvent = QMouseEvent(event)
if mouseEvent.buttons() == Qt.LeftButton:
self.open(self.prev())
self.LabelState.setText(self.prev())
#缩放图片
transform=QTransform()
transform.scale(0.5,0.5)
tmp=self.image1.transformed(transform)
tmp2 = self.image2.transformed(transform)
self.label1.setPixmap(QPixmap.fromImage(tmp))
self.label2.setPixmap(QPixmap.fromImage(tmp2))
# 鼠标释放事件
if event.type() == QEvent.MouseButtonRelease:
self.label1.setPixmap(QPixmap.fromImage(self.image1))
if watched == self.label2: # 只对label2的点击事件进行过滤,重写行为,其他事件忽略
if event.type() == QEvent.MouseButtonPress:
mouseEvent = QMouseEvent(event)
if mouseEvent.buttons() == Qt.LeftButton:
self.open(self.next())
self.LabelState.setText(self.next())
# 转换图片大小
transform = QTransform()
transform.scale(0.5, 0.5)
tmp2 = self.image2.transformed(transform)
self.label2.setPixmap(QPixmap.fromImage(tmp2))
# 鼠标释放事件
if event.type() == QEvent.MouseButtonRelease:
self.label2.setPixmap(QPixmap.fromImage(self.image2))
return QWidget.eventFilter(self,watched,event)
def open(self,file_name1): # 显示窗体2
import open_html
self.second = open_html.myWindow(file_name1)
self.second.show()
def setup_dir_fullname(self):
# 初始化设置存储HTML文件的文件夹名称,默认“pic_html”,这里存放需要预览的html文件。
pyechart_dir = ‘pic_html’
if not os.path.isdir(pyechart_dir):
os.mkdir(pyechart_dir)
self.path_dir_pyechart_html = os.getcwd() + os.sep + pyechart_dir
self.mylist = os.listdir(self.path_dir_pyechart_html)
return self.mylist
###等效代码###
# self.mylist = []
# for dirpath, dirnames, filenames in os.walk(self.path_dir_pyechart_html):
# for filepath in filenames:
# self.mylist.append(os.path.join(filepath))
def prev(self):
return self.show_file(-1)
def next(self):
return self.show_file(1)
def show_file(self, n):
self.index += n
if self.index 0:
self.index = (len(self.file_name) – 1)
if self.index > (len(self.file_name) – 1):
self.index = 0
self.file_name1 = self.file_name[self.index]
return self.file_name1
if __name__ == ‘__main__’:
import sys
# 1、创建一个应用程序对象
app = QApplication(sys.argv)
# 2、控件的操作
# 创建控件
window = EventFilter()
# 展示控件
window.show()
# 3、应用程序的执行,进入到消息循环
sys.exit(app.exec_())
#第二部分:调用open_html.py文件,新建窗体显示html
import os
from PyQt5.QtCore import QUrl
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
from PyQt5.QtWebEngineWidgets import QWebEngineView
import sys
class myWindow(QWidget):
def __init__(self,file_name):
super().__init__()
self.file_name=file_name
self.setWindowTitle(“play”)
# 设置窗口图标
self.setWindowIcon(QIcon(‘icons/pic.ico’))
self.resize(950,580)
self.mainLayout(self.file_name)
def mainLayout(self,file_name):
pyechart_dir = ‘pic_html’
if not os.path.isdir(pyechart_dir):
os.mkdir(pyechart_dir)
self.path_dir_pyechart_html = os.getcwd() + os.sep + pyechart_dir
path_pyechart = self.path_dir_pyechart_html + os.sep +file_name
self.mainhboxLayout = QHBoxLayout(self)
self.frame = QFrame(self)
self.mainhboxLayout.addWidget(self.frame)
self.hboxLayout = QHBoxLayout(self.frame)
# 网页嵌入PyQt5
self.myHtml = QWebEngineView() ##浏览器引擎控件
self.myHtml.setGeometry(50,20,1000,600)
# 打开本地html文件#使用绝对地址定位,在地址前面加上 file:/// ,将地址的 改为/
self.myHtml.load(QUrl.fromLocalFile(“file:/{0}”.format(path_pyechart)))
self.hboxLayout.addWidget(self.myHtml)
self.setLayout(self.mainhboxLayout)
#测试
# if __name__ == ‘__main__’:
# app = QApplication(sys.argv)
#
# main = myWindow(file_name)
#
# main.show()
# # main.showMaximized()
# sys.exit(app.exec_())