QML 加载网络资源图片https协议的图片

图片和颜色

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.5

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")
    /*        蓝色文本           */
    Rectangle {
        width: 350; height: 2*100
        color: "lightblue"
        
        BusyIndicator {
            id: busy
            running: true
            anchors.centerIn: parent
            z: 2
        }
        
        Text {
            id: myTxt
            x: 50; y: 20; width: 150
            //自动换行
            wrapMode: Text.WordWrap
            font.pixelSize: 20
            //倾斜
            font.italic: true
            text: "Blessed are those with wooden heads
                    for not being able to drown."
            z:3
        }
        
        Image {
            id: myPic
            //异步加载模式,在加载的同时运行代码
            asynchronous: true
            //不需要缓存
            cache: false
            anchors.fill: parent
            //均匀缩放,必要时裁剪
            fillMode: Image.PreserveAspectFit
            onStatusChanged: {
                if(myPic.status === Image.Loading) {
                    busy.running = true
                    myTxt.visible = false
                }
                else if(myPic.status === Image.Ready) {
                    busy.running = false
                }
                else if(myPic.status === Image.Error) {
                    busy.running = false
                    myTxt.visible = true;
                    myTxt.text = "ERROR"
                }
            }
            /*图片方法三*/
            //加载网络资源图片
        }
        
        Component.onCompleted: {
            myPic.source = "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1564803155,558655924&fm=26&gp=0.jpg"
        }
    }
    
    //   Rectangle {
    //        /*矩形*/
    //        width: 320; height: 200
    //        color: "blue"
    //        border.color: "#808080"
    //        border.width: 2
    //        radius: 12
    /*颜色方法一*/
    //直接加入颜色英文名
    //       width: 100; height: 100
    //       color: "red"
    //       //初始化对象后发送Completed信号
    //       Component.onCompleted: console.log("Completed quit!")
    /*颜色方法二*/
    //可以使用“#RRGGBB”或者“#AARRGGBB”来指定,Alpha透明度
    //       width: 100; height: 100
    //       color: "#00AA00"
    /*颜色方法三*/
    //       width: 100; height: 100
    //       color: "#800000B0"
    /*颜色方法四*/
    //       width: 100; height: 100
    //       color: Qt.rgba(0.8, 0.6, 0.4, 1.0)
    //   }
    //   Rectangle {
    //        width: 350; height: 200
    //        color: "lightblue"
    //        Image {
    /*图片方法一*/
    //先在资源文件(qrc)中添加图片文件,然后加入图片名
    //            source: "timg.jpg"
    /*图片方法二*/
    //直接加入图片名及其前缀地址
    //            source: "file:///D://Users//Documents//untitled3//timg.jpg"
    //            id: myPic
    //            width: parent.width
    //        }
    //        Text {
    //            width: 300
    //            text: "Editable hello!"
    //        }
    //   }
}

遇到问题一:
加载网络资源图片https协议的图片时报错
解决方法:
下载OpenSSL插件并安装到电脑,将插件中以下两个文件复制到正在编译的文件夹中,比如debug文件夹
在这里插入图片描述
鼠标拖放事件:
参考网址:
https://blog.csdn.net/foruok/article/details/41747085/

你可能感兴趣的:(QT,qml)