2016-11-26 50 views
1

我有一个列表视图。如果我点击一个单元格,该特定的单元格需要移动到一个小的滚动动画中心。用我的代码,被点击的单元格将在没有任何动画的情况下到达中心。如何将列表视图滚动到当前项目?

有没有可能为此添加动画?

我把我下面的代码:

ListView { 
     id: source_list 
     width: 1080 
     height: 480 
     spacing: 50 
     model: mediaSongsModel 
     delegate: mediaSongsDelegate 
     focus: true 
     interactive: true 
     clip: true 
     highlightMoveDuration: 50 
     snapMode: ListView.SnapToItem 
     boundsBehavior:Flickable.StopAtBounds 
     preferredHighlightBegin: 260/scaleFactor 
     preferredHighlightEnd: 260/scaleFactor 
     highlightRangeMode: ListView.StrictlyEnforceRange 
    }     

    Component { 
     id: mediaSongsDelegate 
     Item { 
      id: wrapper 
      width: 1080 
      height: 200 

      MouseArea { 
       anchors.fill: parent 
       onClicked: { 
        source_list.currentIndex = index 
        source_list.positionViewAtIndex(index,ListView.Center)  
       } 
      }   
     } 
    } 
+1

您提供的代码不起作用。您的物品委托不可见。什么是'scaleFactor'?如果您想获得答案,请使用* working *示例更新代码。 – folibis

回答

1

如果当前项应始终处于中心或在一个特定的人的观点,那么你可以使用preferredHighlightBeginpreferredHightlightEnd属性来定义该区域。

highlightRangeMode的值控制是否如果是,这适用的严格程度。例如。如果第一个项目是当前项目,并且值为StriclyEnforeRange,则该项目将位于指定区域内,即使这意味着进一步滚动比正常的“滚动到顶部”更多。

类似的东西应该工作

ListView { 
    preferredHighlightBegin: height/2 - 100 // 100 being item height/2 
    preferredHighlightEnd: height/2 + 100 // 100 being item height/2 
    highlightRangeMode: ListView.StrictlyEnforceRange 
} 
+0

但这对我有用。但是没有向上/向下滚动动画。 –

+0

奇怪的是,当我这样做时,新的当前项目移动到首选范围,并且列表相应地移动。 –

+0

其实问题出在source_list.positionViewAtIndex(index,ListView.Center);当我删除它的工作。感谢您的支持。 –

1

我已经解决了我的问题,通过删除下面的代码行:

source_list.positionViewAtIndex(index,ListView.Center); 

动画工作正常。

相关问题