盛世清平~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;

    }