QML中ListView向上滚动效果

qml QtQuick2 ScrollView代码控制ScrollView滚动、ScrollView自动滚动 此文章讲了QtQuick2的ScrollView如何代码控制其滚动 阅读详情

最近在做一个小的音乐播放器,歌词滚动效果在qml中居然可以很容易的实现。
在QML的源码中找到思路的,现在就把这种效果单独做了个demo出来。
利用的是listView的preferredHighlightBegin和preferredHighlightEnd
在这里插入图片描述
源文件:
main.qml

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
   
   
    visible: true
    width: 240
    height: 400
    title: qsTr("Hello World")

    HightRange {
   
   
        width: 200
        height: 400
        anchors.top: parent.top
        anchors.topMargin: 20

        anchors.left: parent.left
        anchors.leftMargin: 60
    }
}

PetsModel.qml文件:

import QtQuick 2.0

ListModel {
   
   
    ListElement {
   
   
        name: "Polly"
        type: "Parrot"
        age: 12
        size: "Small"
    }
    ListElement {
   
   
        name: 
QML ListView 列表视图 虽然 Repeater 在重复创建多个相似项的时候很方便,但是通常只适用于有限的简单元素,并且它还无法滚动浏览。而基于 Flickable 的视图组件(如 GridView、ListView、TableView、TreeView 等)则弥补了这些缺点,它们不但能够显示大量数据,而且还支持滚动浏览,尤其是针对复杂的布局和交互场景,可以通过分页显示、懒加载、动态更新等手段来提高性能。 阅读详情

相关推荐

QtQuick QML教程(25):qml列表控件ListView用法介绍

ListView 是 Qt Quick (QML) 中的列表控件,用于创建一个可以滚动的列表。每个列表项都是根据模型(Model)来创建的,它可以是静态的列表或者是动态的数据集合,例如从数据库中获取的数据。视图(View)将这些数据以列表的形式展现出来,而代理(Delegate)则定义了如何将每个数据项渲染到视图中。

琅嬛福地 2638

Qt qml中listview 列表视图控件(下拉刷新、上拉分页、滚动轴)

Qt qml listview下拉刷新和上拉分页主要根据contentY来判断。但要加上顶部下拉指示器、滚动条,并封装成可简单调用的组件,着实花了我不少精力:) 先给大家展示下效果图: 【功能】 下拉刷新和上拉分页逻辑 /下拉刷新 /上拉更多 /滚动栏 /工具栏半拉显隐 Author: surfsky.cnblogs.com Lisence: MIT 请保留此文档声明 History: init. surfsky.cnblogs.com, 2015-01 add initPosition property. 2015-01 【调用】 控件使用非常简单,只要实现 onLoad 和 onL

MIPI CSI-2 协议解析

CSI-2标准协议前言一、Overview of CSI-2二、CSI-2 layer Definitions三、 Camera Control Interface(CCI)3.1 数据传输协议(Data Transfer Protocol)3.1.1 消息类型(Message Type)3.1.2 读写操作(Read/Write Operations)3.1.2.1 随机位置单次读3.1.2.2 当前位置单次读3.1.2.3 随机位置连续读3.1.2.4 当前位置连续读3.1.2.5 随机位置单次写3.1

Lucky 3万+

OpenCvSharp之利用海康相机采集图像并在pictureBox中显示

OpenCvSharp之利用海康相机采集图像并在pictureBox中显示 说明:OpenCvSharp版本为4.0 海康相机为黑白相机 实现功能:将海康相机采集的图像转成Mat,并在pictureBox中显示。 示例代码: Mat srcImage; private Mat CaptureImage() { int nRet; //MyCamera.MVCC_I...

Kevin_Sun777的博客 5504

SPSS篇—卡方检验

今天依旧跟大家分享一个在SPSS中使用率比较高的分析方法:卡方检验。 在开始做分析之前,我们需要明白两件事情:卡方检验是什么?一般用来干什么?我们只有充分了解分析方法以后才能够正确的使用它。 卡方检验在百科中的解释是:卡方检验是用途非常广的一种假设检验方法,它在分类资料统计推断中的应用,包括:两个率或两个构成比比较的卡方检验;多个率或多个构成比比较的卡方检验以及分类资料的相关分析等。它的原理是...

小白数据营的博客 20万+

在ROS中使用行为树

在ROS中使用行为树 我提供的工程示例文件: demo链接 文章目录在ROS中使用行为树0、 学习本教程的前提1、 behaviorTree 库安装(ROS使用下的安装方式)2、 处理 behaviortree 库并准备好 service 和 ros action2.1 对ROS 的 service 和 action 进行封装,使其在 behaviortree 上使用更加方便。2.2 创建一个 service 和一个 action2.3 创建与决策树相关的数据类型2.4 修改`package.xml`文件2

qq_37416258的博客 6380

微积分,用编程理解高数(python,C,C++)

很好理解,导数中,x是哪一点的导数,dx是精准度,y等于f(x)即函数。导数结果就是瞬时变化率。积分很好理解,a为下限,b为上限,y为函数,结果就是y=f(x)下a到b的面积。只要用定积分代入a=0,b=10(10s)y=x(1*x=1)就得到结果。F(x)为原函数,即微分后的函数是f(x)dx,微分前是F(x)一列车初始速度为10m/s,加速度为。才几十行代码,微积分也不是很难啊。,问速度达到20时车走了多少米。

linhhanpy的博客 1181

SpringBoot实现快速导入EXCEL

MaterialMonitorController.java @Log(title = "物料监测", businessType = BusinessType.IMPORT) @RequiresPermissions("system:materialMonitor:import") @PostMapping("/importData") @ResponseBody ...

LEN程序员的一生 4817

这才是 Python 的正确玩法!用强化学习 (RL) 训练 AI 玩《王者荣耀》,胜率 90%!

大家打排位时,一定遇到过那种“意识神级、操作零失误”的对手,或者“走位呆滞、送人头”的队友。以前的“人机”是程序员写死的脚本(If 血量<20% Then 回城)。而现在的顶级 AI(如腾讯绝悟、OpenAI Five),是靠强化学习 (Reinforcement Learning)自己“左右互搏”练出来的。今天,我们不谈枯燥的数学公式,我将手把手教你用,搭建一个能玩 MOBA 游戏的 AI Agent。即使不能去 KPL 打职业,虐一下钻石局还是绰绰有余的!

BUG猿的博客 1183

【车载以太网】ATU(Address Translation Unit / Address Table Unit)

【车载以太网】ATU(Address Translation Unit / Address Table Unit)

天赐好车的博客 159

精雕软件(JDpaint) 5.5 绿色版

精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版

大中型超市收银系统(可直接运行)

光步前台收银系统系统功能:商品销售、商品退货、挂单、收银员权限、会员销售、单品取消、整单取消、商品查询、脱机销售、脱机数据上传,基本资料下载,开钱箱、小票打印、收款结算,支持多币种付款方式(现金、储值卡、礼券、微信等),支持多种促销。运行环境:.net 4.0登陆信息用户名:1001 密码:123456内置商品信息,商品编码可输入00001000 - 00010000,测试效果相关功能键F5 结算 F9挂单 F11商品查询 F8退货 Insert单品取消 Del整单取消 F12开钱箱F2 会员 Ctrl+Z退出系统 Home 锁屏 相关源码待公开

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

上一篇: QML歌词从左到右变色效果
下一篇: QML中ListView的C++模型(一)
hp_cpp
博客等级 码龄11年 310粉丝 218原创
评论 4
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值