มาเขียนโปรแกรมติดต่อ Database กันเถอะ (แบบไม่ต้องเขียน Code เองซักตัว)

วันนี้เรามาดูความเร็วในการเขียนโปรแกรมโดย Delphi ในการติดต่อกับฐานข้อมูล โดยสามารถ เพิ่ม ลบ แก้ไข ค้นหาแบบที่เราไม่ต้องไปเขียน Code คำสั่งให้ยุ่งยาก ทำไปทีละ Step แบบชิวๆ เพราะ Dephi เค้ามีชุดคำสั่งสำเร็จรูปมาให้เราใช้งานกันพร้อมสรรพเลยครับ เรียกว่า ActionList เจ้าคอมโพเน้นท์ตัวนี้มีมาตั้งแต่ Delphi 4 แล้วครับ นอกจากจะจัดการกับ Action ที่กระทำกับ Database (เพิ่ม,ลบ,แก้ไข,เดินหน้า,ถอยหลัง) แล้ว ยังจัดการกับ Action  อื่นอีกมากมายเลยครับ เช่น Action Dialog, File, Edit, Seacrh, Windows และอื่นๆอีกมากมายครับ

คอมโพเน้นท์ที่ใช้ในการติดต่อกับ Database ผมเลือกใช้ FireDAC แล้วกันครับ ง่ายดี แต่ว่าเจ้า FireDAC นั้นมีมาพร้อมกับ Delphi ตั้งแต่เวอร์ชั่น XE3 เป็นต้นไป ถ้าใครใช้ต่ำกว่านั้น (XE2,XE,2010,2009,2007,2006,2005,7) ต้องใช้ คอมโพเน้นท์ AnyDAC ของบริษัท daSoft แทนครับ หรือไม่ก็ใช้ ADO แทน หรือ UniDac ก็ได้ และอื่นๆอีกมากมายครับ เพราะ Delphi มีบริษัทต่างๆที่เขียนคอมโพเน้นท์ Support กับ Delphi เยอะมาก

เรามาเริ่มกันเลยครับ

1. สร้าง Table ในฐานข้อมูลให้เรียบร้อยก่อน เอาแบบง่ายๆนะครับ ผมจะใช้ Microsoft Access เป็นฐานข้อมูลโดยออกแบบ Table ตามนี้ครับ เก็บข้อมูลลูกค้าครับ

2. ต่อไปในฝั่ง Delphi ก็เริ่มจากสร้างโปรเจคขึ้นมาก่อนครับ จากนั้นไปที่ Tool Palate ค้นหาคำว่า FDConnection , FDPhysMSAccessDriverLink , FDTable ค้นเจอทั้ง 3 ตัวแล้วลากลงมาวางบนฟอร์มทุกตัวครับ

อธิบายนิดนึงครับ

• FDConnection เราใช้เพื่อเป็นตัวติดต่อกับฐานข้อมูล
• และเนื่องจาก FireDAC สามารถติดต่อกับฐานข้อมูลได้หลากหลายตัวด้วยกันเราจึงต้องให้โปรแกรมเรารู้ว่าตอนนี้เราจะเขียนโปรแกรมติดต่อกับฐานข้อมูลอะไร เราจึงต้องมี FDPhysMSAccessDriverLink เพราะเราจะเขียนติดต่อกับ Access ครับ ถ้าเป็นฐานข้อมูลตัวอื่นเช่น MySQL ก็ต้องใช้ FDPhysMySQLDriverLink แทน หรือถ้าเป็น Microsoft SQL Server ก็ต้องใช้ FDPhysMSSQLDriverLink แทนครับ (ย้ำนะครับว่าต้องตัว FDPhyDriverLink เสมอ)
• ส่วน FDGUIxWaitCursor ต้องมีไว้ครับ เพราะเขียนโปรแกรมติดต่อฐานข้อมูล ในการทำงานแต่ละขั้นตอนจะมีการรอคำสั่ง หรือรอข้อมูลการโต้ตอบบางอย่าง ตัวนี้จะมีไว้ เพื่อจัดการเรื่องการ Wait ของเวลา
• ส่วนตัว FDTable เราจะใช้ติดต่อกับตัว Table ครับ ต้องกำหนด Connection ของ FDTable ให้มองไปที่ตัว FDConnection ครับ

