找回密码
 立即注册
收起左侧

Qml之FileDialog问题

4
回复
358
查看
[复制链接]

尚未签到

来源: 2019-5-7 09:58:24 显示全部楼层 |阅读模式
1Qter豆
用Qml编写了一个程序,程序中用到了选择文件的功能,于是使用了FileDialog,但是在我的手机里显示异常。请问如何解决。代码如下:

import QtQuick 2.9
import QtQuick.Window 2.2
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import QtQuick.Dialogs 1.2

Window {
visible: true
color: "black"

onWidthChanged: {
    mask.recalc()
}

onHeightChanged: {
    mask.recalc()
}

Image {
    id: source
    anchors.fill: parent
    fillMode: Image.PreserveAspectFit
    visible: false
    asynchronous: true

    onStatusChanged: {
        if(Image.Ready == status) {
            console.log("image loaded")
            mask.recalc()
        }
    }
}

FileDialog {
    id: fileDialog
    title: "Please choose an Image File."
    nameFilters: ["Image Files (*.jpg *.png *.gif)"]

    onAccepted: {
        source.source = fileUrl
    }
}

Canvas {
    id: forSaveCanvas
    width: 128
    height: 128
    contextType: "2d"
    visible: false
    z: 2
    anchors.top: parent.top
    anchors.right: parent.right
    anchors.margins: 4

    property var imageData: null

    onPaint: {
        if(null != imageData) {
            context.drawImage(imageData, 0, 0)
        }
    }

    function setImageData(data) {
        imageData = data
        requestPaint()
    }
}

Canvas {
    id: mask
    anchors.fill: parent
    z: 1
    property real w: width
    property real h: height
    property real dx: 0
    property real dy: 0
    property real dw: 0
    property real dh: 0
    property real frameX: 66
    property real frameY: 66

    function calc() {
        var sw = source.sourceSize.width
        var sh = source.sourceSize.height

        if(sw > 0 && sh > 0) {
            if(sw <= w && sh <= h) {
                dw = sw
                dh = sh
            } else {
                var sRadio = sw / sh
                dw = sRadio * h

                if(dw > w) {
                    dh = w / sRadio
                    dw = w
                } else {
                    dh = h
                }
            }

            dx = (w - dw) / 2
            dy = (h - dh) / 2
        }
    }

    function recalc() {
        calc()
        requestPaint()
    }

    function getImageData() {
        return context.getImageData(frameX - 64, frameY - 64, 128, 128)
    }

    onPaint: {
        var ctx = getContext("2d")

        if(dw < 1 && dh < 1) {
            ctx.fillStyle = "#0000a0"
            ctx.font = "20pt sans-serif"
            ctx.textAlign = "center"
            ctx.fillText("Please Choose An Image File", width / 2, height / 2)

            return
        }

        ctx.clearRect(0, 0, width, height)
        ctx.drawImage(source, dx, dy, dw, dh)
        var xStart = frameX - 66
        var yStart = frameY - 66
        ctx.save()
        ctx.fillStyle = "#a0000000"
        ctx.fillRect(0, 0, w, yStart)
        var yOffset = yStart + 132
        ctx.fillRect(0, yOffset, w, h - yOffset)
        ctx.fillRect(0, yStart, xStart, 132)
        var xOffset = xStart + 132
        ctx.fillRect(xOffset, yStart, w - xOffset, 132)

        ctx.strokeStyle = "red"
        ctx.fillStyle = "#00000000"
        ctx.lineWidth = 2
        ctx.beginPath()
        ctx.rect(xStart, yStart, 132, 132)
        ctx.fill()
        ctx.stroke()
        ctx.closePath()
        ctx.restore()
    }
}

MultiPointTouchArea {
    anchors.fill: parent
    minimumTouchPoints: 1
    maximumTouchPoints: 1
    touchPoints: [
        TouchPoint {
            id: point1
        }
    ]

    onUpdated: {
        mask.frameX = point1.x
        mask.frameY = point1.y
        mask.requestPaint()
    }

    onReleased: {
        forSaveCanvas.setImageData(mask.getImageData())
        actionPanel.visible = true
    }

    onPressed: {
        actionPanel.visible = false
    }
}

Component {
    id: flatButton

    ButtonStyle {
        background: Rectangle {
            implicitWidth: 70
            implicitHeight: 30
            color: control.pressed ? "#a0a0a0" : "#707070"
            border.width: control.hovered ? 2 : 1
            border.color: control.hovered ? "#c0c0c0" : "#909090"
        }

        label: Text {
            anchors.fill: parent
            font.pointSize: 12
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment: Text.AlignVCenter
            text: control.text
            color: (control.hovered && !control.pressed) ? "blue" : "white"
        }
    }
}

Row {
    id: actionPanel
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.bottom: parent.bottom
    anchors.bottomMargin: 20
    spacing: 8
    z: 5

    Button {
        style: flatButton
        text: "Open"

        onClicked: {
            fileDialog.open()
        }
    }

    Button {
        style: flatButton
        text: "Save"

        onClicked: {
            forSaveCanvas.save("selected.png")
            actionPanel.visible = false
        }
    }

    Button {
        style: flatButton
        text: "Cancel"

        onClicked: {
            actionPanel.visible = false
        }
    }
}

}


手机运行截图如下:

回复

使用道具 举报

尚未签到

2019-5-8 08:37:26 显示全部楼层
没有人回答吗?坐等大神指点
回复

使用道具 举报

尚未签到

2019-5-9 17:01:09 显示全部楼层
论坛人气这么低,提问好几天了,居然没有搭理
回复

使用道具 举报

累计签到:728 天
连续签到:1 天
2019-5-10 08:33:13 显示全部楼层
看不见手机运行截图啊
回复

使用道具 举报

尚未签到

2019-5-14 15:52:00 显示全部楼层
wdmxtk002 发表于 2019-5-10 08:33
看不见手机运行截图啊

我当时传了的,但是没显示出来,提交了之后就传不了了
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册