X3D DeveloperX3D Developer
ติดต่อ Discord
24/09/2026

แทน esx_notify, esx_progressbar, esx_loadingscreen ด้วยชุด UI ฟรีของ X3D — ไม่ต้องแก้สคริปต์เก่า

esx_notify มี 4 ตำแหน่ง ฟอนต์ไทยเป็นกล่อง esx_progressbar ยกเลิกไม่ได้ esx_loadingscreen ขึ้นจอขาว บทความนี้เทียบข้อจำกัดของ UI มาตรฐาน ESX กับ X3D Notify, X3D Progress Bar และ X3D Loading Screen (ฟรี GPL v3) พร้อมวิธีสลับโดยที่สคริปต์เดิมที่เรียก exports เก่าไม่ต้องแก้สักบรรทัด

UI พื้นฐานสามตัวที่ทุกเซิร์ฟ ESX ใช้ — esx_notify, esx_progressbar, esx_loadingscreen — มาจาก ESX Legacy ตั้งแต่ปี 2022 และแทบไม่ได้แตะอีก ปัญหาที่เซิร์ฟไทยเจอซ้ำคือฟอนต์ไทยขึ้นเป็นกล่อง ยกเลิกแถบโหลดไม่ได้ และหน้าโหลดขึ้นจอขาวบนเครื่องผู้เล่นบางคน

X3D ต่อยอดสองตัวแรกจากซอร์ส ESX (GPL v3 เปิดซอร์สทั้งหมด รายการที่แก้อยู่ในหน้าสินค้า) และเขียนหน้าโหลดขึ้นใหม่ แจกฟรีทั้งสามตัว จุดสำคัญคือ สคริปต์เก่าที่เรียก exports['esx_notify'] หรือ exports['esx_progressbar'] ไม่ต้องแก้ มีตัวส่งต่อให้

สคริปต์ที่เกี่ยวข้อง

esx_notify → X3D Notify

เรื่อง esx_notify X3D Notify
ตำแหน่งวางการ์ด 4 9 (เพิ่ม center, top/bottom-center, left/right-center)
ไอคอนไอเทม / กรอบความหายาก ไม่มี มี (icon, iconBg)
ฟอนต์ไทย ขึ้นเป็นกล่องบนเครื่องที่ไม่มีฟอนต์ ฝัง Noto Sans Thai มาในตัว
สีในข้อความ ~r~ ฯลฯ เหมือนเดิม + ~br~ ขึ้นบรรทัดใหม่
ตั้งค่าตอนรันไทม์ ไม่มี SetConfig(position, sound) และ ClearAll()
หน้าจอ HTML/CSS/JS เดิม เขียนใหม่เป็น Vue 
exports['x3d_notify']:Error('เงินไม่พอ ต้องการ ~r~$5,000~s~', 4000, 'ใช้เงิน', 'top-center')
TriggerClientEvent('ESX:Notify', source, 'success', 3000, 'ได้รับของแล้ว')

ดาวน์โหลด: X3D Notify

esx_progressbar → X3D Progress Bar

เรื่อง esx_progressbar X3D Progress Bar
ยกเลิกระหว่างทาง ไม่ได้ ต้องรอครบเวลา กด ESC เรียก onCancel
นับถอยหลัง ไม่มี showCountdown = true
กันเปิดกระเป๋าระหว่างทำงาน ต้องเขียนเอง state bag LocalPlayer.state.minigame + event x3d_progressbar:active
ฟอนต์ไทย กล่อง ฝังมา
ธีม คงที่ พีช/เจด สลับตามผู้เล่น
บูตแล้ว error ped nil เกิดได้ กันไว้แล้ว 
exports['x3d_progressbar']:Progressbar('กำลังซ่อมรถ...', 15000, {
    FreezePlayer = true,
    animation = { type = 'anim', dict = 'mini@repair', lib = 'fixing_a_ped' },
    onFinish = function() end,
    onCancel = function() end,
    showCountdown = true,
})

ดาวน์โหลด: X3D Progress Bar

esx_loadingscreen → X3D Loading Screen