3. ต่อไปเรามากำหนด Property ของ Component กันครับ

1. เริ่มจาก FDConnection กันก่อนครับ ตั้งค่าจามรูปเลย เสร็จแล้วให้กด OK ครับ
   
2. กลับมาที่หน้าจอหลัก ให้กำหนด Property "Login Promt" เป็น False นะครับ เพราะเวลาเชื่อมต่อมันจะได้ไม่ต้องถาม Username กับ Password ให้รำคาญใจครับ
   
3. จากนั้นมาที่ FDTable ครับ กำหนด Property 3 ตัวครับคือ

• Connection = FDConnection1
• TableName = TBL_CUSTOMER
• Active = True
  

4. เมื่อทำการติดต่อฐานข้อมูลเสร็จแล้ว และได้ตาราง TBL_CUSTOMER มาเรียบร้อยแล้ว ต่อไปเรามาดึงเอาข้อมูลจากตาราง TBL_CUSTOMER มาแสดงบนโปรแกรมกันครับ

1. ไปที่ Tool Palates ค้นหาคอมโพเน้นท์ชื่อว่า DataSource มาวางที่ฟอร์มครับ แล้วกำหนด Property ตามรูปด้านล่างเลย คือ ให้ DataSource1 มองไปหา FDTable1 ครับ
   
   
   
2. จากนั้นนำคอมโพเน้นท์ตารางมาวางเพื่อเอาไว้แสดงข้อมูลใน Table ครับ ซึ่งในตัวอย่างนี้ผมใช้เป็น EHLib ครับ ใครสนใจสามารถดาวน์โหลดมาทดลองก่อนได้ครับ ที่ http://www.ehlib.com/en/downloads จากนั้นกำหนด Property ดังนี้ครับ

• ก่อนอื่นให้นำ Panel มาวางบนฟอร์ม แล้ว กำหนด Property "Align" = alBottom ครับ
• จากนั้นไปที่ DBGridEh1 กำหนด DataSource = DataSource1 และ Align = alClient (สั่งให้อยู่เต็มจอตลอด)
  

5. ต่อมาเรามาปรับคุณสมบัติของโปรแกรมให้สามารถมองเห็นข้อมูลใน Table จากฐานข้อมูลกันครับ

ทำตามภาพด้านล่างได้เลยครับ

6. เสร็จแล้วสำหรับการตั้งค่าเบื้องต้นต่างๆ ต่อมาเราลองมา Run โปรแกรมทดสอบดูครับ แต่ก่อน Run เราต้องกำหนด Property Active ของ FDTable1 ให้เป็น True ก่อนครับ ไม่งั้นตอนเปิดโปรแกรมจะไม่สามารถเพิ่มลบแก้ไขโปรแกรมได้ครับ (หรือไม่เราต้องไปเขียนคำสั่งให้ Active เองซึ่งไม่เอาดีกว่าครับ ไหนเราก็จะเขียนโปรแกรมโดยที่ไม่ต้องยุ่งเรื่อง Code อยู่แล้วครับ ^_^) กดปุ่ม F9 ให้โปรแกรม Run ได้เลยครับ

7. ต่อไปเรามาทำให้โปรแกรมเราสามารถค้นหาข้อมูลในตารางกันดีกว่าครับ แล้วให้ข้อมูลในคอลัมน์ "ที่อยู่" แสดงข้อมูลที่อยู่ได้ ให้ปิดโปรแกรมที่กำลังเปิดอยู่ลงไปก่อนแล้ว

กลับมาที่หน้า Design แล้วไปกำหนด Property ของ DBGridEh1 ตามรูปด้านล่างเลยครับ

จากต้นจนจบ สังเกตว่าเรายังไม่ได้เขียน Code อะไรเลย ง่ายใช่มั้ยล่ะครับ นี่คือความสามารถหนึ่ง Delphi ที่ทำให้ผมชอบ จำได้ว่าตอนเรียนที่มหาลัยเคยเขียนพวก .Net , Java ถึงกับอ๊วกแตกกันเลยที่เดียวกว่าจะเชื่อมต่อกว่าจะเขียนคำสั่ง SQL กว่าจะ Config โน่น นี่ นั่น ลำบากทีเดียว พอเขียนเสร็จต้องมาปวดหัวกับการแก้บั๊กอีกต่างหาก Delphi นี้แหละครับที่ช่วยได้ สังเกตว่าเราไม่ได้เขียนคำสั่ง SQL พวก Select * from... หรือ Insert into.... อะไรเลยครับ ง่ายกว่านี้ไม่มีอีกแล้ว

