时间戳

首页 > 解决方案 > JavaScript 代码在 Android 上无法正常工作

android - JavaScript 代码在 Android 上无法正常工作

问题描述

我正在用 QML 编写一个跳棋游戏，我有这个组件，它包含玩家部分和它的鼠标区域。

当按下鼠标并且用户移动鼠标时，下面的单元格会以黄色突出显示。这和捕捉在 Ubuntu 上有效，但是当我在 Android 上测试它时，似乎只有拖动部分有效。

这是它在 Ubuntu 上的工作当玩家棋子在单元格上移动时显示捕捉和突出显示的 GIF 动画

这是播放器部分的代码：

Component {
        id: playerPiece
        Image {
            id: image
            property int cx: 0
            property int cy: 0
            x: board.x + (cx * window.cellSize)
            y: board.y + (cy * window.cellSize)
            property int pieceIndex: -1
            property int pieceType: 0
            MouseArea {
                id: ma
                anchors.fill: parent
                enabled: GameState.playerTurnId == 1 && (pieceType & 1) == 1
                drag.target: parent
                drag.axis: Drag.XAxis | Drag.YAxis
                property int targetCellX: -1
                property int targetCellY: -1
                onReleased: {
//                    console.log("released")
                    if (GameState.lastHighlightedIndex != -1
                            && GameState.lastHighlightedY != -1) {
                        board.children[GameState.lastHighlightedY].children[GameState.lastHighlightedX].children[0].visible = false
                        if (targetCellX != -1 && targetCellY != -1) {
                            console.log(targetCellX)
                            var piece = GameState.playerPieceQMLItems[image.pieceIndex]
                            console.log(`cx ${targetCellX} cy ${targetCellY}`)
                            piece.cx = targetCellX
                            piece.cy = targetCellY
                            //hack to recalculate positions
                            board.x++
                            board.x--
                            board.y++
                            board.y--
                            targetCellX = -1
                            targetCellY = -1
                        }
                    }
                }

                onPositionChanged: {
                    if (drag.active) {
//                        console.log("dragging")
                        var mousePos = NativeFunctions.globalMousePos()
                        targetCellX = Math.floor(
                                    (mousePos.x - window.x - board.x) / window.cellSize)
                        targetCellY = Math.floor(
                                    (mousePos.y - window.y - board.y) / window.cellSize)
                        if ((targetCellX > -1 && targetCellX < 8) && (targetCellY > -1
                                                          && targetCellY < 8)) {
                            GameState.tileState[targetCellX + (targetCellY * 8)] = 3
                            //update the board row column child item
                            var item = board.children[targetCellY].children[targetCellX]
                            if (item instanceof Rectangle) {
                                //remove the highlight from the last highlighted cell
                                if (GameState.lastHighlightedIndex != -1
                                        && GameState.lastHighlightedY != -1) {
                                    board.children[GameState.lastHighlightedY].children[GameState.lastHighlightedX].children[0].visible = false
                                }
                                item.children[0].visible = true
                                //console.log(`selected ${GameState.playerPieceQMLItems[image.pieceIndex]}, pieceIndex ${image.pieceIndex}`)
                                //console.log(`${item.children[1].id}`)
                                GameState.lastHighlightedX = targetCellX
                                GameState.lastHighlightedY = targetCellY
                            }
                        }
                    }
                }
            }
            sourceClipRect: {
                if (GameState.cf(pieceType, GameState.TS_P1)) {
                    //king flag set
                    if (GameState.cf(pieceType, GameState.TS_PK)) {
                        return Qt.rect(0, 326, 338, 338)
                    } else {
                        return Qt.rect(0, 0, 338, 338)
                    }
                } else if (GameState.cf(pieceType, GameState.TS_P2)) {
                    //king flag set
                    if (GameState.cf(pieceType, GameState.TS_PK)) {
                        return Qt.rect(0, 326, 338, 338)
                    } else {
                        return Qt.rect(534, 0, 338, 338)
                    }
                }
            }
            source: "qrc:/pieces.png"
        }
    }

这是https://github.com/ben-cottrell-nz/checkers/blob/master/main.qml的一部分。

当我在 Android 上测试我的应用程序时，为什么突出显示和捕捉功能不起作用？

标签： androidqml

解决方案

我发现我的方法从 C++ 中暴露出来，这NativeMethods::globalMousePos是问题所在：在 Android 上它为 x 和 y 返回 -2147483648，这是从QCursor::pos.

我在 QML 代码中更改了 mousePos 以使用内置函数 mapToGlobal： var mousePos = mapToGlobal(mouse.x, mouse.y)

突出显示和对齐矩形现在可以在 Android 上使用。

推荐阅读