2013-08-16 5 views
4

OS-X 10.8.4가 설치된 Mac에서 Qt 5.1 및 QtQuick 2.0을 실행 중입니다. 이와 같이, 회전 요소 {} :문제 설정 Qt-QML CoverFlow 회전 각도

I 문제 변형 가변 각도를 설정 데 PathView.angle 각 이미지 성분에 대한 변화

transform: Rotation { 
    axis { x: 0; y: 1; z: 0 } 
    angle: PathView.angle 
} 

. 코드 here for a cover-flow style container을 따라 갔지만 그 예제는 작동하지 않습니다. 요약

은 맨 아래에있는 코드는 (코멘트에 사례 1 참조)이 생성

PathAttribute { name: "angle"; value: somevalue } 
: 변수 PathAttribute 각도를 사용하여 위임 사각형의 각도를 얻을 수

enter image description here

다음 각도는 다음을 사용하여 설정됩니다.

rotation: PathView.angle 

하지만 회전 축이 z 축에 대해 정의되어 있기 때문에 원하는 것은 아닙니다 (회전 각이 y에 대해 정의되어야 함). 그래서 (사례 2)에 가까운 뭔가를 싶습니다

enter image description here

지금 회전축이 정확하지만, 각 사각형의 각도가 모든 일정 (60도, 코드에 정의 된대로).

아래 코드는 케이스 3입니다. 그러나 가변 각도가 Transform과 함께 작동하지 않는 것으로 보아 (각 이미지 컨테이너에 대해 한 번) 오류가 발생합니다. Rotation {} : (왜 ?)

Unable to assign [undefined] to double 

이 방법을 만드는 방법에 대한 제안이 있으십니까?

감사합니다.

import QtQuick 2.0 

Rectangle { 
    id: mainRect 
    width: 1024; height: 300 

    // Flow View: 
    Rectangle { 
     width: parent.width; height: parent.height 
     color: "gray" 

     PathView { 
      id: myPV 
      delegate: pathdelegate 
      anchors.fill: parent 
      model: 11 // provide a range of indices 

      Keys.onLeftPressed: if (!moving && interactive) incrementCurrentIndex() 
      Keys.onRightPressed: if (!moving && interactive) decrementCurrentIndex() 

      preferredHighlightBegin: 0.5 
      preferredHighlightEnd: 0.5 
      focus: true 
      interactive: true 

      path: Path { 
       id: pathElement 
       startX: 0; startY: myPV.height/2 
       PathAttribute { name: "z"; value: 0 } 
       PathAttribute { name: "angle"; value: 60 } 
       PathAttribute { name: "scale"; value: 0.5 } 
       PathLine { x: myPV.width/2; y: myPV.height/2; } 
       PathAttribute { name: "z"; value: 100 } 
       PathAttribute { name: "angle"; value: 0 } 
       PathAttribute { name: "scale"; value: 1.0 } 
       PathLine { x: myPV.width; y: myPV.height/2; } 
       PathAttribute { name: "z"; value: 0 } 
       PathAttribute { name: "angle"; value: -60 } 
       PathAttribute { name: "scale"; value: 0.5 } 
      } 
     } 

     // Delegate Component: 
     Component { 
      id: pathdelegate 
      Rectangle { 
       id: rect 
       width: 256; height: 256 
       z: PathView.z 
       scale: PathView.scale 
       color: "black" 
       border.color: "white" 
       border.width: 3 

       // Case 1: This works: 
       rotation: PathView.angle 

       //Case 2: This works: 
       //transform: Rotation { 
       // axis { x: 0; y: 1; z: 0 } 
       // angle: 60 
       //} 

       // Case 3: This is the case that I need to work: 
       // This DOES NOT work: 
       // transform: Rotation { 
       // axis { x: 0; y: 1; z: 0 } 
       // angle: PathView.angle 
       //} 
      } 

     } // End: Delegate Component 

    } // End: Flow View: 

} // End: mainRect 

답변

4

는이 http://habrahabr.ru/post/190090/

import QtQuick 2.0 

Rectangle { 
    property int itemAngle: 60 
    property int itemSize: 300 

    width: 1200 
    height: 400 

    ListModel { 
     id: dataModel 

     ListElement { 
      color: "orange" 
      text: "first" 
     } 
     ListElement { 
      color: "lightgreen" 
      text: "second" 
     } 
     ListElement { 
      color: "orchid" 
      text: "third" 
     } 
     ListElement { 
      color: "tomato" 
      text: "fourth" 
     } 
     ListElement { 
      color: "skyblue" 
      text: "fifth" 
     } 
     ListElement { 
      color: "hotpink" 
      text: "sixth" 
     } 
     ListElement { 
      color: "darkseagreen" 
      text: "seventh" 
     } 
    } 

    PathView { 
     id: view 

     anchors.fill: parent 
     model: dataModel 
     pathItemCount: 6 

     path: Path { 
      startX: 0 
      startY: height/2 

      PathPercent { value: 0.0 } 
      PathAttribute { name: "z"; value: 0 } 
      PathAttribute { name: "angle"; value: itemAngle } 
      PathAttribute { name: "origin"; value: 0 } 
      PathLine { 
       x: (view.width - itemSize)/2 
       y: view.height/2 
      } 
      PathAttribute { name: "angle"; value: itemAngle } 
      PathAttribute { name: "origin"; value: 0 } 
      PathPercent { value: 0.49 } 
      PathAttribute { name: "z"; value: 10 } 


      PathLine { relativeX: 0; relativeY: 0 } 

      PathAttribute { name: "angle"; value: 0 } 
      PathLine { 
       x: (view.width - itemSize)/2 + itemSize 
       y: view.height/2 
      } 
      PathAttribute { name: "angle"; value: 0 } 
      PathPercent { value: 0.51 } 

      PathLine { relativeX: 0; relativeY: 0 } 

      PathAttribute { name: "z"; value: 10 } 
      PathAttribute { name: "angle"; value: -itemAngle } 
      PathAttribute { name: "origin"; value: itemSize } 
      PathLine { 
       x: view.width 
       y: view.height/2 
      } 
      PathPercent { value: 1 } 
      PathAttribute { name: "z"; value: 0 } 
      PathAttribute { name: "angle"; value: -itemAngle } 
      PathAttribute { name: "origin"; value: itemSize } 
     } 
     delegate: Rectangle { 
      id: rectDelegate 
      width: itemSize 
      height: width 
      z: PathView.z 
      color: model.color 
      border { 
       color: "black" 
       width: 1 
      } 
      transform: Rotation { 
       axis { x: 0; y: 1; z: 0 } 
       angle: rectDelegate.PathView.angle 
       origin.x: rectDelegate.PathView.origin 
      } 

      Text { 
       anchors.centerIn: parent 
       font.pointSize: 32 
       text: model.text 
      } 
     } 
    } 
} 

자식 개체에서 연결된 속성을 참조, 당신이 참조해야 시도 : 아래

는 내가 뭘하려고 오전 보여 그 간단한 QML 코드 부모를 통해 재산으로. 자세한 내용은 documentation을 참조하십시오.

+0

감사합니다. –

+0

고마워요.이게 정말로 문제의 핵심에 다가가는 데 도움이되었습니다. Rotation 블록에서 PathView.angle에 액세스 할 수 없습니다. –

+0

@RohitWalavalkar : 제 수정으로 수정해야합니다. – Mitch