問題描述
我正在開發一個支持開源降價的 Windows/Linux 最小筆記應用程序.我正在嘗試刪除標題欄并添加我自己的按鈕.我想要一個只有兩個自定義按鈕的標題欄,如圖
目前我有這個:
我試過修改窗口標志:
- 沒有窗口標志,窗口既可調整大小又可移動.但沒有自定義按鈕.
- 使用
self.setWindowFlags(QtCore.Qt.FramelessWindowHint)
,窗口沒有邊框,但不能移動或調整窗口大小 - 使用
self.setWindowFlags(QtCore.Qt.CustomizeWindowHint)
,窗口可以調整大小但不能移動,也不能去掉窗口頂部的白色部分.
任何幫助表示贊賞.您可以在 GitHub
以下是您必須遵循的步驟:
- 擁有您的 MainWindow,無論是 QMainWindow、QWidget,還是您想要繼承的任何 [widget].
- 設置它的標志,self.setWindowFlags(Qt.FramelessWindowHint)
- 實現自己的移動.
- 實現您自己的按鈕(關閉、最大、最小)
- 實現您自己的調整大小.
這里有一個小例子,它實現了移動和按鈕.您仍然應該使用相同的邏輯來實現調整大小.
導入系統從 PyQt5.QtCore 導入 QPoint從 PyQt5.QtCore 導入 Qt從 PyQt5.QtWidgets 導入 QApplication從 PyQt5.QtWidgets 導入 QHBoxLayout從 PyQt5.QtWidgets 導入 QLabel從 PyQt5.QtWidgets 導入 QPushButton從 PyQt5.QtWidgets 導入 QVBoxLayout從 PyQt5.QtWidgets 導入 QWidget類主窗口(QWidget):def __init__(self):超級(主窗口,自我).__init__()self.layout = QVBoxLayout()self.layout.addWidget(MyBar(self))self.setLayout(self.layout)self.layout.setContentsMargins(0,0,0,0)self.layout.addStretch(-1)self.setMinimumSize(800,400)self.setWindowFlags(Qt.FramelessWindowHint)self.pressing = FalseMyBar 類(QWidget):def __init__(自我,父母):超級(我的酒吧,自我).__init__()self.parent = 父母打印(self.parent.width())self.layout = QHBoxLayout()self.layout.setContentsMargins(0,0,0,0)self.title = QLabel("我自己的酒吧")btn_size = 35self.btn_close = QPushButton("x")self.btn_close.clicked.connect(self.btn_close_clicked)self.btn_close.setFixedSize(btn_size,btn_size)self.btn_close.setStyleSheet("背景色:紅色;")self.btn_min = QPushButton("-")self.btn_min.clicked.connect(self.btn_min_clicked)self.btn_min.setFixedSize(btn_size, btn_size)self.btn_min.setStyleSheet("背景色:灰色;")self.btn_max = QPushButton("+")self.btn_max.clicked.connect(self.btn_max_clicked)self.btn_max.setFixedSize(btn_size, btn_size)self.btn_max.setStyleSheet("背景色:灰色;")self.title.setFixedHeight(35)self.title.setAlignment(Qt.AlignCenter)self.layout.addWidget(self.title)self.layout.addWidget(self.btn_min)self.layout.addWidget(self.btn_max)self.layout.addWidget(self.btn_close)self.title.setStyleSheet("""背景顏色:黑色;白顏色;""")self.setLayout(self.layout)self.start = QPoint(0, 0)self.pressing = Falsedef resizeEvent(self, QResizeEvent):超級(MyBar,自我).resizeEvent(QResizeEvent)self.title.setFixedWidth(self.parent.width())def mousePressEvent(自我,事件):self.start = self.mapToGlobal(event.pos())self.pressing = 真def mouseMoveEvent(自我,事件):如果自壓:self.end = self.mapToGlobal(event.pos())self.movement = self.end-self.startself.parent.setGeometry(self.mapToGlobal(self.movement).x(),self.mapToGlobal(self.movement).y(),self.parent.width(),self.parent.height())self.start = self.enddef mouseReleaseEvent(self, QMouseEvent):self.pressing = Falsedef btn_close_clicked(self):self.parent.close()def btn_max_clicked(self):self.parent.showMaximized()def btn_min_clicked(self):self.parent.showMinimized()如果 __name__ == "__main__":應用程序 = QApplication(sys.argv)mw = 主窗口()mw.show()sys.exit(app.exec_())
這里有一些提示:
選項 1:
- 在每個角落和側面都有一個帶有小部件的 QGridLayout(例如左、左上、菜單欄、右上、右、右下、右下和左下)
- 使用方法 (1),您會知道在單擊每個邊框時,您只需定義每個尺寸并將每個尺寸添加到它們的位置.
- 當你點擊每一個時,以各自的方式對待它們,例如,如果你點擊左邊的并拖動到左邊,你必須將它調整大,同時將它向左移動,這樣它就會似乎停在了正確的位置并增加了寬度.
- 將此推理應用于每個邊緣,每個邊緣都以它必須的方式行事.
選項 2:
您可以通過點擊位置檢測您正在點擊的位置,而不是使用 QGridLayout.
驗證點擊的x是否小于移動位置的x,以了解它是向左還是向右移動以及被點擊的位置.
計算方法同Option1
選項 3:
- 可能還有其他方法,但我只是想到了這些.例如,使用您說可以調整大小的 CustomizeWindowHint,因此您只需要實現我給您的示例即可.漂亮!
提示:
- 小心localPos(在自己的小部件內部),globalPos(與您的屏幕相關).例如:如果您單擊左側小部件的最左側,它的x"將為零,如果您單擊中間(內容)的最左側,它也將為零,盡管如果您 mapToGlobal 您將有不同的值根據屏幕的位置.
- 在調整大小或移動時要注意,當您必須增加寬度或減少寬度,或者只是移動,或兩者兼而有之時,我建議您在實施之前先在紙上繪制并弄清楚調整大小的邏輯是如何工作的藍色的.
祝你好運:D
I'm working on an opensource markdown supported minimal note taking application for Windows/Linux. I'm trying to remove the title bar and add my own buttons. I want something like, a title bar with only two custom buttons as shown in the figure
Currently I have this:
I've tried modifying the window flags:
- With not window flags, the window is both re-sizable and movable. But no custom buttons.
- Using
self.setWindowFlags(QtCore.Qt.FramelessWindowHint)
, the window has no borders, but cant move or resize the window - Using
self.setWindowFlags(QtCore.Qt.CustomizeWindowHint)
, the window is resizable but cannot move and also cant get rid of the white part at the top of the window.
Any help appreciated. You can find the project on GitHub here.
Thanks..
This is my python code:
from PyQt5 import QtCore, QtWidgets, QtWebEngineWidgets, uic
import sys
import os
import markdown2 # https://github.com/trentm/python-markdown2
from PyQt5.QtCore import QRect
from PyQt5.QtGui import QFont
simpleUiForm = uic.loadUiType("Simple.ui")[0]
class SimpleWindow(QtWidgets.QMainWindow, simpleUiForm):
def __init__(self, parent=None):
QtWidgets.QMainWindow.__init__(self, parent)
self.setupUi(self)
self.markdown = markdown2.Markdown()
self.css = open(os.path.join("css", "default.css")).read()
self.editNote.setPlainText("")
#self.noteView = QtWebEngineWidgets.QWebEngineView(self)
self.installEventFilter(self)
self.displayNote.setContextMenuPolicy(QtCore.Qt.NoContextMenu)
#self.setWindowFlags(QtCore.Qt.FramelessWindowHint)
def eventFilter(self, object, event):
if event.type() == QtCore.QEvent.WindowActivate:
print("widget window has gained focus")
self.editNote.show()
self.displayNote.hide()
elif event.type() == QtCore.QEvent.WindowDeactivate:
print("widget window has lost focus")
note = self.editNote.toPlainText()
htmlNote = self.getStyledPage(note)
# print(note)
self.editNote.hide()
self.displayNote.show()
# print(htmlNote)
self.displayNote.setHtml(htmlNote)
elif event.type() == QtCore.QEvent.FocusIn:
print("widget has gained keyboard focus")
elif event.type() == QtCore.QEvent.FocusOut:
print("widget has lost keyboard focus")
return False
The UI file is created in the following hierarchy
Here are the steps you just gotta follow:
- Have your MainWindow, be it a QMainWindow, or QWidget, or whatever [widget] you want to inherit.
- Set its flag, self.setWindowFlags(Qt.FramelessWindowHint)
- Implement your own moving around.
- Implement your own buttons (close, max, min)
- Implement your own resize.
Here is a small example with move around, and buttons implemented. You should still have to implement the resize using the same logic.
import sys
from PyQt5.QtCore import QPoint
from PyQt5.QtCore import Qt
from PyQt5.QtWidgets import QApplication
from PyQt5.QtWidgets import QHBoxLayout
from PyQt5.QtWidgets import QLabel
from PyQt5.QtWidgets import QPushButton
from PyQt5.QtWidgets import QVBoxLayout
from PyQt5.QtWidgets import QWidget
class MainWindow(QWidget):
def __init__(self):
super(MainWindow, self).__init__()
self.layout = QVBoxLayout()
self.layout.addWidget(MyBar(self))
self.setLayout(self.layout)
self.layout.setContentsMargins(0,0,0,0)
self.layout.addStretch(-1)
self.setMinimumSize(800,400)
self.setWindowFlags(Qt.FramelessWindowHint)
self.pressing = False
class MyBar(QWidget):
def __init__(self, parent):
super(MyBar, self).__init__()
self.parent = parent
print(self.parent.width())
self.layout = QHBoxLayout()
self.layout.setContentsMargins(0,0,0,0)
self.title = QLabel("My Own Bar")
btn_size = 35
self.btn_close = QPushButton("x")
self.btn_close.clicked.connect(self.btn_close_clicked)
self.btn_close.setFixedSize(btn_size,btn_size)
self.btn_close.setStyleSheet("background-color: red;")
self.btn_min = QPushButton("-")
self.btn_min.clicked.connect(self.btn_min_clicked)
self.btn_min.setFixedSize(btn_size, btn_size)
self.btn_min.setStyleSheet("background-color: gray;")
self.btn_max = QPushButton("+")
self.btn_max.clicked.connect(self.btn_max_clicked)
self.btn_max.setFixedSize(btn_size, btn_size)
self.btn_max.setStyleSheet("background-color: gray;")
self.title.setFixedHeight(35)
self.title.setAlignment(Qt.AlignCenter)
self.layout.addWidget(self.title)
self.layout.addWidget(self.btn_min)
self.layout.addWidget(self.btn_max)
self.layout.addWidget(self.btn_close)
self.title.setStyleSheet("""
background-color: black;
color: white;
""")
self.setLayout(self.layout)
self.start = QPoint(0, 0)
self.pressing = False
def resizeEvent(self, QResizeEvent):
super(MyBar, self).resizeEvent(QResizeEvent)
self.title.setFixedWidth(self.parent.width())
def mousePressEvent(self, event):
self.start = self.mapToGlobal(event.pos())
self.pressing = True
def mouseMoveEvent(self, event):
if self.pressing:
self.end = self.mapToGlobal(event.pos())
self.movement = self.end-self.start
self.parent.setGeometry(self.mapToGlobal(self.movement).x(),
self.mapToGlobal(self.movement).y(),
self.parent.width(),
self.parent.height())
self.start = self.end
def mouseReleaseEvent(self, QMouseEvent):
self.pressing = False
def btn_close_clicked(self):
self.parent.close()
def btn_max_clicked(self):
self.parent.showMaximized()
def btn_min_clicked(self):
self.parent.showMinimized()
if __name__ == "__main__":
app = QApplication(sys.argv)
mw = MainWindow()
mw.show()
sys.exit(app.exec_())
Here are some tips:
Option 1:
- Have a QGridLayout with widget in each corner and side(e.g. left, top-left, menubar, top-right, right, bottom-right, bottom and bottom left)
- With the approach (1) you would know when you are clicking in each border, you just got to define each one size and add each one on their place.
- When you click on each one treat them in their respective ways, for example, if you click in the left one and drag to the left, you gotta resize it larger and at the same time move it to the left so it will appear to be stopped at the right place and grow width.
- Apply this reasoning to each edge, each one behaving in the way it has to.
Option 2:
Instead of having a QGridLayout you can detect in which place you are clicking by the click pos.
Verify if the x of the click is smaller than the x of the moving pos to know if it's moving left or right and where it's being clicked.
The calculation is made in the same way of the Option1
Option 3:
- Probably there are other ways, but those are the ones I just thought of. For example using the CustomizeWindowHint you said you are able to resize, so you just would have to implement what I gave you as example. BEAUTIFUL!
Tips:
- Be careful with the localPos(inside own widget), globalPos(related to your screen). For example: If you click in the very left of your left widget its 'x' will be zero, if you click in the very left of the middle(content)it will be also zero, although if you mapToGlobal you will having different values according to the pos of the screen.
- Pay attention when resizing, or moving, when you have to add width or subtract, or just move, or both, I'd recommend you to draw on a paper and figure out how the logic of resizing works before implementing it out of blue.
GOOD LUCK :D
這篇關于PyQt5中帶框架的自定義標題欄的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!