前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >PyQt5 高级界面控制(表格、树、tab、dock、scrollbar、多文档界面)

PyQt5 高级界面控制(表格、树、tab、dock、scrollbar、多文档界面)

作者头像
Michael阿明
发布于 2022-05-30 00:16:29
发布于 2022-05-30 00:16:29
7.3K03
代码可运行
举报
运行总次数:3
代码可运行

文章目录

learn from 《PyQt5 快速开发与实战》 https://doc.qt.io/qtforpython/index.html https://www.riverbankcomputing.com/static/Docs/PyQt5

1. 表格与树

1.1 QTableView

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/9 9:44
# @Author : Michael
# @File : tableview1.py
# @desc :
from PyQt5.QtGui import QStandardItemModel, QStandardItem
from PyQt5.QtWidgets import QWidget, QTableView, QVBoxLayout, QApplication, QHeaderView


class table_view(QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("table_view")
        self.resize(500, 300)
        self.model = QStandardItemModel()
        self.model.setHorizontalHeaderLabels(["姓名", "年龄", "性别", "地址"])

        for r in range(4):
            for c in range(4):
                item = QStandardItem("row %s, col %s" % (r, c))
                self.model.setItem(r, c, item)
        # 添加数据
        self.model.appendRow([
            QStandardItem("张三"), QStandardItem("20"),
        ])
        self.model.appendRow([
            QStandardItem('李四'), QStandardItem("21"),
        ])

        self.tableview1 = QTableView()
        self.tableview1.setModel(self.model)
        self.tableview1.horizontalHeader().setStretchLastSection(True)
        self.tableview1.horizontalHeader().setSectionResizeMode(QHeaderView.Stretch)  # 表格填满窗口

        # 删除数据
        indexs = self.tableview1.selectionModel().selection().indexes()
        print(indexs)
        if len(indexs) > 0:
            index = indexs[0]
            self.model.removeRows(index.row(), 2)  # 删除两行
        index = self.tableview1.currentIndex()
        print(index, index.row(), index.column())
        self.model.removeRow(index.row()+1)

        layout = QVBoxLayout()
        layout.addWidget(self.tableview1)
        self.setLayout(layout)


if __name__ == "__main__":
    import sys

    app = QApplication(sys.argv)
    win = table_view()
    win.show()
    sys.exit(app.exec_())

1.2 QListView

  • 用于展示数据
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/9 21:08
# @Author : Michael
# @File : list_view1.py
# @desc :
from PyQt5.QtCore import QStringListModel
from PyQt5.QtWidgets import QWidget, QVBoxLayout, QListView, QMessageBox, QApplication


class listViewDemo(QWidget):
    def __init__(self):
        super(listViewDemo, self).__init__()
        self.setWindowTitle("ListView例子")
        self.resize(300, 300)

        layout = QVBoxLayout()

        listview = QListView()

        str_list_model = QStringListModel()
        self.qList = ['Item 1', 'Item 2', 'Item 3', 'Item 4']
        str_list_model.setStringList(self.qList)

        listview.setModel(str_list_model)
        listview.clicked.connect(self.clicked)

        layout.addWidget(listview)
        self.setLayout(layout)
    def clicked(self, qModelIndex):
        QMessageBox.information(self, "title", "text:你选择了 " + self.qList[qModelIndex.row()])

if __name__ == '__main__':
    import sys
    app = QApplication(sys.argv)
    main = listViewDemo()
    main.show()
    sys.exit(app.exec_())

1.3 QListWidget

用于从列表中添加删除条目,升级版QListView,可以调用函数直接添加数据

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/9 21:20
# @Author : Michael
# @File : listWidgetDemo.py
# @desc :
from PyQt5.QtWidgets import QListWidget, QMessageBox, QApplication


class ListWidgetDemo(QListWidget):
    def clicked(self, item):
        QMessageBox.information(self, "ListWidget", "You clicked: " + item.text())


if __name__ == '__main__':
    import sys
    app = QApplication(sys.argv)
    listwidget = ListWidgetDemo()
    listwidget.resize(300, 200)
    listwidget.addItem("item 1")
    listwidget.addItem("item 2")
    listwidget.addItem("item 3")
    listwidget.addItem("item 4")
    listwidget.setWindowTitle("ListWidget Demo")
    listwidget.itemClicked.connect(listwidget.clicked)
    listwidget.show()
    sys.exit(app.exec_())

1.4 QTableWidget

QTableView 的子类

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/9 21:39
# @Author : Michael
# @File : tablewidgetDemo.py
# @desc :
from PyQt5.QtWidgets import QWidget, QHBoxLayout, QTableWidget, QTableWidgetItem, QApplication


class TableWidgetDemo(QWidget):
    def __init__(self):
        super(TableWidgetDemo, self).__init__()
        self.initUI()

    def initUI(self):
        self.setWindowTitle("TableWidget例子")
        self.resize(500, 300)

        layout = QHBoxLayout()

        tablewidget = QTableWidget(4, 3)  # 行,列
        # tablewidget.setRowCount(4)
        # tablewidget.setColumnCount(3)

        layout.addWidget(tablewidget)

        tablewidget.setHorizontalHeaderLabels(["姓名", "性别", "体重(kg)"])
        tablewidget.setVerticalHeaderLabels(["1行", "2行", "3行", "4行哦"])
        tablewidget.setItem(0, 0, QTableWidgetItem("张三"))
        tablewidget.setItem(0, 1, QTableWidgetItem("男"))
        tablewidget.setItem(0, 2, QTableWidgetItem("150"))

        self.setLayout(layout)


if __name__ == "__main__":
    import sys

    app = QApplication(sys.argv)
    main = TableWidgetDemo()
    main.show()
    sys.exit(app.exec_())
表根据界面宽度自动伸缩

tablewidget.horizontalHeader().setSectionResizeMode(QHeaderView.Stretch)

禁止编辑

tablewidget.setEditTriggers(QTableWidget.NoEditTriggers)

单击某单元,使之默认选中整行

tablewidget.setSelectionBehavior(QTableWidget.SelectRows)

设置宽高度与内容相匹配
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
tablewidget.resizeColumnsToContents()
tablewidget.resizeRowsToContents()
是否显示表头
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
tablewidget.horizontalHeader().setVisible(False)
tablewidget.verticalHeader().setVisible(False)
单元格中放置控件
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# 添加控件
combox = QComboBox()
combox.addItem("男")
combox.addItem("女")
combox.setStyleSheet("QComboBox{margin:3px width:80px;}")
tablewidget.setCellWidget(1, 1, combox)

btn = QPushButton("保存")
btn.setDown(True)
btn.setStyleSheet("QPushButton{margin:20px width:20px;}")
tablewidget.setCellWidget(1, 2, btn)
输入行号,快速定位行
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/10 9:48
# @Author : Michael
# @File : table_position.py
# @desc :
from PyQt5.QtGui import QBrush, QColor
from PyQt5.QtWidgets import QWidget, QHBoxLayout, QTableWidget, QTableWidgetItem, QApplication
from PyQt5.QtCore import Qt

class table_position(QWidget):
    def __init__(self):
        super(table_position, self).__init__()
        self.initUI()

    def initUI(self):
        self.setWindowTitle("Table Position")
        self.resize(300, 200)

        layout = QHBoxLayout()

        tablewidget = QTableWidget()
        tablewidget.setRowCount(30)
        tablewidget.setColumnCount(4)

        layout.addWidget(tablewidget)

        for i in range(30):
            for j in range(4):
                itemContent = f'{i},{j}'
                tablewidget.setItem(i, j, QTableWidgetItem(itemContent))
        self.setLayout(layout)

        # 遍历表格查找指定内容
        text = '10,1'
        items = tablewidget.findItems(text, Qt.MatchExactly)
        item = items[0]
        # 选中单元格
        item.setSelected(True)
        # 设置背景颜色
        item.setForeground(QBrush(QColor(255, 0, 0)))

        row = item.row()
        # 鼠标滚轮定位到第11行
        tablewidget.verticalScrollBar().setSliderPosition(row)
if __name__ == "__main__":
    import sys
    app = QApplication(sys.argv)
    window = table_position()
    window.show()
    sys.exit(app.exec_())
设置颜色
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# 设置颜色
newitem = QTableWidgetItem('new')
newitem.setForeground(QBrush(QColor(0, 255, 0)))
tablewidget.setItem(10, 1, newitem)
加粗字体
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# 加粗字体
newitem = QTableWidgetItem("new")
newitem.setFont(QFont("Times", 20, QFont.Bold))
tablewidget.setItem(10, 2, newitem)
排序
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
tablewidget.sortItems(2, Qt.DescendingOrder) # 2 列,降序
文本对齐
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# 文本对齐方式
newitem = QTableWidgetItem("michael")
newitem.setTextAlignment(Qt.AlignRight | Qt.AlignBottom)
tablewidget.setItem(10, 3, newitem)
合并单元格
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# 合并单元格
tablewidget.setSpan(0, 0, 3, 1) # 0,0 位置 占据 31列
tablewidget.setItem(0, 0, QTableWidgetItem("michael"))
tablewidget.setItem(1, 0, QTableWidgetItem("hello")) # 被占了,无效
设置单元格大小
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# 设置单元格大小
tablewidget.setColumnWidth(0, 300)  # 0300宽
tablewidget.setRowHeight(0, 150)  # 0150
显示网格线
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# 不显示分割线
tablewidget.setShowGrid(False)
设置图片、更改图片大小
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
## 放置图片,调整大小
newitem = QTableWidgetItem(QIcon('../store.png'), "微软商店")
tablewidget.setItem(10, 3, newitem)
tablewidget.setIconSize(QSize(100, 100))
获取单元格内容
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# 获取单元格内容
    tablewidget.itemClicked.connect(self.handleItemClicked)

def handleItemClicked(self, item):
    print('你点击了' + item.text())
右键菜单
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
def generateMenu(pos):
    row_num = -1
    for i in tablewidget.selectionModel().selection().indexes():
        row_num = i.row()

        menu = QMenu()
        item1 = menu.addAction("删除")
        item2 = menu.addAction("修改")
        item3 = menu.addAction("添加")
        action = menu.exec_(tablewidget.mapToGlobal(pos))
        if action == item1:
            print(f"选中了删除,行号:{row_num}")
        elif action == item2:
            print(f"选中了修改,行号:{row_num}")
        elif action == item3:
            print(f"选中了添加,行号:{row_num}")

# 允许右键菜单
tablewidget.setContextMenuPolicy(Qt.CustomContextMenu)
tablewidget.customContextMenuRequested.connect(generateMenu)

1.5 QTreeView

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/29 20:26
# @Author : Michael
# @File : treewidget01.py
# @desc :
import sys

from PyQt5.QtCore import Qt
from PyQt5.QtGui import QIcon, QBrush
from PyQt5.QtWidgets import QApplication, QWidget, QTreeWidget, QTreeWidgetItem, QVBoxLayout, QMainWindow, QStyle


class TreeWidgetDemo(QMainWindow):
    def __init__(self):
        super(TreeWidgetDemo, self).__init__()
        self.setWindowTitle("TreeWidget Demo")
        self.tree = QTreeWidget()
        self.tree.setColumnCount(2)
        self.tree.setHeaderLabels(['Key', 'Value'])

        root = QTreeWidgetItem(self.tree)
        root.setText(0, 'group1')
        root.setIcon(0, self.style().standardIcon(QStyle.SP_DirIcon))

        self.tree.setColumnWidth(0, 150)
        ## 设置节点的背景颜色
        brush_red = QBrush(Qt.red)
        root.setBackground(0, brush_red)
        brush_green = QBrush(Qt.green)
        root.setBackground(1, brush_green)

        # 设置子节点1
        child1 = QTreeWidgetItem(root)
        child1.setText(0, 'child1')
        child1.setText(1, 'ios')
        child1.setIcon(0, QIcon("../store.png"))
        child1.setCheckState(0, Qt.Checked)

        # 设置子节点2
        child2 = QTreeWidgetItem(root)
        child2.setText(0, 'child2')
        child2.setText(1, '')

        # 设置子节点3
        child3 = QTreeWidgetItem(child2)
        child3.setText(0, 'child3')
        child3.setText(1, 'android')

        self.tree.addTopLevelItem(root)
        # 结点全部展开
        self.tree.expandAll()

        self.setCentralWidget(self.tree)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    tree = TreeWidgetDemo()
    tree.show()
    sys.exit(app.exec_())
点击事件
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
	self.tree.clicked.connect(self.on_tree_clicked)
def on_tree_clicked(self):
    item = self.tree.currentItem()
    print(item.text(0), item.text(1))
系统定制模式
  • 使用QTreeView,setModel
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
import sys
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *

if __name__ == '__main__':
    app = QApplication(sys.argv)
    # Window系统提供的模式
    model = QDirModel()
    # 创建一个QtreeView部件
    tree = QTreeView()
    # 为部件添加模式
    tree.setModel(model)
    tree.setWindowTitle("QTreeView 例子")
    tree.resize(640, 480)
    tree.show()
    sys.exit(app.exec_())

2. 容器:装载更多控件

QTabWidget

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/29 21:01
# @Author : Michael
# @File : qtab_demo.py
# @desc :
import sys

from PyQt5.QtGui import QIcon
from PyQt5.QtWidgets import QApplication, QWidget, QTabWidget, QPushButton, QHBoxLayout, QVBoxLayout, QFormLayout, \
    QLineEdit, QRadioButton, QLabel, QCheckBox


class tab_demo(QTabWidget):
    def __init__(self):
        super().__init__()
        self.tab1 = QWidget()
        self.tab2 = QWidget()
        self.tab3 = QWidget()
        self.addTab(self.tab1, 'Tab1')
        self.addTab(self.tab2, 'Tab2')
        self.addTab(self.tab3, QIcon('../store.png'), 'Tab3')
        self.tab1UI()
        self.tab2UI()
        self.tab3UI()
        self.setWindowTitle('QTabWidget')

    def tab1UI(self):
        layout = QFormLayout()
        layout.addRow("姓名", QLineEdit())
        layout.addRow("地址", QLineEdit())
        self.setTabText(0, "联系方式")
        self.tab1.setLayout(layout)

    def tab2UI(self):
        layout = QFormLayout()
        sex = QHBoxLayout()
        sex.addWidget(QRadioButton("男"))
        sex.addWidget(QRadioButton("女"))
        layout.addRow(QLabel("性别"), sex)
        layout.addRow("生日", QLineEdit())
        self.setTabText(1, "个人详细信息")
        self.tab2.setLayout(layout)

    def tab3UI(self):
        layout = QHBoxLayout()
        layout.addWidget(QLabel("科目"))
        layout.addWidget(QCheckBox("物理"))
        layout.addWidget(QCheckBox("高数"))
        self.setTabText(2, "教育程度")
        self.tab3.setLayout(layout)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    demo = tab_demo()
    demo.show()
    sys.exit(app.exec_())

QStackedWidget

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/29 21:16
# @Author : Michael
# @File : qstackedwidget.py
# @desc :
import sys

from PyQt5.QtWidgets import QWidget, QListWidget, QStackedWidget, QHBoxLayout, QApplication, QLabel, QCheckBox, \
    QLineEdit, QRadioButton, QFormLayout


class qstackedwidget_demo(QWidget):
    def __init__(self):
        super(qstackedwidget_demo, self).__init__()
        self.setWindowTitle("QStackedWidget控件")
        self.setGeometry(100, 100, 800, 600)

        self.leftlist = QListWidget()
        self.leftlist.insertItem(0, "联系方式")
        self.leftlist.insertItem(1, "个人信息")
        self.leftlist.insertItem(2, "教育经历")

        self.stack1 = QWidget()
        self.stack2 = QWidget()
        self.stack3 = QWidget()

        self.stack1UI()
        self.stack2UI()
        self.stack3UI()

        self.stack = QStackedWidget()
        self.stack.addWidget(self.stack1)
        self.stack.addWidget(self.stack2)
        self.stack.addWidget(self.stack3)

        hbox = QHBoxLayout()
        hbox.addWidget(self.leftlist)
        hbox.addWidget(self.stack)
        self.setLayout(hbox)
        self.leftlist.currentRowChanged.connect(self.display)

    def stack1UI(self):
        layout = QFormLayout()
        layout.addRow("姓名", QLineEdit())
        layout.addRow("地址", QLineEdit())
        self.stack1.setLayout(layout)

    def stack2UI(self):
        layout = QFormLayout()
        sex = QHBoxLayout()
        sex.addWidget(QRadioButton("男"))
        sex.addWidget(QRadioButton("女"))
        layout.addRow(QLabel("性别"), sex)
        layout.addRow("生日", QLineEdit())
        self.stack2.setLayout(layout)

    def stack3UI(self):
        layout = QHBoxLayout()
        layout.addWidget(QLabel("科目"))
        layout.addWidget(QCheckBox("物理"))
        layout.addWidget(QCheckBox("高数"))
        self.stack3.setLayout(layout)

    def display(self, i):
        self.stack.setCurrentIndex(i)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    demo = qstackedwidget_demo()
    demo.show()
    sys.exit(app.exec_())

QDockWidget

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/29 21:40
# @Author : Michael
# @File : qdock_demo.py
# @desc :
from PyQt5.QtCore import Qt
from PyQt5.QtWidgets import QMainWindow, QHBoxLayout, QDockWidget, QListWidget, QApplication, QTextEdit


class qock_demo(QMainWindow):
    def __init__(self):
        super().__init__()
        layout = QHBoxLayout()
        bar = self.menuBar()
        file = bar.addMenu('File')
        file.addAction('New')
        file.addAction('Open')
        file.addAction('Save')
        self.setCentralWidget(QTextEdit())

        self.items = QDockWidget('Dockable', self)
        self.listWidget = QListWidget()
        self.listWidget.addItems(['Item 1', 'Item 2', 'Item 3'])
        self.items.setWidget(self.listWidget)
        self.items.setFloating(False)
        self.addDockWidget(Qt.RightDockWidgetArea, self.items)
        self.setLayout(layout)
        self.setWindowTitle('Dock例子')

if __name__ == '__main__':
    import sys
    app = QApplication(sys.argv)
    main = qock_demo()
    main.show()
    sys.exit(app.exec_())

多文档界面 QMdiArea

  • 可以有效节省内存
  • QMdiArea
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/29 23:20
# @Author : Michael
# @File : qmultiDocInterface.py
# @desc :

import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *


class qmultiDocInterface(QMainWindow):
    count = 0

    def __init__(self, parent=None):
        super(qmultiDocInterface, self).__init__(parent)
        self.mdi = QMdiArea()
        self.setCentralWidget(self.mdi)
        bar = self.menuBar()
        file = bar.addMenu("File")
        file.addAction("New")
        file.addAction("cascade")
        file.addAction("Tiled")
        file.triggered[QAction].connect(self.windowaction)
        self.setWindowTitle("MDI demo")

    def windowaction(self, q):
        print("triggered")
        if q.text() == "New":
            qmultiDocInterface.count = qmultiDocInterface.count + 1
            sub = QMdiSubWindow()
            sub.setWidget(QTextEdit())
            sub.setWindowTitle("子窗口" + str(qmultiDocInterface.count))
            self.mdi.addSubWindow(sub)
            sub.show()
        if q.text() == "cascade":
            self.mdi.cascadeSubWindows() # 层叠
        if q.text() == "Tiled":
            self.mdi.tileSubWindows() # 平铺


if __name__ == '__main__':
    app = QApplication(sys.argv)
    demo = qmultiDocInterface()
    demo.show()
    sys.exit(app.exec_())

QScrollBar

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
# _*_ coding: utf-8 _*_
# @Time : 2022/5/29 23:27
# @Author : Michael
# @File : qscrollbar.py
# @desc :
import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *


class Example(QWidget):
    def __init__(self):
        super(Example, self).__init__()
        self.initUI()

    def initUI(self):
        hbox = QHBoxLayout()
        self.l1 = QLabel("拖动滑动条去改变颜色")
        self.l1.setFont(QFont("Arial", 16))
        hbox.addWidget(self.l1)
        self.s1 = QScrollBar()
        self.s1.setMaximum(255)
        self.s1.sliderMoved.connect(self.sliderval)
        self.s2 = QScrollBar()
        self.s2.setMaximum(255)
        self.s2.sliderMoved.connect(self.sliderval)
        self.s3 = QScrollBar()
        self.s3.setMaximum(255)
        self.s3.sliderMoved.connect(self.sliderval)
        hbox.addWidget(self.s1)
        hbox.addWidget(self.s2)
        hbox.addWidget(self.s3)
        self.setGeometry(300, 300, 300, 200)
        self.setWindowTitle('QScrollBar 例子')
        self.setLayout(hbox)

    def sliderval(self):
        print(self.s1.value(), self.s2.value(), self.s3.value())
        palette = QPalette()
        c = QColor(self.s1.value(), self.s2.value(), self.s3.value(), 255)
        palette.setColor(QPalette.Foreground, c)
        self.l1.setPalette(palette)


if __name__ == '__main__':
    app = QApplication(sys.argv)
    demo = Example()
    demo.show()
    sys.exit(app.exec_())
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-05-29,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
根据SVG Arc求出其开始角、摆动角和椭圆圆心
这时候我们通过矩阵运算得到了矩阵x1y1和矩阵cxcy,然后还有以下公式求开始角和摆动角:
ryzenWzd
2022/05/07
6070
根据SVG Arc求出其开始角、摆动角和椭圆圆心
dotnet OpenXML 让 PathLst 自定义形状转 SVG 路径格式的 Geometry 内容
在 Office 文档里面,可以使用自己定制的自绘制形状,自己绘制的内容将会存放为 pathLst 也就是 List of Shape Paths 内容到文档里面。本文将告诉大家如何将 PathLst 自定义形状转换为标准的 SVG 路径,以支持在 WPF 或 UWP 中的 Path 元素作为 Geometry 显示
林德熙
2021/02/04
1.9K1
基础 | 在物理引擎中画圆弧
作者|zzbozheng 原文|http://imweb.io/topic/5959aee62536e43f14da1a68 因为需求的需要,要使用在物理引擎中使用四分之一圆弧,我们来看看怎么实现在物理引擎中画出四分之一的圆弧, 在物理引擎中绘制圆弧 一般来说,物理引擎都是提供一般的画图方法,比如:circle(圆)、polygon(不规则多边形)、rectangle(矩形) 等图形,但如果需要画出比较灵活又不规则的图形的话,那么就需要使用 svg 提供支持了。下面来探讨一下如何实现四分之一圆弧: 我们来看
用户1097444
2022/06/29
1.6K0
基础 | 在物理引擎中画圆弧
在物理引擎中画圆弧
本文作者:IMWeb zzbozheng 原文出处:IMWeb社区 未经同意,禁止转载 因为需求的需要,要使用在物理引擎中使用四分之一圆弧,我们来看看怎么实现在物理引擎中画出四分之一的圆弧,
IMWeb前端团队
2018/01/08
2.6K0
在物理引擎中画圆弧
svg上实现图形移动
前两个参数分别是x轴半径和y轴半径,x-axis-rotation是绕x轴旋转角度,large-arc-flag(角度大小) 和sweep-flag(弧线方向),large-arc-flag决定弧线是大于还是小于180度,0表示小角度弧,1表示大角度弧。sweep-flag表示弧线的方向,0表示从起点到终点沿逆时针画弧,1表示从起点到终点沿顺时针画弧。
Enterprise_
2020/07/09
1.1K0
svg上实现图形移动
SVG 快速入门
本文作者:ivweb villainthr SVG 全称是 Scalable Vector Graphics,即,矢量图。在 Web 中使用 SVG 可以解决位图放大失真的问题。首先,不要把 SVG
腾讯IVWEB团队
2017/07/11
3.1K5
SVG 快速入门
SVG基础知识速查笔记
svg是指可缩放矢量图形,是用于描述二维矢量图形的一种图形格式。svg使用XML格式来定义图形,除ie8之前版本外,绝不部分浏览器均支持svg,可将svg文本直接嵌入HTML中显示。
前端_AWhile
2019/09/06
2.1K0
【OpenXml】Pptx的多路径形状转为WPF的Path
本文是将演示如何解析pptx文件的多路径的形状转换到WPF,绘制多个Shape的Path
ryzenWzd
2021/07/14
4610
【HarmonyOS之旅】基于ArkTS开发(三) -> 兼容JS的类Web开发(五) -> Svg
通过设置width、height、x、y和viewBox属性为Svg设置宽度、高度、x轴坐标、y轴坐标和Svg视口。
枫叶丹
2025/02/24
1350
【HarmonyOS之旅】基于ArkTS开发(三) -> 兼容JS的类Web开发(五) -> Svg
SVG绘制饼状图
SVG绘制饼状图 昨天学习了基本的SVG,下面是使用SVG绘制饼状图 创建SVG空间 创建SVG 需要一个document.createElementNS()方法 一个一个setAttribute()方法 编写如下js,将会创建一个svg空间 // 创建一个XML命名空间 var svgns = "http://www.w3.org/2000/svg"; // 创建一个SVG元素指定大小和坐标 var chart = document.createElementNS(svgns, "svg:sv
mySoul
2018/10/15
2.9K0
SVG
HTML体系中,最常用的绘制矢量图的技术是SVG和HTML5新增加的canvas元素。这两种技术都支持绘制矢量图和光栅图。不过canvas更偏重于动画的制作。所以,绘制矢量图的大任落到了SVG身上。
踏浪
2019/07/31
6K0
SVG
VectorDrawable与AnimatedVectorDrawable
VectorDrawable  Android L开始提供了新的API VectorDrawable 可以使用SVG类型的资源,也就是矢量图。先来一个例子吧。 <?xml version="1.0
xiangzhihong
2018/02/05
1K0
VectorDrawable与AnimatedVectorDrawable
HarmonyOS:ArkTS Path 组件自学指南
在日常的鸿蒙应用开发工作中,我常常会遇到需要绘制各种图形和路径的场景。无论是简单的直线、折线,还是复杂的曲线、椭圆弧,传统的布局方式很难满足多样化的图形绘制需求。直到我接触到了 ArkTS 中的 Path 组件,它就像一把神奇的画笔,为我打开了创意绘图的大门。通过灵活运用 Path 组件,我能够轻松地在应用中绘制出各种精美的图形,为用户带来更加丰富和生动的视觉体验。为了帮助更多开发者快速掌握这个强大的组件,我决定将自己的学习经验整理成这篇自学指南。
李游Leo
2025/03/30
1320
HarmonyOS:ArkTS Path 组件自学指南
用SVG实现一个优雅的提示框
Tooltips常被称为提示框(或信息提示框),提示框能够以较强的交互性、自由度为用户提供相应的提示信息。今天我们要聊的不是如何实现强大的交互行为,而是来看看如何以最好的方式来还原他们的视觉效果,并且能适用于不同的场景。
ConardLi
2020/06/10
2.6K0
用SVG实现一个优雅的提示框
【Flutter 绘制番外】svg 终篇 - 路径指令
上两篇我们通过对 svg 路径 M/H/V/L/C/Q/Z 几个指令的解析。把 掘金 logo 的 svg ,转化为 Flutter 的原生路径绘制,并且附加了一些绘制效果。
张风捷特烈
2022/04/15
1.6K0
【Flutter 绘制番外】svg 终篇 - 路径指令
Threejs进阶之十七:Threejs中的Path、Shape和ShapeGeometry类
在实际的应用中,有时候需要我们根据一个二维图形拉伸为三维图形的情况,这就需要我们对Threejs中提供的二维图形相关的类有一个深入的了解,这一节我们就深入的聊一聊Threejs中的Path、Shape和ShapeGeometry类
九仞山
2023/10/14
2.1K0
Threejs进阶之十七:Threejs中的Path、Shape和ShapeGeometry类
Graphics2D 绘制图形-圆角矩形,矩形,椭圆、圆弧等
Java语言在Graphics类提供绘制各种基本的几何图形的基础上,扩展Graphics类提供一个Graphics2D类,它拥用更强大的二维图形处理能力,提供、坐标转换、颜色管理以及文字布局等更精确的控制。
botkenni
2023/03/16
3K0
svg.js教程及使用手册详解(二)
上篇简要介绍了svg.js的基本信息和基本用法,这篇开始详细讲解svg.js的用法。
王金龙
2018/08/24
6.6K1
【Web技术】1139- 手把手教你实现手绘风格图形
https://juejin.cn/post/6942262577460314143
pingan8787
2021/11/17
8820
SVG 菜鸟的 Recharts 自定义图表实战
Recharts 是一款图表处理的类库,利用 React 的特性,重新定义了图表的配置和组合方式,大大地提高了图表自定义样式的灵活度。本文记录了使用 Recharts 结合 SVG 开发自定义样式图表的踩坑历程。 背景 ABCmouse 学校版 为老师们提供了孩子学习情况反馈的模块,其中有一部分数据需要以图表的方式直观展示。 视觉稿 这也涉足到了数据可视化的领域。这个领域细节繁多,靠个人力量难以考虑周全,便需要依赖第三方组件库。结合这一个需求,在数据可视化组件库的选择上,主要考虑两点: 支持 Reac
用户1097444
2022/06/29
1.9K0
SVG 菜鸟的 Recharts 自定义图表实战
推荐阅读
相关推荐
根据SVG Arc求出其开始角、摆动角和椭圆圆心
更多 >
LV.0
.NET开发
目录
  • 文章目录
  • 1. 表格与树
    • 1.1 QTableView
    • 1.2 QListView
    • 1.3 QListWidget
    • 1.4 QTableWidget
      • 表根据界面宽度自动伸缩
      • 禁止编辑
      • 单击某单元,使之默认选中整行
      • 设置宽高度与内容相匹配
      • 是否显示表头
      • 单元格中放置控件
      • 输入行号,快速定位行
      • 设置颜色
      • 加粗字体
      • 排序
      • 文本对齐
      • 合并单元格
      • 设置单元格大小
      • 显示网格线
      • 设置图片、更改图片大小
      • 获取单元格内容
      • 右键菜单
    • 1.5 QTreeView
      • 点击事件
      • 系统定制模式
  • 2. 容器:装载更多控件
    • QTabWidget
    • QStackedWidget
    • QDockWidget
    • 多文档界面 QMdiArea
    • QScrollBar
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档