自学QT之qml载入网络图片

qml现在也成了QT的主打品牌了，qml的编程效率也是杠杆的。照着书本敲了一段代码，感觉很棒呀！

下面是qml实现载入网络图片的例子，当然，例子是书上的哦，我给加了注释。希望看大此篇博客的朋友可以快速上手。

代码走起！

import QtQuick 2.3
import QtQuick.Window 2.2
import QtQuick.Controls 1.4//导入需要的各种包，很熟悉的java风格？对了，仔细查查qml和java的共同之处吧

Window {
    visible: true
    width: 800                          //设置窗口大小
    height: 600
    Rectangle{
        anchors.centerIn: parent       //这里是一个布局，意思是说部件居中于他的爸爸……
        width: 800                  //设置内部显示图片的方形范围大小，好吧，我只能这么叫，qml用的模型就是那叫啥的方盒模型，大概如此吧
        height: 600
        color: "blue"
        BusyIndicator{                  //这是一个指示器，看名字，叫忙碌指示器。想想你电脑卡死时候那个小圆圈吧，恐怖……
            id:busy
            running: true
            anchors.centerIn: parent
            z:2                     //z序，可以理解为三维坐标，就是说在这个东西显示的次序，也就是谁在前面谁在后面
        }
        Text{                           //文本区域，用来显示按钮的啦。其实这些小部件跟c++里面添加按钮是一个道理
            id:state
            visible: false
            anchors.centerIn: parent
            z:3
        }
        Image {                                 //当然要显示图片就要图片区域啦，你可以理解为图片控件更合适
            id: imageviewer
            asynchronous: true
            cache: false
            anchors.fill: parent
            fillMode: Image.PreserveAspectCrop  //这里是图片怎么显示，意思是：图片太大也不许给我剪去边缘！
            onStatusChanged:  {                //图片显示要经历：载入和准备完毕两个状态，以此做判断是不是要载入那个忙碌的小图标，当然，图片不存在的情况也要考虑呦
                if(imageviewer.status===Image.Loading)
                {
                    busy.running=true;
                    state.visible=true;

                }
                else if(imageviewer.status===Image.Ready)
                {
                    busy.running=false;
                }
                else if(imageviewer.status===Image.Error)
                {
                    busy.running=false;
                    state.visible=true;
                    state.text="error";

                }
            }

        }
        Component.onCompleted: {            //附加处理器，好吧，这是个新玩意。这里做的工作是在载入的时候给图片附上地址，然后程序就开始工作啦。
            imageviewer.source="http://g.hiphotos.bdimg.com/album/s%3D1100%3Bq%3D90/sign=1681e6319e3df8dca23d8b90fd2149fa/d6ca7bcb0a46f21fd847b695f7246b600d33ae81.jpg?v=tbs"
        }

    }

}