title: make QML TextField to blinking
body: <p>I want <code>TextField</code> to blink when button is clicked. It easy to do with QTimer: </p>
  
  <pre><code>void MyLineEdit::buttonClickedSlot{
  for(int i=1;i&lt;15;i+=2){
      QTimer::singleShot(100*i, this, SLOT(changeBackgroundColor("QLineEdit{background: red;}")));
      QTimer::singleShot(100*(i+1), this, SLOT((changeBackgroundColor("QLineEdit{background: white;}")));
  
  } 
  }
  void MyLineEdit::changeBackgroundColor(QString str){
       this-&gt;setStyleSheet(str)
  }
  </code></pre>
  
  <p>However, I did not find anything like <code>QTimer</code> in <code>QML</code> so I decided to do it via animation. Here <code>QML</code> is code:</p>
  
  <pre><code>Rectangle{
  ColumnLayout{
      anchors.fill: parent
      TextField{
          id: txt
          text: "hello"
          style: TextFieldStyle{
              background:Rectangle {
                  id: rect    
                  radius: 2
                  implicitWidth: 100
                  implicitHeight: 24
                  border.color: "#333"
                  border.width: 1
                  color: "white"
              }
          }
      }
      ColorAnimation{
          id: whiteToRed
          target: rect     //reference error: rect is not defined
          properties: "color"
          from: "white"
          to: "red"
          duration: 300
  
      }
  
      ColorAnimation{
          id: redToWhite
          target: rect    //reference error: rect is not defined
          properties: "color"
          from: "red"
          to: "white"
          duration: 300
  
      }
  
  
      Button{
          text: "blink"
          onClicked: {
              for(var i=0;i&lt;3;i++){
                  whiteToRed.start()
                  redToWhite.start()
              }
          }
      }
  
  }
  }
  </code></pre>
  
  <p>The problem here is that there are compile error: rect is not defined. How should I solve that problem?</p>