- แล้วรหัส QR นี้คืออะไร?
- สร้างรหัส QR ของคุณเอง
- การแปลง PNG เป็นรูปแบบ BMP
- แปลงรูปภาพ BMP เป็นอาร์เรย์ของรหัส HEX
- แผนภูมิวงจรรวม
- คำอธิบายรหัส
รหัส "การตอบกลับด่วน" หรือเรียกโดยย่อว่ารหัส QR ได้กลายเป็นส่วนสำคัญในชีวิตดิจิทัลของเราโอกาสที่คุณจะคุ้นเคยกับสิ่งเหล่านี้โดยไม่รู้ตัวแล้วในตอนนี้คุณอาจจะสัญจรไปมาในร้านขายของชำในพื้นที่ของคุณหรืออาจเป็นคุณ อ่านหนังสือเล่มโปรดของคุณหรือแม้กระทั่งคุณกำลังชำระเงินออนไลน์ด้วย Google Pay, PhonePe หรือ Paytm หรือท่องเว็บ ฯลฯ (ฉันคิดว่าฉันสามารถดำเนินการต่อไปพร้อมกับตัวอย่างได้หรือไม่) และคุณก็เกิดขึ้น ในสิ่งที่ดูแปลก ๆ นี้และคิดว่าสิ่งที่เป็นสี่เหลี่ยมจัตุรัสนี้คืออะไรและถ้าคุณยังไม่ได้… อย่ากังวลว่ามันจะเกิดขึ้นไม่ช้าก็เร็วดังนั้นเพื่อให้เข้าใจหัวข้อได้ดีขึ้นเราจะทำ โปรเจ็กต์สนุก ๆ กับArduino และ OLEDและทำให้เข้าใจสิ่งต่างๆต่อไปนี้:
- แนวคิดพื้นฐานของรหัส QR
- มันทำงานอย่างไร.
- วิธีสร้างรหัส QR ของคุณเองโดยใช้ Arduino
- และสุดท้ายแสดงในหน้าจอ OLED (SSD1306)
แล้วรหัส QR นี้คืออะไร?
QR code (Quick Response code) คือเมทริกซ์ 2D โค้ดสำหรับอ่านข้อมูลด้วยความเร็วสูงพัฒนาโดย DENSO WAVE ในปี 1994 สำหรับอุตสาหกรรมยานยนต์ของญี่ปุ่น รหัส QR บีบอัดข้อมูลได้อย่างมีประสิทธิภาพมากเมื่อเทียบกับบาร์โค้ดมาตรฐานเพื่อให้บรรลุสิ่งนี้จะใช้โหมดการเข้ารหัสมาตรฐานสี่โหมด (ตัวเลขตัวอักษรและตัวเลขไบต์ / ไบนารีและคันจิ) เทคโนโลยีนี้ถูกสร้างขึ้นมาเป็น "โอเพ่นซอร์ส" ซึ่งทุกคนสามารถใช้ได้ ได้รับความนิยมอย่างรวดเร็วข้อได้เปรียบที่สำคัญของ QR Codes เหนือบาร์โค้ดทั่วไปคือความจุข้อมูลที่มากขึ้นและความทนทานต่อความผิดพลาดสูง
QR Code ทำงานอย่างไร?
รหัส QR (และรหัสเมทริกซ์ข้อมูลอื่น ๆ) ได้รับการออกแบบมาเพื่อให้อ่านโดยเครื่องมือพิเศษไม่ใช่โดยมนุษย์ดังนั้นจึงมีเพียงจำนวนที่เฉพาะเจาะจงเท่านั้นที่เราสามารถเข้าใจได้โดยการศึกษาด้วยภาพแม้ว่าทุกรหัสจะแตกต่างกันในหลาย ๆ ด้านแม้ว่าจะมีบางส่วนที่น่าสนใจ โดยสังเกต QR code ของ circuitdigest.com เราจะศึกษาบางส่วน
- รูปแบบการค้นหา:กล่องสี่เหลี่ยมขนาดใหญ่ที่มีกล่องทึบอยู่ด้านในที่มุมทั้งสามของโค้ดทำให้ง่ายต่อการยืนยันว่าเป็นรหัส QR เนื่องจากมีเพียงสามรหัสเท่านั้นดังนั้นจึงค่อนข้างชัดเจนว่าโค้ดจะเน้นไปทางใด
- รูปแบบการจัดตำแหน่ง:ทำให้มั่นใจได้ว่าการวางแนวใดก็ตามที่โค้ดสามารถอ่านได้
- แบบเวลา:นี้จะทำงานในแนวนอนและแนวตั้งระหว่างสามรูปแบบการค้นหา,การใช้เส้นเหล่านี้ผู้อ่านสามารถกำหนดขนาดของรหัส
- ข้อมูลเวอร์ชัน:ปัจจุบันมีมาตรฐานรหัส QR ที่แตกต่างกัน 40 เวอร์ชันส่วนนี้ของโค้ดจะกำหนดเวอร์ชันรหัส QR ที่ใช้สำหรับการตลาดเวอร์ชัน 1-7 ที่ใช้ตามปกติ
- ข้อมูลรูปแบบ:พันธมิตรรูปแบบมีข้อมูลเกี่ยวกับการยอมรับข้อผิดพลาดและการกำบังข้อมูล
- พื้นที่ข้อมูล:ส่วนนี้ของรหัสประกอบด้วยองค์ประกอบข้อมูลและรหัสแก้ไขข้อผิดพลาดพร้อม
- ออกจากโซน: ต้องมีการเว้นวรรคในโค้ด QR ทุกรหัสเพื่อแยกความแตกต่างของรหัสจากสภาพแวดล้อม
ภาพด้านล่างนี้จะให้แนวคิดที่ชัดเจนเกี่ยวกับโค้ด
ส่วนอื่น ๆ ของรหัสคือข้อมูลและรหัสซ้ำซ้อน
มีคุณสมบัติอื่น ๆ และหัวข้อที่ซับซ้อนอีกมากมายที่ฉันจะไม่พูดถึงในบทช่วยสอนนี้หากคุณต้องการอ่านรายละเอียดเพิ่มเติมเกี่ยวกับรหัส QR โปรดทำตามบทแนะนำ QR Code โดย Tan Jin Soon, EPCglobal Singapore Council วารสาร Synthesis, 2551.
ข้อกำหนดของรหัส QR
ขนาดสัญลักษณ์ |
นาที. เซลล์ 21x21 - สูงสุด. เซลล์ 177x177 (มีช่วง 4 เซลล์) |
|
ประเภทข้อมูลและปริมาณ |
อักขระตัวเลข |
สูงสุด 7,089 อักขระ |
ตัวอักษรสัญญาณ |
สูงสุด 4,296 อักขระ |
|
ไบนารี (8 บิต) |
สูงสุด 2,953 อักขระ |
|
ตัวอักษรคันจิ |
สูงสุด 1,817 อักขระ |
|
ประสิทธิภาพการแปลง |
โหมดอักขระตัวเลข |
3.3 เซลล์ / ตัวอักษร |
โหมดตัวอักษรและตัวเลข / สัญญาณ |
5.5 เซลล์ / ตัวอักษร |
|
โหมดไบนารี (8 บิต) |
8 เซลล์ / ตัวอักษร |
|
โหมดอักขระคันจิ (13 บิต) |
13 เซลล์ / ตัวอักษร |
|
แก้ไขข้อผิดพลาด ฟังก์ชันการทำงาน |
ระดับ L |
ประมาณ. 7% ของพื้นที่สัญลักษณ์คืนค่าสูงสุด |
ระดับ M |
ประมาณ. 15% ของพื้นที่สัญลักษณ์คืนค่าสูงสุด |
|
ระดับ Q |
ประมาณ. 25% ของพื้นที่สัญลักษณ์คืนค่าสูงสุด |
|
ระดับ H |
ประมาณ. 30% ของพื้นที่สัญลักษณ์คืนค่าสูงสุด |
|
ฟังก์ชันการเชื่อมโยง |
สามารถแบ่งออกได้สูงสุด 16 สัญลักษณ์ |
สร้างรหัส QR ของคุณเอง
ทำตามขั้นตอนด้านล่างเพื่อสร้างรหัส QR ของคุณเองในตัวอย่างนี้เราจะสร้างรหัส QR ของเว็บไซต์Circuit Digestอันเป็นที่รักของเรา
ในการสร้างรหัส QR ให้ไปที่เว็บไซต์นี้และหากคุณดูที่ด้านบนของเว็บไซต์คุณจะเห็นรายการตัวเลือกในบทช่วยสอนนี้เรากำลังสร้างรหัส QR สำหรับ URL ดังนั้นเราจะไปที่
- คลิกที่แท็บ URL และวาง URL สำหรับ Circuit Digest ในส่วน Enter URL
- คลิกที่บันทึก
- ตั้งชื่อไฟล์สำหรับไฟล์เอาต์พุต
- เลือก PNG เป็นรูปแบบไฟล์ที่เราต้องการ
- แล้วคลิกบันทึก
ภาพด้านล่างจะให้แนวคิดที่ชัดเจนเกี่ยวกับกระบวนการนี้
ไมโครคอนโทรลเลอร์“ Arduino” สุดที่รักของเราไม่ฉลาดพอที่จะรวบรวมภาพ PNG ดิบและแสดงในจอแสดงผล OLED ดังนั้นในการแสดงรหัส QR เป็น OLED เราต้องทำตามขั้นตอนง่ายๆและแปลงภาพ PNG เป็นอาร์เรย์บิตแมปที่ Arduino อ่านได้ การแปลงนี้เราเคยทำก่อนหน้านี้ในขณะที่เชื่อมต่อ SSD1306 OLED กับ Arduino และเชื่อมต่อ Graphical LCD กับ Arduino นอกจากนี้เรายังเชื่อม SSD1306 OLED กับ Raspberry Pi, ESP32, NodeMCU และไมโครคอนโทรลเลอร์อื่น ๆ อีกมากมาย การแปลงอาร์เรย์บิตแมปสามารถทำได้ในสองขั้นตอนด้านล่าง:
- การแปลง PNG เป็นรูปแบบ BMP
- แปลงรูปภาพ BMP เป็นอาร์เรย์ของรหัส HEX
การแปลง PNG เป็นรูปแบบ BMP
ในการแปลงภาพ PNG ที่ดาวน์โหลดมาเป็นภาพ BMP ไปที่เว็บไซต์นี้และในส่วนตัวแปลงรูปภาพและ
- คลิกเมนูแบบเลื่อนลงและเลือก
- แปลงไฟล์เป็น BMP
- คลิกไป
รูปภาพด้านล่างจะให้แนวคิดที่ชัดเจนเกี่ยวกับกระบวนการ:
คุณจะพบกับหน้าใหม่ที่ดูเหมือนภาพด้านล่าง:
- คลิกที่แท็บเลือกไฟล์และเลือกภาพที่ดาวน์โหลด
- ในการตั้งค่าเสริมให้พิมพ์ขนาดที่คุณต้องการ (เราใช้ OLED ขนาด 128x64)
- คลิกที่ปุ่มเริ่มการแปลง
คุณจะเห็นหน้าต่อไปนี้และหลังจากนั้นไม่กี่วินาทีภาพที่แปลงแล้วของคุณจะถูกดาวน์โหลดหากการดาวน์โหลดไม่เริ่มโดยอัตโนมัติให้คลิกที่ตัวเลือกดาวน์โหลดไฟล์ของคุณ:
เยี่ยมมาก! ตอนนี้เรามีไฟล์ BMP แล้วถึงเวลาแปลงเป็นอาร์เรย์ของรหัส HEXที่ Arduino อ่านได้
แปลงรูปภาพ BMP เป็นอาร์เรย์ของรหัส HEX
ในการแปลงภาพ BMP ที่ดาวน์โหลดมาเป็นอาร์เรย์ HEX ให้ไปที่เว็บไซต์นี้และคลิกที่Tools -> image2cpp
ภาพด้านล่างจะให้แนวคิดที่ชัดเจนเกี่ยวกับกระบวนการนี้
คุณจะเห็นหน้าจอซึ่งมีสี่ตัวเลือกและเราจะพูดถึงรายละเอียด
- เลือกภาพ
- การตั้งค่าภาพ
- ดูตัวอย่าง
- เอาต์พุต
เลือกส่วนรูปภาพ
ในส่วนนี้เราจะเลือกภาพที่เราเพิ่งแปลงเป็น BMP:
ส่วนการตั้งค่าภาพ
ในส่วนนี้เราจะกำหนดขนาดผ้าใบสีพื้นหลังการปรับขนาดและตัวเลือกกึ่งกลางตามค่าที่เราต้องการ
- ขนาดผ้าใบ (เราตั้งค่าเป็น 128x64 เนื่องจากเราใช้ OLED ที่มีความหนาแน่น 128x64 พิกเซล)
- ในส่วนนี้เราสามารถกำหนดสีพื้นหลังของ OLED ได้ (เราเลือกให้เป็นสีขาว)
- มาตราส่วนถูกตั้งค่าเป็นขนาดดั้งเดิม
- สุดท้ายในตัวเลือกตรงกลางให้คลิกที่ช่องทำเครื่องหมายแนวนอนและแนวตั้งซึ่งจะทำให้ภาพปรากฏตรงกลาง
ภาพด้านล่างจะให้แนวคิดที่ชัดเจน
ดูตัวอย่างส่วน
ในส่วนการแสดงตัวอย่างเราจะเห็นภาพตัวอย่างที่ชัดเจนซึ่งจะแสดงใน OLED ดังที่แสดงด้านล่าง:
ส่วนเอาต์พุต
ในส่วนผลลัพธ์เราจะสร้างและคัดลอกโค้ดที่สร้างขึ้นโดยทำตามขั้นตอนด้านล่าง:
- รูปแบบเอาต์พุตรหัส (เราตั้งเป็นรหัส Arduino เพราะเราใช้งานอยู่)
- ตัวระบุ (ตัวเลือกนี้ตั้งชื่อสำหรับอาร์เรย์ที่สร้างขึ้นเราปล่อยให้เป็นค่าเริ่มต้นตามที่เป็นอยู่)
- โหมดวาด (เราตั้งค่าตัวเลือกโหมดวาดเป็นแนวนอน)
- และในที่สุดเราก็คลิกที่ปุ่มสร้างรหัสซึ่งจะสร้างรหัสผลลัพธ์สุดท้าย
ภาพด้านล่างจะให้แนวคิดที่ชัดเจน
แผนภูมิวงจรรวม
ภาพด้านล่างแสดงการเชื่อมต่อระหว่างArduino Nano และ SSD1306:
Arduino Nano Pin |
PIN OLED |
GND |
GND |
3.3V |
VCC |
D13 |
CLK |
D11 |
MOSI |
D8 |
RES |
D9 |
SDC |
D10 |
CCS |
คำอธิบายรหัส
ในการแสดงภาพบน OLED เราต้องการความช่วยเหลือจากไลบรารี Arduino ซึ่งสามารถดาวน์โหลดได้จากที่เก็บ GitHub นี้ ดาวน์โหลดเวอร์ชัน U8glib-1.19.1.zip ของไลบรารีและนำเข้าใน Arduino IDE หากคุณยังใหม่กับ Arduino โปรดใช้ความช่วยเหลือจากลิงก์นี้เพื่ออธิบายวิธีการนำเข้าไลบรารี ในส่วนด้านล่างเราจะแก้ไขโค้ดเพื่อแสดงอาร์เรย์ HEX ที่สร้างขึ้นก่อนหน้านี้เป็น OLED รหัสที่สมบูรณ์พร้อมวิดีโอที่ใช้งานได้จะได้รับในตอนท้ายของบทความนี้ คำอธิบายรายละเอียดของรหัสมีให้ด้านล่าง
ขั้นแรกให้รวมไลบรารีที่ดาวน์โหลดมา
#include "U8glib.h" // รวมทั้งห้องสมุด U8glib
จากนั้นกำหนดพินที่จำเป็นทั้งหมดสำหรับ OLED
#define OLED_CLK_PIN 13 // Arduino Digital Pin D13: SCK #define OLED_MOSI_PIN 11 // Arduino Digital Pin D11: MOSI #define OLED_RES_PIN 10 // Arduino Digital Pin D10: SS #define OLED_SDC_PIN 9 // Arduino Digital Pin D9: OC1A #define OLED_CSS_PIN 8 // Arduino Digital Pin D13: ICP1
เริ่มต้นห้องสมุด u8glib
U8GLIB_SH1106_128X64 u8g (OLED_CLK_PIN, OLED_MOSI_PIN, OLED_RES_PIN, OLED_SDC_PIN, OLED_CSS_PIN);
จากนั้นรวมอาร์เรย์รูปภาพที่สร้างขึ้น
const uint8_t วงจรย่อย PROGMEM = {0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x1c 0x87, 0xf0, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x0c, 0x01, 0x87, 0xf0, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xf3, 0xff, 0x8f, 0xf0, 0x7f, 0x31, 0xff, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf3, 0xff, 0x8f, 0xf0 0xff, 0xcf, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf3, 0x81, 0x8f, 0x31,0x80, 0x33, 0x81, 0xcf, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf3, 0x01, 0x8f, 0x31, 0x80, 0x33, 0x81, 0xcf, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xf3, 0x01, 0x8f, 0xb1, 0x80, 0x33, 0x81, 0xcf, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf3, 0x01, 0x8f, 0x98c 0x81, 0xcf, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf3, 0x01, 0x8f, 0xc1, 0x98, 0x33, 0x81, 0xcf, 0xff, 0xff, 0xff, 0xff, …….. …….. …..0xff, 0xff, …….. ………..0xff, 0xff, …….. ………..
ฟังก์ชัน Draw ใช้เพื่อวาดภาพบิตแมป (โค้ด QR) บน OLED ด้วยความช่วยเหลือของฟังก์ชัน u8g.drawBitmapP
การวาดเป็นโมฆะ (โมฆะ) {// คำสั่งกราฟิกเพื่อวาดใหม่หน้าจอทั้งหมดควรวางไว้ที่นี่ u8g.drawBitmapP (0, 0, 16, 64, circuitdigest); ….. ……
สุดท้ายในฟังก์ชัน loop () เรียกใช้ขั้นตอนที่จำเป็นทั้งหมดเพื่อสร้างภาพบน OLED
ห่วงเป็นโมฆะ () {u8g.firstPage (); // การเรียกใช้โพรซีเดอร์นี้ทำเครื่องหมายจุดเริ่มต้นของลูปรูปภาพ ทำ {วาด (); } ในขณะที่ (u8g.nextPage ()); // การเรียกใช้โพรซีเดอร์นี้ทำเครื่องหมายจุดสิ้นสุดของเนื้อหาของลูปรูปภาพ // สร้างภาพใหม่หลังจากหน่วงเวลา (1,000); }
หลังจากกรอกรหัสเสร็จแล้วให้เสียบ Arduino เข้ากับพอร์ต USB ของคอมพิวเตอร์ของคุณเลือกพอร์ต COM และอัปโหลดรหัส หากคุณทำทุกอย่างถูกต้องคุณจะมีหน้าจอที่ใช้งานได้พร้อมรหัส QR บน OLED
ฉันหวังว่าคุณจะชอบโครงการนี้และสนุกกับการเรียนรู้สิ่งใหม่ ๆ อ่านต่อไปเรียนรู้ต่อไปแล้วพบกันใหม่