blackberry10에서 사용자 정의 컨트롤의 터치 이벤트를 처리하는 방법

Question

각 행에 이미지와 레이블이있는 customContextMenu.qml이라는 사용자 지정 컨트롤이 있습니다. 해당 이미지를 클릭/터치하고 함께 레이블을 처리하고 싶습니다. 어떻게해야합니까?

현재 이미지와 라벨이 포함 된 각 컨테이너에 onTouch()을 추가하지만 작동하지 않습니다. 내 main.qml에 그 customContextMenu 컨트롤을 사용하고 있습니다.

Container { 

    id: testPageCustomMBoxContainer 
    objectName: "testPageCustomMBoxContainer" 

    background:dropdownBack.imagePaint 
    attachedObjects: [ 
    ImagePaintDefinition { 
     id: dropdownBack 
     repeatPattern: RepeatPattern.Fill 
     imageSource: "asset:///images/dropdown_bg.png" 
    } 
    ] 

layout: StackLayout { 
    orientation: LayoutOrientation.TopToBottom 
} 

maxWidth: 200.0 
maxHeight: 180.0 
horizontalAlignment: HorizontalAlignment.Right 
verticalAlignment: VerticalAlignment.Top 

Container { 

    id: testPageCustomMBoxRetestContainer 
    objectName: "testPageCustomMBoxRetestContainer" 

    preferredWidth:200.0 
    preferredHeight:90.0 
    layout: StackLayout { 
    orientation: LayoutOrientation.LeftToRight 
    } 

    leftPadding: 10.0 
    topPadding: 10.0 
    bottomPadding: 10.0 
    rightPadding: 20.0 
    ImageView { 
    imageSource: "asset:///images/retest.png" 
    scalingMethod: ScalingMethod.AspectFit 
    verticalAlignment: VerticalAlignment.Center 
    layoutProperties: StackLayoutProperties { 
     spaceQuota: 1.0 
    } 
    } 

    Label { 
    text: "Retest" 
    horizontalAlignment: HorizontalAlignment.Right 
    verticalAlignment: VerticalAlignment.Center 
    textFormat: TextFormat.Plain 

    layoutProperties: StackLayoutProperties { 
     spaceQuota: 3.0 
    } 
    } 

    onTouch: {  
    var retestPage = retestPage.createObject(); 
    testNavigationPane.push(retestPage); 
    } 
    attachedObjects: [ 
    ComponentDefinition { 
     id:retestPage 
     source: "main.qml" 
    } 
    ] 
} 
Container { 

    id: testPageCustomMBoxHelpContainer 
    objectName: "testPageCustomMBoxHelpContainer" 

    preferredWidth: 200.0 
    preferredHeight: 90.0 
    layout: StackLayout { 
    orientation: LayoutOrientation.LeftToRight 
    } 

    leftPadding: 10.0 
    topPadding: 5.0 
    bottomPadding: 15.0 
    rightPadding: 20.0 
    ImageView { 
    imageSource: "asset:///images/help.png" 
    scalingMethod: ScalingMethod.AspectFit 

    verticalAlignment: VerticalAlignment.Center 

    layoutProperties: StackLayoutProperties { 
     spaceQuota: 1.0 
    } 
    } 

    Label { 
    text: "Help" 
    horizontalAlignment: HorizontalAlignment.Right 
    verticalAlignment: VerticalAlignment.Center 
    textFormat: TextFormat.Plain 
    layoutProperties: StackLayoutProperties { 
     spaceQuota: 3.0 
    } 

    onTouch: { 
     var helpPage = helpPage.createObject(); 
     testNavigationPane.push(helpPage); 
    } 
    attachedObjects: [ 
     ComponentDefinition { 
     id: helpPage 
     source: "helpPage.qml" 
     Page { 
      paneProperties: NavigationPaneProperties { 
      backButton: ActionItem { 
       onTriggered: { 
       testNavigationPane.pop(); 
       } 
      } 
      } 
     } 
     } 
    ] 
    } 
} 

Answer 1

제스처 핸들러를 사용하면 터치하거나 길게 누르는 것과 같은 작업을 수행해야합니다. onTouch 이벤트는 사용자가 손가락을 아래로 잡고 있거나 유사한 상태에서 뭔가를하려는 경우에만 사용됩니다. 다음은이 둘의 차이점을 보여주는 코드의 예입니다.

//Touched event - only fires if user touches and lets go of element. 
//This is the preferred method 
gestureHandlers: [ 
    TapHandler { 
     onTapped: { 
      //Code goes here 
     } 
    } 
] 

//Display active image if touched 
//This would be used for something such as changing a background color of a button when pressed. 
onTouch: { 
    if (event.touchType == TouchType.Down) { 
     //Do something on down touch - e.g. change background color 
    } else if (event.touchType == TouchType.Up || event.touchType == TouchType.Cancel)  { 
     //Users finger has been lifted OR has left the element. 
    } 
}