เรื่อง esx_loadingscreen X3D Loading Screen
โครงสร้าง หลายไฟล์ HTML ไฟล์เดียว CSS/JS ฝังใน ไม่มี request ออก
จอขาวบนเครื่องบางคน เกิดได้ (CEF ไม่มีเน็ตตอนโหลด, module จาก file:// ติด CORS) ไม่เกิด
สถานะโหลด แถบวิ่ง ไล่รายชื่อ resource ที่ mount จริงแบบเรียลไทม์ + ชื่อเฟส
ลงเมือง ปล่อยเองเมื่อโหลดเสร็จ ปุ่ม ENTER WORLD ผู้เล่นกดเองเมื่อพร้อม
ภาพ/เพลง แก้โค้ด วางไฟล์ bg.png–bg6.png / bg.mp4 / loop.mp3 ข้าง HTML

ใช้กับ ESX มาตรฐานได้ (ปุ่มกดได้ตอน esx:playerLoaded) และถ้าใช้ ESX Legacy Core — X3D Build core จะพักผู้เล่นไว้จนกว่าจะกดปุ่มแล้ว spawn ตรงนั้นจริง ๆ

ดาวน์โหลด: X3D Loading Screen · คู่มือ: เอกสาร

สลับโดยไม่แก้สคริปต์เก่า

  1. เอา esx_notify / esx_progressbar / esx_loadingscreen ตัวเดิมออกจาก resources/ (ตัวใหม่กับตัวเก่าเปิด NUI ซ้อนกัน และ loadscreen มีช่องเดียว)
  2. วาง x3d_notify, x3d_progressbar, x3d_loadingscreen
  3. ถ้ามีสคริปต์เก่าเรียก exports['esx_notify'] หรือ exports['esx_progressbar'] ให้ย้าย optional/esx_notify/ และ optional/esx_progressbar/ จากในซิปออกมาไว้ใน resources/ เป็นตัวส่งต่อ 12 บรรทัด
ensure x3d_notify
ensure x3d_progressbar
ensure x3d_loadingscreen
ensure esx_notify          # เฉพาะเมื่อมีสคริปต์เก่าเรียกชื่อนี้
ensure esx_progressbar     # เฉพาะเมื่อมีสคริปต์เก่าเรียกชื่อนี้

หน้ากระเป๋า: X3D Inventory

ถ้าจะเปลี่ยนหน้ากระเป๋าด้วย X3D Inventory (ฟรี) คือกระเป๋า ESX Legacy ตัวหนังสือไทยใหญ่ ช่องลัด 1–9 ที่บันทึกกับตัวละคร และตรวจทุกการใช้/ให้/ทิ้งฝั่งเซิร์ฟเวอร์ ต่างจากสามตัวบนตรงที่ไม่ใช่ตัวส่งต่อ export เดิม ต้องปิดกระเป๋าตัวเก่าให้เหลือตัวเดียว รายละเอียดและตู้เซฟ/ท้ายรถที่ใช้หน้าจอเดียวกันอยู่ในระบบกระเป๋า ESX ฟรีครบชุด

คำถามที่พบบ่อย

ใช้กับ ox_lib อยู่ ต้องเปลี่ยนไหม — ไม่ต้อง ทั้งสามตัวเป็นทางเลือกของ UI มาตรฐาน ESX ไม่ได้บังคับ X3D Use Item และ X3D Slide ตรวจเองว่าคุณมี ox_lib หรือ x3d_notify แล้วเลือกใช้

ฟรีจริงไหม — ฟรี Notify กับ Progress Bar เป็น GPL v3 เหมือนต้นฉบับ ESX (Copyright ESX-Framework, modifications X3D-Developer) Loading Screen เขียนขึ้นใหม่ทั้งหมด

QBCore ใช้ได้ไหม — Notify และ Progress Bar ผูกกับ ESX (ESX:Notify, ESX.PlayerData) Loading Screen ใช้ได้ทุก core รวม standalone

สคริปฟรีตัวอื่นของ X3D ทั้งหมดอยู่ในบทความแจกสคริป FiveM ฟรี

สคริปต์ที่เกี่ยวข้อง