และเช่นเคยครับ ถ้าผมไม่ได้ศึกษาจากสื่อการสอนของบริษัท เดลส์เน็ท เอ็นเทอร์ไพรส์ จำกัด  (www.delsnet.com) คงได้เขียนโปรแกรมแบบปวดหัวตามเดิมครับ

จัดการกับขนาดและตำแหน่งของคอมโพเน้นท์บน Form

บทความนี้ พอดีมีเพื่อนที่มหาลัย ที่สนใจ Delphi ถามมาครับ ผมคิดว่าน่าจะเอาแชร์กัน

โดยปกติแล้วเวลาเราออกแบบฟอร์มหรือส่วนติดต่อกับผู้ใช้ (Graphic User Interface) ในฟอร์มหนึ่งก็จะประกอบไปด้วย คอมโพเนนท์ต่างๆ เพื่อรอรับค่าหรือโต้ตอบกับผู้ใช้ เช่น ฺพวก Button, Listbox, Editbox, Combobox และอื่นอีกมากมาย  เวลาเราอยากได้คอมโพเน้นท์พวกนี้ ก็เพียงแค่ ลาก และ ก็วาง ลงบนฟอร์มเท่านั้น แต่ปัญหาคือเมื่อเวลาเราขยายหรือขนาดของฟอร์มหลักสังเกตุว่าตำแหน่งของคอมโพเน้นท์ที่เราวางลงไป มันอยู่ตำแหน่งเดิมหรือนิ่งๆ ไม่ได้ขยับตามซึ่งบางทีเราเองอยากให้มันขยับ หรือปรับตำแหน่งตามขนาดของฟอร์มด้วย หรือบางที่เราต้องการให้คอมโพเน้นท์บางตัวอยู่ ณ ตำแหน่งนั้นๆของฟอร์มตลอดไม่ว่าจะเกิดอะไรขึ้นกับฟอร์ม ในครั้งนี้เราจะมาเรียนรู้การจัดการกับตำแหน่งและขนาดของคอมโพเน้นท์บนฟอร์มกันครับ.....^_^

1. การยืด การหด ของคอมโพเน้นท์
Property ในการจัดการกับการย่อ ขยาย ยืด หด ของคอมโพเน้นท์ใน Delphi ชื่อว่า Anchors มาดูกันเลยครับ ให้เราสร้างโปรเจคขึ้นมาตัวหนึ่ง แล้ววางคอมโพเน้นท์พื้นฐานลงไปครับ เช่น Button Listbox

ทีนี้ผมลองขยายขนาดของฟอร์มดูครับ สังเกตว่า Listbox กับ Buton มันไม่ขยับตาม (โดยปกติมันก็ไม่ขยับอยู่แล้วครับ) 

แต่ครั้งนี้ผมต้องการให้มันขยายตามฟอร์มหลัก ผมก็สามารถทำได้โดยไปกำหนด Property ที่มีชื่อว่า Anchors ครับ 

พอเรากำหนด ค่าของ Property "Anchors" ตามภาพด้านบนแล้ว ที่นี้พอเรายืดหดฟอร์มจะมีผลกับ Listbox และ Button ตามค่าที่เรากำหนดเลยครับ

