初学qt 用qt做的图片查看器超级简陋（按照《Qt quick核心编程》一书敲的）

代码如下

import QtQuick 2.2import QtQuick.Window 2.1import QtQuick.Controls 1.1import QtQuick.Controls.Styles 1.1import QtQuick.Dialogs 1.1Window {    visible: true    width: 960    height: 680    title: "图片查看器"    BusyIndicator {        id: busy        running: false        anchors.centerIn: parent        z: 2    }    //文字    Text {        id: statusLable        anchors.centerIn: parent        visible: false    }    Text {        id: path        anchors.left: openButton.right        anchors.leftMargin: 40        //水平对齐        anchors.verticalCenter: openButton.verticalCenter        visible: true        color: "black"        font.pixelSize: 20        z: 5    }    //按钮    Button {        id: openButton        anchors.left: parent.left        anchors.leftMargin: 4        anchors.bottom: parent.bottom        anchors.bottomMargin: 8        isDefault: true        Text {            id: textButton            text: "打开图片"            anchors.centerIn: parent        }        //ButtonStyle 有background，control，label三个属性        //background，label属性类型为component        //当background为rectangle时        //按钮就按照rectangle的构造来了        //control属性可以访问按钮的各个状态        style: ButtonStyle {            background: Rectangle {                //这样不好用，直接implicitwidth                // width: 700                // height: 250                implicitWidth: 70                implicitHeight: 25                radius: 4                //填充颜色                color: control.hovered ? "#7D7D7D" : "#D2D2D2"                //边框宽度                border.width: control.pressed ? 4 : 2                //边框颜色                border.color: (control.pressed || control.hovered) ? "black" : "#4C4C4C"            }        }        onClicked: {            fileDialog.open()        }        z: 5    }    //图片    Image {        id: imageView        anchors.rightMargin: 0        anchors.bottomMargin: 42        anchors.leftMargin: 0        anchors.topMargin: 22        //Image默认阻塞式的加载图片        //网络资源默认异步加载        //开启异步加载模式        asynchronous: true        //缓存        cache: false        //填充模式fillMode        //包括Image.Stretch（拉伸）        //Image.PreserveAspectFit（等比缩放）        //Image.Preservespectrop（等比缩放，最大化填充，必要时裁剪）        //Image.Tile（水平与垂直平铺）        //Image.TileVertically Image.TileHorizontally（垂直，水平平铺）        //Image.Pad（保持原样）        fillMode: Image.PreserveAspectFit        anchors.fill: parent        //onStatusChanged信号处理器        //Image的status属性变化会发射statusChanged（）信号        //属性变化触发的信号对应的信号处理格式为on<Property>Changed        onStatusChanged: {            if (imageView.status == Image.Loading) {                busy.running = true                statusLable.visible = false            }            else if (mageView.status == Image.Ready) {                busy.running = false                statusLable.visible = false            }            else {                busy.running = false                statusLable.visible = true                statusLable.text = "打开图片出错"            }        }    }    //文件    //FileDalog是平台相关的    //visible默认false    //显示对话框调用open方法或者visible设置为true    //selectExisting 默认true 选择已有文件或文件夹    //false 供用户创建文件或文件夹的名字    //selectFold 默认false 表示选择文件， true 选择文件夹    //selectMultiple 默认false 单选， true 多选    //FileDialog 支持名字过滤    //nameFilters设定一个过滤器列表    //selectedNameFilter保存用户选择的过滤器或者用来设置初始的过滤器    //modality 默认为Qt.WindowModal fileUrl保存文件的路径    //fileUrls为一个列表，保存用户选择的所有路径    //folder 存放用户选择的（文件所在）文件夹的位置    FileDialog {        id: fileDialog        title: "打开图片文件"        //名称过滤        nameFilters: [ "Image Files (*.jpg *.png *.gif)",                                "Bitmap Files (*.bmp)",                                "* (*.*)"]        //默认显示哪一个        select<pre name="code" class="plain">import QtQuick 2.2import QtQuick.Window 2.1import QtQuick.Controls 1.1import QtQuick.Controls.Styles 1.1import QtQuick.Dialogs 1.1

edNameFilter: "Bitmap Files (*.bmp)"
        //多选
        selectMultiple: true
        onAccepted: {
            imageView.source = fileDialog.fileUrls[2]
            //var imageFile = new string(fileDialog.fileUrl)
            path.text = imageView.source.toString()
        }
    }
}