盛世清平~Qt quick学习笔记_04

加载网络图片

 Rectangle{

         width:480;

         height:320;

         color:"#121212";

         BusyIndicator{

             id:busy;

             running:true;

             anchors.centerIn: parent;

             z:2;

         }

         Text{

             id:stateLabel;

             visible: false;

             anchors.centerIn: parent;

             z:3;

         }

         Image{

             id:imageViewer;

             asynchronous: true;//只有想要异步加载本地资源时才需要设置它

             cache:false;//告诉Image不用缓存图片

             anchors.fill: parent;

             fillMode:Image.PreserveAspectFit;//等比缩放模式

             //信号处理器，Image的status属性变化时会发射satusChanged()信号

             onStatusChanged: {

                 if(imageViewer.states ===Image.Loading){

                     busy.running = true;

                     stateLabel.visible = false;

                 }

                 else if(imageViewer.status === Image.Ready){

                     busy.running = false;

                 }

                 else if(imageViewer.status === Image.Error){

                     busy.running = false;

                     stateLabel.visible = true;

                     stateLabel.text = "ERROR";

                 }

             }

         }

         Component.onCompleted: {

             imageViewer.source =

                     "http://pic4.nipic.com/20091217/3885730_124701000519_2.jpg";

BusyIndicator

用来显示一个等待图元，耗时操作，缓解用户的焦躁情绪

一个转圈圈的动画

 BusyIndicator{

        id:busy;

        running:true;

        anchors.centerIn: parent;

        z:2;

    }

 BusyIndicator{

        id:busy;

        running:true;

        anchors.centerIn: parent;

        z:2;

    }