คุณสมบัติของ Property "Anchors" คือ กำหนดให้แต่ละด้านของคอมโพเน้นท์  "ยึดเกาะ" กับฟอร์มหรือไม่ อย่างเช่น ใน Listbox ตอนแรกที่เราลากมาวางบนฟอร์มค่าของ Anchors ที่กำหนดคือ akLeft และ akTop เป็น True (ยืดด้านบนและซ้ายไว้) ส่วน akRight และ akBottom เป็น False (ไม่ยึดเกาะทั้งขวาและลาง) สังเกตว่าในตอนแรกเมื่อเราขยายฟอร์มลงมามุมล่างขวา Listbox มันไม่ขยับตาม เพราะว่า akRight และ akBottom มีค่าเป็น False หรือสั่งไม่ให้มันยึดนั่นเอง ไม่ว่าเราจะขยายขนาดฟอร์มให้ใหญ่แค่ไหน ด้านขวาและล่างของ Listbox ก็จะไม่มีทางขยับตาม ต่อมาเราได้เปลี่ยนแปลงค่า akRight และ akBottom ให้เป็น True จะสังเกตว่าพอเราขยายฟอร์ม ด้านขวาและล่างของ Listbox จะยืดเกาะหรือขยับตามฟอร์มแม่นั้นไปครับ ในส่วนของปุ่ม Button ก็คล้ายกันครับ คือ เราเปลี่ยนให้มัน "ยึดด้านขวาและบน" และ "ปล่อยด้านซ้ายและล่าง" จะทำให้ขนาดของปุ่มไม่เปลี่ยนแปลงตามฟอร์ม เพราะเราไม่ได้ยืดด้านซ้ายและล่างไว้นั่นเองครับ

2. การกำหนดแนวการจัดวางตำแหน่ง
Property ในการจัดการกับการจัดวางแนวตั้งแนวนอนของคอมโพเน้นท์ใน Delphi ชื่อว่า Align มาดูกันเลยครับ ให้เราวางคอมโพเน้นแล้วกำหนดค่า Property "Align" ของคอมโพเน้นท์ต่างๆ ตามรูปด้านล่างนี้ สังเกตว่าในตอนที่เราวางคอมโพเน้นท์หนึ่งๆ ลงบนฟอร์มในขณะ Property Align จะมีค่าเป็น alNone โดย Default แต่หลังจากที่เราเปลี่ยนแปลงค่าของ Align ทำให้ตำแหน่งของคอมโพเน้นท์เปลี่ยนไปทันที

ทีนี้เราลองขยายขนาดของฟอร์มดูครับ สังเกตว่าตำแหน่งและขนาดของปุ่ม Button ไม่มีผลการเปลี่ยนแปลงแต่อย่างใด ส่วนตำแหน่งของ Memo1 จะเลื่อนไปตามขนาดของฟอร์มและอยู่ด้านขวาของฟอร์มเสมอ ในส่วนของคอมโพเน้นท์อีก 3 ตัวที่เหลือก็เช่นเดียวกันคือจะอยู่ ณ ตำแหน่งนั้นตลอดไม่ว่าจะยืดหรือหดฟอร์ม ที่เป็นเช่นนั้นเพราะว่า เมื่อมีการกำหนด Property Align ค่าของ Property Anchors จะเปลี่ยนแปลงตาม ลองกด F11 แล้วสังเกตุค่า Anchors ที่ แท็บ Object Inspector ดูได้ครับ

นอกจาก Memo1 จะอยู่แนวขวาของฟอร์มตลอดแล้ว ทีนี้เรามาทำให้ Memo1 ขยายขนาดตามฟอร์มกันบ้าง ก็ใช้ Anchors ตามที่ได้กล่าวมาแล้วก่อนหน้านี้เลยครับ คือเราต้องสั่งให้ด้านซ้ายของ Memo1 "ยึดกับฟอร์มไว้" ครับ แล้วลองขยายดูครับ

เป็นยังงัยบ้างครับ ไม่ยากใช่มั้ยครับ สำหรับคนที่เพิ่งเริ่มศึกษา Delphi อาจจะยังไม่รู้ตรงนี้ครับ ก็คิดว่าคงเป็นประโยชน์อยู่บ้าง ตอนผมศึกษาแรกๆ ก็งงๆ อยู่เหมือนกัน กว่าจะเข้าใจตรงนี้ได้

ศึกษาเพิ่มเติมได้ครับที่ Mobile Tutorial: Using Layout to Adjust Different Form Sizes or Orientations (iOS and Android)

