百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术流 > 正文

QML 实现圆角平行四边形(qml+实现圆角平行四边形的方法)

citgpt 2024-07-12 09:51 13 浏览 0 评论

前几天想用QML做一个圆角平行四边形,刚开始用Rectangle,给了一个旋转角度,发现跟想像的不一样,然后就这么放着了。今天来了灵感,想起了切变矩阵,一试感觉还不错。


QML 实现圆角平行四边形(qml+实现圆角平行四边形的方法)

实现代码


测试代码


头条必乱的文本代码

Parallelogram.qml ============================

import QtQuick 2.12

Item {

property real xs: 0 // 水平方向切变

property real ys: 0 // 垂直方向切变

property alias radius: rect.radius // 圆角

property alias text: title.text // 文本

Rectangle {

id: rect

anchors.fill: parent

color: "lightblue"

// 切变矩阵

transform: Matrix4x4 {

matrix: Qt.matrix4x4(1, xs, 0, 0,

ys, 1, 0, 0,

0, 0, 1, 0,

0, 0, 0, 1)

}

Text {

id: title

anchors.centerIn: rect

text: "0"

}

}

}


test.qml ============================


import QtQuick 2.12

import QtQuick.Window 2.12

Window {

visible: true

width: 640

height: 480

title: qsTr("glimix.com qml 101 - #106")

color: "#404040"

Column {

anchors.centerIn: parent

spacing: 3

Repeater {

id: rep

model: 9

Parallelogram {

xs: -0.05

ys: -0.05

radius: 4

width: 90

height: 30

text: index + 1

}

}

}

Parallelogram {

x: 70; y: 40; width: 180; height: 90

xs: -0.4

text: "水平方向"

}

Parallelogram {

x: 420; y: 40; width: 180; height: 90

ys: 0.4

text: "垂直方向"

}

}

相关推荐

Linux系统中的sudo命令、APT软件包管理器以及Java开发工具包JDK

sudo命令详解:sudo命令允许用户以root权限执行命令,类似于Windows系统中的“以管理员身份运行”。这在需要系统级权限操作时非常有用。更多信息请参考:https://do...

js中arguments详解

一、简介了解arguments这个对象之前先来认识一下javascript的一些功能:其实Javascript并没有重载函数的功能,但是Arguments对象能够模拟重载。Javascrip中每个函数...

firewall-cmd 常用命令

目录firewalldzone说明firewallzone内容说明firewall-cmd常用参数firewall-cmd常用命令常用命令 回到顶部firewalldzone...

epel-release 是什么

EPEL-release(ExtraPackagesforEnterpriseLinux)是一个软件仓库,它为企业级Linux发行版(如CentOS、RHEL等)提供额外的软件包。以下是关于E...

FullGC详解  什么是 JVM 的 GC
FullGC详解 什么是 JVM 的 GC

前言:背景:一、什么是JVM的GC?JVM(JavaVirtualMachine)。JVM是Java程序的虚拟机,是一种实现Java语言的解释器。 它提供了一种独立于操作系统的运行环境,使得Java程序在任...

2024-10-26 08:50 citgpt

使用Spire.Doc组件利用模板导出Word文档
  • 使用Spire.Doc组件利用模板导出Word文档
  • 使用Spire.Doc组件利用模板导出Word文档
  • 使用Spire.Doc组件利用模板导出Word文档
  • 使用Spire.Doc组件利用模板导出Word文档
跨域(CrossOrigin)

1.介绍  1)跨域问题:跨域问题是在网络中,当一个网络的运行脚本(通常时JavaScript)试图访问另一个网络的资源时,如果这两个网络的端口、协议和域名不一致时就会出现跨域问题。    通俗讲...

微服务架构和分布式架构的区别

1、含义不同微服务架构:微服务架构风格是一种将一个单一应用程序开发为一组小型服务的方法,每个服务运行在自己的进程中,服务间通信采用轻量级通信机制(通常用HTTP资源API)。这些服务围绕业务能力构建并...

深入理解与应用CSS clip-path 属性
深入理解与应用CSS clip-path 属性

clip-pathclip-path是什么clip-path 是一个CSS属性,允许开发者创建一个剪切区域,从而决定元素的哪些部分可见,哪些部分会被隐藏。通过定义这个剪切路径(clippingpath),您可以创造出非矩形的裁剪...

2024-10-25 11:51 citgpt

HCNP Routing&Switching之OSPF LSA类型(二)
  • HCNP Routing&Switching之OSPF LSA类型(二)
  • HCNP Routing&Switching之OSPF LSA类型(二)
  • HCNP Routing&Switching之OSPF LSA类型(二)
  • HCNP Routing&Switching之OSPF LSA类型(二)
Redis和Memcached的区别详解
Redis和Memcached的区别详解

Redis的作者SalvatoreSanfilippo曾经对这两种基于内存的数据存储系统进行过比较:1.Redis支持服务器端的数据操作:Redis相比Memcached来说,拥有更多的数据结构和并支持更丰...

2024-10-25 11:51 citgpt

Request.ServerVariables 大全

Request.ServerVariables("Url")返回服务器地址Request.ServerVariables("Path_Info")客户端提供的路...

python操作Kafka

目录一、python操作kafka1.python使用kafka生产者2.python使用kafka消费者3.使用docker中的kafka二、python操作kafka细...

Runtime.getRuntime().exec详解

Runtime.getRuntime().exec详解概述Runtime.getRuntime().exec用于调用外部可执行程序或系统命令,并重定向外部程序的标准输入、标准输出和标准错误到缓冲池。...

promise.all详解 promise.all是干什么的
promise.all详解 promise.all是干什么的

promise.all详解promise.all中所有的请求成功了,走.then(),在.then()中能得到一个数组,数组中是每个请求resolve抛出的结果。promise.all中只要有一个失败了,走.catch(),在.catch(...

2024-10-24 16:21 citgpt

取消回复欢迎 发表评论: