Qt qml listview Drop-down Refresh and pull up pagination are judged mainly by Contenty. But it takes a lot of effort to add a top down pull indicator, a scroll bar, and encapsulate it into a simple, callable component:
First to show you the effect of the picture:
function
Drop-down refresh and pull pagination logic
/drop down refresh
/Pull up more
/scroll bar
/toolbar semi La Xianlin
Author:surfsky.cnblogs.com
lisence:mit Please keep this document declaration
History:
init. surfsky.cnblogs.com, 2015-01
Add Initposition property. 2015-01
Call
Control is very simple to use, as long as the onLoad and Onloadmore events can be achieved, the other and the standard ListView almost.
/** News Example Drop-down Refresh pull page Scroll top toolbar top tool bar automatic adsorption current row highlight Author:surfsky.cnblogs.com 2015-01 * listviewex{Id:view width:500 t:800 pagesize:50 snapheader:true initposition: ' Header '//Top news picture bar headercomponent:component{pageview{width: View.width height:100 clip:true rectangle{width:pv.width; height:pv.height; color: ' Green '} rectangle{width:pv.width; Height:pv.height; Color: ' Yellow '} rectangle{width:pv.width height:pv.height; color: ' Blue '}}//Row UI proxy Delegate:text {id:wrapper; wid
Th:parent.width;
height:32;
font.pointsize:15;
VerticalAlignment:Text.AlignVCenter;
HorizontalAlignment:Text.AlignHCenter;
Text:content; Color:ListView.view.currentIndex = = index?
"White": "#505050"; Mousearea {anchors.fill:parent; onclicked:wrapper.
ListView.view.currentIndex = index; }//-----------------------------------------//Data loading Event//-----------------------------------------onload:{for ( var i = 0; i < pageSize; ++i) model.append ({"Index": I, "content": "Item" + i}} onloadmore:{for (var i = Pagesize*page i < pagesize* (page+1); ++i) model.append ({"Index": I, "content": "It Em "+ i})}}
"Core Code"
It's too long to intercept the Contenty Processing section and the other downloads look at it.
-------------------------------------//Drop down refresh and pull pagination logic//-------------------------------------onmovementended: {// Console.log ("Movementended:originy:" + Originy + ", Contenty:" + Contenty + ", Reflesh:" + Needreflesh + ", more:" + need
Loadmore); Refresh data if (Needreflesh) {lv.headerItem.goState (' load '); Model.reflesh (); needreflesh = false;}//Load new data else if (Needloa Dmore) {model.loadmore (); needloadmore = false;} else {var h1 = Lv.headerItem.loader.height; var h2 = Lv.headerItem.indi
Cator.height; Head area is automatically hidden (drag over small hidden head, display) if (Snapheader) {if (Contenty >=-h1/3 && contenty < 0) Movetofirst (); if (content
Y >=-h1 && contenty <-H1/3) Movetoheader ();
///Refresh area automatically hidden if (Contenty >=-(H1+H2) && Contenty <-H1) Movetoheader (); } oncontentychanged: {//Dropdown refresh judgment logic: It's already over, and it's still down a certain distance if (Contenty < originy) {var dy = contenty-originy; if (Dy <-1 0) {lv.headerItem.goState (' ready '); Needreflesh = true;} else {if (pressed) {//console.log (pressed);
Needreflesh = false; How can I tell if the current mouse is pressed?
If the state is pressed to cancel the refresh lv.headerItem.goState ('); "}}//Pull Load judgment logic: It's already in the end, still pull a certain distance if (contentheight>height && contenty-originy > Contentheight-height) {var dy
= (contenty-originy)-(contentheight-height);
Console.log ("y:" + contenty + ", dy:" + dy); if (Dy >) {Needloadmore = true;//console.log ("Originy: + Originy +", Contenty: "+ Contenty +", Height: "+ height + ", Contentheight:" + Contentheight);}}
The above is a small series to introduce the QT qml ListView List View Control (Drop-down refresh, pull page, scroll axis), I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!