QML改变TextInput或者其它输入框光标颜色

今天有小伙伴问起改变输入框光标颜色的那些事，今天把它记录下来，希望能给大家带来方便。

先看看效果：

QML中自带的TextInput本身是带光标的，默认的是黑色。

TextInput等输入框控件提供了cursorDelegate属性，我们可以通过控件的形式改变，如下：

TextInput{
   id:m_textInput
   font.pixelSize: parent.height
   anchors.fill: parent
   cursorDelegate: cursor
   focus: true
 }
 Component{
   id:cursor
   Rectangle{
     id:cursorRect
     width: 2
     height: 40
     color: "red"
   }}

但是你会发现这样改完的图标不会闪烁，定时器吧，可以自定义闪烁频率，代码如下：

import QtQuick 2.5
 import QtQuick.Window 2.2

 Window {
     visible: true
     width: 640
     height: 480
     property int num: 1

     Rectangle {
         anchors.fill: parent
         color: "black"

         Rectangle {
             id:centerRect
             width: 300
             height: 50
             anchors.centerIn: parent
             color:"white"
             TextInput{
                 id:m_textInput
                 font.pixelSize: parent.height
                 anchors.fill: parent
                 cursorDelegate: cursor
                 focus: true
             }
             Component{
                 id:cursor
                 Rectangle{
                     id:cursorRect
                     width: 2
                     height: 40
                     color: (num == 1) ? "red" : "white"
                 }
             }
             Timer{
                 interval: 300;
                 repeat: true;
                 running: true
                 onTriggered: {
                     num = (num == 1) ? 0 : 1
                 }
             }
         }
     }
 }