สำหรับท่านใดที่ต้องการศึกษาการพัฒนาโปรแกรมด้วย Delphi อย่างรวดเร็ว ลัดสั้น ตรงจริง ผมขอแนะนำให้ศึกษาจากสื่อการสอนของบริษัท เดลส์เน็ท เอ็นเทอร์ไพรส์ จำกัด  (www.delsnet.com) ครับ ส่วนตัวผมก็เริ่มต้นจากตรงนั้น จนวันนี้เขียนโปรแกรมด้วย Delphi มาโดยตลอด จนเขียนโปรแกรมหารายได้เสริมตอนเรียนมหาลัยได้สบายๆ เลยครับ เพราะเข้าใจและทำตามเองได้ครับ

การติดตั้งโปรแกรม Delphi XE7 RTM Update1 Lite 10.1

สำหรับ Delphi XE7 RTM Update1 Lite 10.1 เวอร์ชั่นนี้ ติดตั้งง่าย ไม่ต้องแคร็ก ไม่ต้องลงทะเบียนครับ แถมยังใช้เวลาในการติดตั้งน้อยกว่า ตัวเต็มอีกด้วยครับ และยังสามารถใช้งานทุกอย่างได้เหมือนกับ Delphi ตัวที่ดาวน์โหลดจากเว็บ Embarcadero 

1. ก่อนอื่นให้เราทำการดาวน์โหลดตัวติดตั้งตาม Link ที่อยู่ด้านล่างนี้ครับ

Part1 : https://mega.co.nz/#!NVVVTYxT!2kUpNzDKI2-ZYI897JqAVSzXzUKR8ZMgj0g_Iqc09es

Part2 : https://mega.co.nz/#!JYE0yLIC!xmEk6g0zpvnG9FwmtaINgeR2dwSnojPWPJnFfGB0BkM

2. เมื่อดาวน์โหลดเสร็จแล้วทำการแตก Zip ไฟล์ออกมา จะได้ไฟล์ทั้งหมดดังภาพด้านล่าง ดับเบิ้ลคลิกที่ตัวไฟล์ Setup จะแสดงหน้าต่างให้ติดตั้ง Java SDK ใช้สำหรับการเขียน App บน Android ให้คลิกปุ่ม No ไปเลยครับแล้วให้เราไปดาวน์โหลดตัว Java SDK มาติดตั้งเองจากเว็บของ Oracle ได้เลยครับ (ตามลิ้งนี้ http://www.oracle.com/technetwork/java/javase/downloads/index.html)

 

3. เสร็จแล้วจะมีหน้าต่างแสดงขึ้นมา ให้คลิก OK ผ่านไปได้เลยครับ

4. คลิกปุ่ม Next

5. เลือกที่ options "I accept the agreement" แล้วคลิก Next

6. ระบุตำแหน่งปลายทางที่ต้องการติดตั้ง (ปกติก็ใช้ค่า Default ครับ) คลิกปุ่ม Next

7. หน้า Select Component ให้เลือก ติดตั้งแบบ Full installation ครับ (จะได้เขียน App ให้รันได้ทุกแพล็ตฟอร์ม) คลิกปุ่ม Next

8. หน้า Select Start Menu Folder ไม่ต้องเปลี่ยนแปลงอะไรครับ กดปุ่ม Next ไปได้เลย

9. หน้า Select Additional Tasks ให้เลือก Addition options ทุกตัวเลือก จากนั้น กดปุ่ม Next

10. หน้าต่าง Ready to Install พร้อมสำหรับการติดตั้งแล้ว กดปุ่ม Install ได้เลยครับ

11. แสดงความคืบหน้าในการติดตั้งต้องรอซักพักครับ สำหรับเวอร์ชั่น Lite นี้ จะใช้เวลาในการติดตั้งน้อยกว่าเวอร์ชั่นดาวน์โหลดจากเว็บของ Embarcadero ครับ

12. ติดตั้งเสร็จเรียบร้อยแล้วครับ กดปุ่ม Finish ได้เลย ถ้าต้องการทดสอบโปรแกรมก็ เลือกที่ Options "Launch Embarcadero Delphi XE7" ครับ

13. ถ้าขึ้นหน้าต่างแบบนี้ ก็แสดงว่าไม่มีปัญหาครับ

เสร็จเรียบร้อยแล้วครับ ง่ายมาก สำหรับการติดตั้งโปรแกรม Delphi XE7 RTM Update1 Lite 10.1 

สำหรับการตั้งค่าพื้นฐานเอาไว้โพสต์หน้าครับ ..... ^_^