AndroidWeb

คู่มือทีละขั้น

ออกแบบฉลาก — วางข้อความ รูป Barcode และ QR อย่างเป็นขั้นตอน

อ่านหน้าจอ Label Designer ตั้งขนาด Canvas เพิ่มและจัด Layer ใช้ Dynamic field ตรวจ Error/Warning และบันทึกแบบที่พิมพ์ได้จริง

ผู้ดูแลฉลาก / Designer / Supervisorอ่านประมาณ 14 นาทีอัปเดต 17 กรกฎาคม 2026
หน้าจอแก้ไขฉลาก Android แสดงพื้นที่ออกแบบ เครื่องมือ และแผง Properties
หน้าจอ Label Designer ปัจจุบัน: เครื่องมืออยู่ด้านซ้าย พื้นที่ฉลากอยู่ตรงกลาง และ Properties, Layers, History อยู่ด้านขวา กดภาพเพื่อเปิดขนาดเต็ม

อ่านบทนี้แล้วทำอะไรได้

  • อ่าน Toolbar, Canvas และ Properties ได้
  • เพิ่มและจัด element โดยไม่ออกนอกขอบ
  • แก้ validation error ที่บล็อกการพิมพ์ได้

เตรียมก่อนเริ่ม

  • สร้าง Template และเลือกชนิดงานแล้ว
  • ทราบขนาดฉลากจริงและข้อมูลที่ต้องแสดง
  • เตรียมตัวอย่างค่าจริง เช่น Product, Lot, Weight หรือ Batch สำหรับ Preview
คู่มือที่เกี่ยวข้องสร้าง Templateตั้ง Barcode และ QR
สารบัญในหน้านี้

1. อ่านหน้าจอจากซ้ายไปขวา

  • แถบซ้าย: Select, Text, Image, Barcode, QR Code, Line, Box, Date และ Time
  • ตรงกลาง: Canvas หน่วยมิลลิเมตร พร้อม Grid และพื้นที่ขอบฉลาก
  • ด้านบน: Undo/Redo, Zoom, New, Preview, Save, Print และเมนูเพิ่มเติม
  • แถบขวา: Label, Properties, Layers และ History
  • กรอบและจุดจับรอบ element บอกว่ากำลังเลือกและสามารถย้าย/ปรับขนาดได้

2. ตั้ง Canvas และแนววางก่อนเพิ่มข้อมูล

  1. ขั้นตอนที่ 1

    ตรวจ Width และ Height

    ใส่ขนาดตามดวงฉลากจริง แอปจำกัด Width 10–300 mm และ Height 10–200 mm

  2. ขั้นตอนที่ 2

    เลือก Orientation

    กำหนดแนวนอนหรือแนวตั้งให้ตรงทิศที่กระดาษออกจาก Printer

  3. ขั้นตอนที่ 3

    เปิด Grid และ Snap

    ใช้เส้น Grid และ Snap ช่วยจัดแนว แต่ยังต้องตรวจระยะขอบจริงหลังพิมพ์

  4. ขั้นตอนที่ 4

    กำหนดพื้นที่ปลอดภัย

    เว้นขอบเล็กน้อย ไม่วาง Barcode, QR หรือตัวเลขสำคัญชิดขอบ Canvas

3. เพิ่ม Element ทีละกลุ่ม

Elementใช้กับสิ่งที่ต้องตรวจ
Textหัวข้อ ค่าคงที่ และ Dynamic fieldFont, ขนาด, น้ำหนัก, การจัดแนว และค่าตัวอย่าง
ImageLogo หรือสัญลักษณ์URI ของรูปและความคมเมื่อพิมพ์ขาวดำ
Barcodeรหัสที่เครื่องอ่านแบบเส้นSymbology, ข้อมูล, ความกว้างและความสูง
QR Codeข้อมูลที่ต้องการพื้นที่สี่เหลี่ยมข้อมูลไม่ว่างและขนาดอย่างน้อยที่อ่านได้
Line / Boxแบ่งส่วนหรือทำกรอบอย่าทับข้อความ/โค้ด
Date / Timeเวลาพิมพ์หรือข้อมูลตาม fieldรูปแบบวันที่ เวลา และ timezone หน้างาน

4. จัด Layout แบบลดงานแก้ซ้ำ

  1. ขั้นตอนที่ 1

    วางข้อมูลหลักก่อน

    เริ่มจากชื่อสินค้า น้ำหนัก และ Lot ซึ่งต้องอ่านได้ชัด แล้วจึงเพิ่มข้อมูลรอง

  2. ขั้นตอนที่ 2

    เลือก Element แล้วแก้ Properties

    แก้ค่าของ element ที่เลือกเท่านั้น หากขึ้น Locked ให้ปลดล็อกจาก Layers ก่อน

  3. ขั้นตอนที่ 3

    จัดลำดับ Layers

    เลื่อน element ที่ถูกบังขึ้นด้านบน ล็อกพื้นหลังหรือกรอบที่ไม่ต้องการขยับ

  4. ขั้นตอนที่ 4

    ใช้ Preview ด้วยค่าตัวอย่าง

    ตรวจข้อความยาว ตัวเลขน้ำหนัก และ Lot ที่ยาวที่สุด ไม่ใช่ดูเฉพาะ placeholder สั้น ๆ

  5. ขั้นตอนที่ 5

    ย้อนการแก้ด้วย Undo/History

    ย้อนเมื่อ element เคลื่อนหรือ Properties ผิด แทนการลบและสร้างใหม่ทันที

  6. ขั้นตอนที่ 6

    Save ก่อน Print

    Draft ถูกเก็บอัตโนมัติหลังหยุดแก้ประมาณ 400 ms แต่ควรกด Save เพื่อยืนยัน version ก่อนพิมพ์

5. Error ที่บล็อก Print และ Warning ที่ยังพิมพ์ได้

ระดับอาการวิธีแก้
Errorไม่มี visible elementเพิ่ม element หรือเปิด visibility อย่างน้อย 1 รายการ
ErrorElement ออกนอก Canvasย้าย/ลดขนาดให้กรอบทั้งหมดอยู่ภายในฉลาก
ErrorDynamic field เปิดด้วย {{ แต่ไม่สมบูรณ์เลือก field ใหม่หรือลบ token ที่ค้าง
ErrorBarcode หรือ QR ไม่มีข้อมูลเลือก data source หรือกรอกค่าคงที่
WarningBarcode เล็กกว่า 20 × 8 mmขยายเพื่อเพิ่มโอกาสอ่านได้
WarningQR ด้านใดด้านหนึ่งเล็กกว่า 12 mmเพิ่มขนาดและพิมพ์ทดสอบ
WarningImage ไม่มี URIเลือกรูปใหม่หรือเอา element ออก

Continue learning

Next Steps — อ่านอะไรต่อ

เลือกบทถัดไปตามงานที่คุณกำลังตั้งค่า เพื่อเรียนต่อได้โดยไม่ข้ามขั้นสำคัญ

Barcode และ QR

เพิ่ม Barcode/QR ใน Template เลือก Data source จัดรูปแบบเลขวันที่ น้ำหนัก Serial และเข้าใจข้อจำกัดของ Code128, Code39, EAN, UPC และ ITF

พิมพ์และทดสอบ

เตรียม Printer บันทึก Template ตั้ง Copies, Density, Speed, Gap และ Offset ทดสอบ Border/Barcode และรับมือกรณีแอปดูเหมือนรับงานแต่ Printer ไม่ได้เชื่อมต่อ