Cocos Creatorチュートリアル:QRコードを生成する

2107 ワード

Cocos Creatorチュートリアル:QRコード96 Leo 501を生成2018.04.27 14:18*文字数405 1662コメント0を読むのが好き6一般的に応用普及をする時、すべて自分の普及QRコードをします.人によって普及QRコードが異なるため,フロントエンドでコードでユーザ個人に属する普及QRコードを生成する必要がある.あまり話さないで、次にCreatorでユーザー専用の普及QRコードを生成する方法を説明して、文章は最後にDemoを提供してみんなの参考にします.pic 1 QRコード生成ライブラリ
QRcode QRコードを使用してライブラリを生成します.しかし、このライブラリはH 5専用ですが、私たちは曲線で国を救うことができ、Creatorの図面コンポーネントccを使用することができます.Graphics、QRコードを描きます.次に、UrlによってQRコードの白黒ブロックデータを得る方法を示す.
let qrcode = new QRCode(-1, QRErrorCorrectLevel.H); qrcode.addData(url); qrcode.make(); ただし、Urlに中国語が含まれている場合は、QRコードを生成する前に文字列をUTF-8に変換し、QRコードを生成します.
let url=toUtf 8(‘Cocos Creatorチュートリアル:QRコードを生成’);また、微博掃一掃:約200字以内、微信掃一掃:約160字以内、支付宝掃一掃:約130文字以内に注意しなければならないので、一般的なリンクはあまり長くはできません.
プラグインの設定
このステップではQRcodeをプラグインに設定する必要があります.図pic 2を参照してください.
pic2.png完全コード
cc.Class({ extends: cc.Component, properties: {
},
// use this for initialization
onLoad() {
    this.init('http://forum.cocos.com/t/topic/44304/9');
},

init(url){
    var ctx = this.node.addComponent(cc.Graphics);
    if (typeof (url) !== 'string') {
        console.log('url is not string',url);
        return;
    }
    this.QRCreate(ctx, url);
},

QRCreate(ctx, url) {
    var qrcode = new QRCode(-1, QRErrorCorrectLevel.H);
    qrcode.addData(url);
    qrcode.make();

    ctx.fillColor = cc.Color.BLACK;
    //   
    var tileW = this.node.width / qrcode.getModuleCount();
    var tileH = this.node.height / qrcode.getModuleCount();

    // draw in the Graphics
    for (var row = 0; row < qrcode.getModuleCount(); row++) {
        for (var col = 0; col < qrcode.getModuleCount(); col++) {
            if (qrcode.isDark(row, col)) {
                // ctx.fillColor = cc.Color.BLACK;
                var w = (Math.ceil((col + 1) * tileW) - Math.floor(col * tileW));
                var h = (Math.ceil((row + 1) * tileW) - Math.floor(row * tileW));
                ctx.rect(Math.round(col * tileW), Math.round(row * tileH), w, h);
                ctx.fill();
            }
        }
    }
},

}); 注意:ノードの長さと幅を2の倍数に設定したほうがいいです.QRコードが認識できない場合があります