计算机系统应用教程网站

网站首页 > 技术文章 正文

QML做类似Android圆形头像(qq圆形头像制作)

btikc 2025-02-03 11:31:09 技术文章 17 ℃ 0 评论

前言

在移动端应用中,用户头像一般都是圆形的, 在Android开发中github上有专门生成圆形图片的库可以使用,传入一张正常照片就可以返回圆形图片,并用户头像设置。那么在QML中也可以实现相同的效果,并且使用非常简单。需要用到OpacityMask组件,在Qt官方文档中已经非常详细的介绍了该组件的使用,那么接下来我们看看如何做一张圆形的图片出来。

正文

先看看效果图,左边是原图,右边是处理后的。

废话不多说,直接上代码

import QtQuick 2.0
import QtGraphicalEffects 1.0

Item {
      width:300
      height: 300

      Image {
          id: img
          source: "3.jpg"
          sourceSize: Qt.size(parent.width, parent.height)}

      Rectangle{
          id:mask
          anchors.fill: parent
          radius: width/2.
      }

      OpacityMask {
          anchors.fill: parent
          source: img
          maskSource: mask
      }
  }

代码很简单,不再赘述。

【领QT开发教程学习资料,点击下方链接免费领取↓↓,先码住不迷路~】

点击这里:「链接」

Tags:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表