写成前面：做了将近5年的IOS开发，忽然间转行做Qt很是不适应，而且关于Qt的资料也比较少，很多看似特别简单的问题都会查半天。虽然刚开始就做好了踩坑的准备，但在真正开始着手做的时候还是有种崩溃的感觉。因为没有太多时间来系统化学习，所以就把项目过程中遇到的技术点写来记录一下。

1.扁平化的Window窗口

• 不显示标题栏 flags: Qt.FramelessWindowHint，这种状态下窗口就不能拖动了，需要自己实现

  import QtQuick 2.0
  import QtQuick.Window 2.2
  MouseArea {
      property Window targetWindow
      anchors.fill: parent
      property point clickPostion
      onPressed: {
          clickPostion = Qt.point(mouseX,mouseY)
          console.log(clickPostion)
      }
      onPositionChanged: {
          var delatPosition = Qt.point(mouseX-clickPostion.x,mouseY-clickPostion.y)
          targetWindow.x += delatPosition.x;
          targetWindow.y += delatPosition.y;
      }
  }
  

• window无法添加圆角效果，可以将color设置为“transparent”再添加一个Rectangle上去，如果看不到效果需要设置一下visable属性为true

2.Qt二维码生成

• 下载第三方库libqrencode，然后按照github示例在资源文件目录下使用终端执行如下命令生成config.h文件

  ./configure
  make
  sudo make install
  

• 将包括config.h在内的.c和.h文件共21个文件导入工程，删除qrenc.c文件。

• 在pro文件中添加宏DEFINES +=HAVE_CONFIG_H

• 集成完毕，编辑

• 创建一个c++类，生成二维码图片QImage,画的代码github上有很多示例，我也忘了在哪扒出来的了，贴出代码

  void QRCodeMaker::make(){
      QImage image(this->_size, QImage::Format_RGB32);
      image.fill(QColor("black"));
      
      QPainter painter(&image);
      if(!painter.isActive()){
      }else{
          QRcode *qrCode = QRcode_encodeString(this->_data.toUtf8().data(), 1, QR_ECLEVEL_H, QR_MODE_8, true);
          if(!qrCode){
              QColor error("white");
              painter.setBrush(error);
              painter.setPen(Qt::NoPen);
              painter.drawRect(0, 0, image.width(), image.height());
              painter.end();
          }else{
              QColor colorForPoint("black");
              QColor colorForBackgroud("white");
              //先画背景
              painter.setBrush(colorForBackgroud);
              painter.setPen(Qt::NoPen);
              painter.drawRect(0, 0, image.width(), image.height());
              //再画二维码图案
              painter.setBrush(colorForPoint);
              const double &&s = ( qrCode->width > 0 ) ? ( qrCode->width ) : ( 1 );
              const double &&aspect = image.width() / image.height();
              const double &&scale = ( ( aspect > 1.0 ) ? image.height() : image.width() ) / s;
              for ( int y = 0; y < s; ++y )
              {
                  const int &&yy = static_cast< int >( y * s );
                  for( int x = 0; x < s; ++x )
                  {
                      const int &&xx = yy + x;
                      const unsigned char &b = qrCode->data[xx];
                      if( b & 0x01 )
                      {
                          const double rx1 = x * scale, ry1 = y * scale;
                          QRectF r( rx1, ry1, scale, scale );
                          painter.drawRects( &r,1 );
                      }
                  }
              }
              QRcode_free( qrCode );
              painter.end();
          }
      }
     //自定义一个ImageProvider类，将图片扔进去，以供qml获取
      ImageProvider *provider = ImageProvider::getInstance();
      provider->img = image;
      //发个信号出去
      emit refreshImage();
  }
  

3.使c++的QImage可以供qml使用

• 基于QQuickImageProvider创建一个子类如ImageProvider，并重写两个方法requestPixmap和requestImage，以及成员变量QImage img

• 写一个单例static ImageProvider* getInstance()，因为添加provider要在main函数中写(或许可以在其他地方？刚接触qt不是很清楚，暂且只能这样用了)，后续给provider设置图片时也要给这个对象。(或许有其它方案~)

• 在main.cpp中将imageprovider添加到engine

    ImageProvider *imageprovier = ImageProvider::getInstance();
    engine.addImageProvider("imageprovider", imageprovier);
  

4.在qml中使用c++的方法

• 在需要暴露出去的c++中的方法前面使用Q_INVOKABLE关键字修饰，如果是变量则需要使用Q_PROPERTY并同时实现READ和WRITE方法，还有一个NOTIFY可用可不用，例如

  class QRCodeMaker  : public QObject
  {
      Q_OBJECT
      Q_PROPERTY(QSize qrSize READ qrSize WRITE setQrSize)
      Q_PROPERTY(QString qrData READ qrData WRITE setQrData)
  public:
       explicit QRCodeMaker();
      ~QRCodeMaker();
  
      QSize qrSize();
      void setQrSize(QSize size);
  
      QString qrData();
      void setQrData(QString data);
  
      Q_INVOKABLE void make();
  private:
     QSize _size;
     QString _data;
  signals:
     void refreshImage();
  public slots:
  };
  

• main.cpp中引入要注册的头文件，在main函数注册qmlRegisterType<QRCodeMaker>("QRenCode", 1, 0 , "QRCodeMaker");；QRCodeMaker是c++里面的Class名，QRenCode就是在qml中使用的类名，1和0代表版本号

• 在qml文件中引入import QRenCode 1.0，使用示例

  QRCodeMaker {
          id:maker
          qrSize: Qt.size(200,200)
          qrData: "*"
          onRefreshImage: {
              qrCodeImage.source = "image://imageprovider/"                
          }
      }