Category: Developer

งานพัฒนาระบบ, เขียนโปรแกรม

Firebase และ Arduino ตอนที่ 2

ในตอนที่ 2 เราจะมาดูภาคการเขียนโปรแกรมในส่วนของ board โดยใช้ซอฟต์แวร์ arduino-1.8.10 เขียน sketch แล้ว upload เข้า board เพื่อใช้งานร่วมกับ Firebase หากบังเอิญ search มาเจอบทความนี้ก่อน ย้อนกับไปอ่าน ตอนที่ 1 ได้ครับ เริ่มต้นเราต้องดาวน์โหลดซอฟต์แวร์ที่จะต้องใช้ ดังรูป รันโปรแกรมที่ดาวน์โหลดมา arduino-1.8.10-windows.exe (ส่วนอีก 2 ไฟล์ที่เป็น .zip แตกไฟล์ออกมา CH341SER_WINDOWS.zip ใช้เพื่อให้ USB port ของ Notebook จำลองเป็น Serial port COM3…

Firebase และ Arduino ตอนที่ 1

บทความนี้ ตอนที่ 1 จะพูดถึง (แจกโค๊ด) Firebase Realtime Database และ ตอนที่ 2 จะพูดถึง Arduino โดยที่ในตอนที่ 1 จะเป็นโปรแกรมให้เห็นว่า นำข้อมูลใส่เข้าใน Firebase Realtime Database ได้อย่างไร แล้วในตอนที่ 2 เราจะโปรแกรม Arduino ให้เชื่อมต่อเน็ตผ่าน Wi-Fi 802.1x แล้วหลอด LED จะถูกเปิด/ปิด หรือ เปลี่ยนสี เมื่อมีการสั่งจากโปรแกรม JavaScript ในตอนที่ 1 ในขั้นตอนการติดตั้ง Firebase สมัครใช้งาน…

สร้างเงาให้กับวัตถุด้วย SmoothShadow

Layer of shadows คือจำนวนชั้นของเงา ปกติโดยทั่วไปเราจะใช้งานกันประมาณ 1-2 layer ซึ่งจำนวนของชั้นเงานี้จะสัมพันธ์กับตัวปรับแต่งด้านล่าง เช่นในรูปตั้งไว้ที่ 4 layers หรือเงา 4 ชั้น เราก็จะสามารถปรับกราฟการไล่เงาซึ่งจะแบ่งไว้ 4 ช่วงของแสงไล่ตั้งแต่ขาวไปดำ 4 ระดับ ถ้าปรับเป็น 7 layers ระบบก็จะซอยช่วงเทาเพิ่มมามากขึ้น ก็จะไล่จากขาวไปดำ 7 ระดับ Final transparency คือความเข้ม/ความโปร่งใสของเงา ค่ายิ่งน้อยเงาของเราจะยิ่งโปร่งแสง(จางขึ้น) ค่ายิ่งมากเงาของเราก็จะยิ่งทึบแสง(เข้มขึ้น) ส่วนของกราฟจะแสดงถึงการไล่แสงของเงา โดยเราจะสามารถดึงจุดวงกลมสีชมพูได้ เพื่อปรับความโค้งของกราฟ เงาก็จะมีการไล่แสงที่ต่างกันออกไป และส่วนของ Reverse alpha คือการกลับกันของเงา ไล่จากขาวไปดำ…

Flutter : ดึงข้อมูลจาก RESTFul API

สำหรับนักพัฒนาแอปพลิเคชันในตอนนี้ คงไม่มีใครไม่รู้จัก Flutter อย่างแน่นอนนะครับ ซึ่งตอนนี้ก็ออกเวอร์ชัน 2.2 มาแล้ว สำหรับผมเองที่เพิ่งเริ่มศึกษาก็ขอเริ่มด้วยการทดสอบดึงข้อมูลจาก API เป็นอย่างแรกนะครับ เพราะแอปพลิเคชันสำหรับใช้งานด้านต่างๆ ในองค์กรมักจะต้องใช้ข้อมูลจากฐานข้อมูล โดยการเชื่อมต่อผ่าน API เป็นหลักครับ ขั้นตอนการติดตั้งบน Windows และเตรียมเครื่องมือสามารถอ่านได้ที่ https://flutter.dev/docs/get-started/install/windows ในบทความนี้ผมใช้ Visual Studio Code นะครับโดยติดตั้ง Extention เพิ่มเติมดังนี้ เปิด Visual Studio Code คลิกเมนู View > Command Palette พิมพ์ “install”, จากนั้นเลือก Extensions: Install…

การสร้าง Dashboard บน Azure DevOps

เวลานี้ไม่ว่าจะไปที่ไหน เรามักจะได้ยินคำว่า “Dashboard” บ่อยมาก แล้ว Dashboard มีประโยชน์และสร้างอย่างไร  วันนี้เรามีวิธีการสร้าง Dashboard ง่ายๆ เพื่อใช้ในการติดตามโครงการมานำเสนอค่ะ โดยจะใช้เครื่องมือที่เรียกว่า Azure DevOps โดยเราต้องสร้างโครงการบน Azure DevOps ก่อนนะคะ (ครั้งหน้าจะมาแนะนำการสร้างโครงการบน Azure DevOps รอติดตามกันนะคะ) หลังจากสร้างโครงการบน Azure DevOps แล้ว ในการบริหารโครงการจะมีการแบ่งงานออกเป็น Work Item ในแต่ละ Work Item ก็จะมีการมอบหมายงานหรือ Assigned ให้กับผู้ร่วมโครงการแต่ละคน จากนั้นจะมีการติดตามว่าได้ดังเนินการไปถึงไหน ใช้เวลาเท่าไหร่ ตัวอย่างการสร้าง Work Item…

การย่อ-ยุบแถวข้อมูลบน GridView โดยประยุกต์ใช้ร่วมกับ jQuery และ Collapse ใน Bootstrap (C#)

           จากความเดิมตอนที่แล้ว เราได้พูดถึงวิธีการจัดการข้อมูลจำนวนมากด้วยการจัดกลุ่มหมวดหมู่ของข้อมูลใน GridView กันไปแล้ว ซึ่งหากผู้อ่านท่านใดต้องการทราบวิธีการจัดหมวดหมู่สามารถตามดูเนื้อหาในบทความได้จาก การจัดหมวดหมู่แถวของข้อมูลบน GridView ด้วย C# และในส่วนของบทความนี้จะเป็นเนื้อหาต่อยอดการทำงานจากการจัดหมวดหมู่ดังกล่าว โดยเพิ่มความสามารถให้หมวดหมู่หรือกลุ่มเหล่านั้นสามารถย่อ-ยุบได้ เพื่ออำนวยความสะดวกให้กับผู้ใช้ในการดูข้อมูลแยกส่วนกันชัดเจนมากยิ่งขึ้น หรือเพื่อตอบโจทย์ให้กับผู้ใช้บางท่านที่อาจมีความต้องการดูข้อมูลทีละส่วนได้ โดยจะนำ Component ที่ชื่อว่า Collapse ใน Bootstrap มาประยุกต์ใช้ในการแสดงผลร่วมกับ GridView และยังมี jQuery มาเป็นอีกหนึ่งตัวช่วยเพื่อให้สามารถแสดงผลตามที่ต้องการได้ โดยการอธิบายในบทความนี้ ทางผู้เขียนจะขอตัดตอนในส่วนของรายละเอียดขั้นตอนวิธีการจัดหมวดหมู่ไป และข้ามมาพูดถึงขั้นตอนที่ต้องจัดทำเพิ่มเติมในการทำย่อ-ยุบเลยละกันนะคะ            ก่อนจะไปเริ่มในส่วนของการเขียนโค้ด เรามาทำความรู้จักกับ ค่าที่จำเป็นต้องใช้ในการระบุให้กับแถวหลัก(parent)เพื่อให้สามารถย่อยุบได้ กันก่อนนะคะ data-toggle=”collapse” data-target=”.multi-collapse” เพื่อกำหนด target ที่เราต้องการให้ย่อยุบได้ โดยใช้สไตล์ชีทเป็นตัวช่วยเพื่อแยกแต่ละกลุ่มออกจากกัน ซึ่งในที่นี้จะตั้งชื่อสไตล์ชีท…

เขียนโค้ดแก้ปัญหา browser block popup แบบง่ายๆ ใช้งานได้จริง

เดี๋ยวนี้การเปิดหน้าเวบของผู้ใช้งานทั่วไปมักใช้มือถือแทนคอมพิวเตอร์แล้ว แล้วตอนนี้ browser ทั่วไปจะทำการ block popup JavaScript ใน function window.open ดังนั้นทำให้ง่ายที่สุดคือใช้ link ให้เป็นประโยชน์ โดยใช้ properties href ในการเรียกใช้ตามโค้ดตัวอย่างข้างล่างนี้ เท่านี้สั้นๆ ง่ายๆ หวังว่าจะเป็นประโยชน์สำหรับคนเขียนโค้ดและผู้ใช้งานไม่ต้องปิด block popup ที่เครื่องตัวเองอีกต่อไป

การจัดหมวดหมู่แถวของข้อมูลบน GridView ด้วย C#

          ในการดึงข้อมูลมาแสดงผลในรูปแบบตาราง GridView อาจเป็นหนึ่งในทางเลือกของนักพัฒนาที่จะหยิบไปใช้เป็นเครื่องมือในการแสดงผล แต่ในกรณีที่ข้อมูลมีจำนวนมากอาจทำให้ผู้ใช้รู้สึกตาลายและอ่านยากไปสักหน่อย ผู้พัฒนาจึงต้องพยายามหาวิธีจัดการข้อมูลในการแสดงผลให้สามารถอ่านง่ายและสบายตามากยิ่งขึ้น ดังนั้น ในกรณีที่ข้อมูลมีจำนวนมาก การจำแนกประเภท หรือแยกออกเป็นกลุ่มย่อยๆก็เป็นอีกหนึ่งในทางเลือกที่จะช่วยแก้ปัญหาดังกล่าวได้ ดังนั้น ในบทความนี้ผู้เขียนจะขอแนะนำวิธีการแสดงผลของข้อมูลบน GridView แบบจำแนกออกตามกลุ่ม เพื่ออำนวยความสะดวกให้กับผู้ใช้ในการดูข้อมูลแยกส่วนกัน เพื่อเพิ่มความสามารถให้กับ GridView ซึ่งเราเองใช้งานอยู่และน่าจะคุ้นเคยกันดีอยู่แล้ว ซึ่งจะมีขั้นตอนดังนี้ค่ะ ขั้นตอนในการพัฒนา เตรียมข้อมูลในการแสดงผล โดยจากตัวอย่างนี้ จะทำการสมมุติข้อมูลของดอกไม้ ผลไม้ และต้นไม้ และมีข้อมูลเพื่อใช้ในการแยกประเภทไว้ด้วย เพื่อให้เห็นภาพมากขึ้นค่ะ หมายเหตุ : การประกาศตัวแปร และการดึงข้อมูลเป็นเพียงการยกตัวอย่างง่ายๆ เพื่อให้ผู้ใช้เข้าใจเท่านั้น ในการทำงานจริงผู้อ่านสามารถใช้วิธีการประกาศตัวแปรและเรียกใช้แบบอื่น หรือดึงข้อมูลจากส่วนอื่นได้ ขึ้นอยู่กับความเหมาะสมและความถนัดค่ะ 2. เตรียม GridView ที่จะใช้ในการแสดงผล โดยจะขอยกตัวอย่างให้ดูการแสดงผล GridView…

Crystal Report : Report หลายตัวหัวท้ายต่าง แต่ตรงกลาง Code เหมือนกัน จัดการอย่างไร (WinApp)

หลาย ๆ ครั้งที่ท่านมีรายงานมากกว่า 1 ฉบับที่มีรูปร่างหน้าตาส่วนหัวกระดาษหรือท้ายกระดาษที่ต่างกัน แต่ส่วนของ Detail นั้นเหมือนกันอย่างกับแกะ และเจ้าส่วน Detail นี้ ดั๊นนนน เป็นเจ้า Detail ที่มีเงื่อนไขเยอะแยะ ยุบยับซับซ้อนซ่อนเงื่อน ถ้าจะให้สร้าง File เพื่อวาง Report Viewer เป็น 2 File หรือตามจำนวนรายงานก็ใช่ที่ จากการที่ประสบพบเจอมากับตัว ส่วนหัว ส่วนท้าย ดั๊นนน ไม่คล้ายไม่เหมือนเลย แต่ข้อมูลตรงกลางนั้น ต้องใช้ข้อมูลชุดเดียวกัน เหมือนกัน ทีนี้ถึงกับกุมขมับเลยว่าจะทำยังไงดี ได้คำปรึกษาแนะนำจากพี่ชายที่แสนดี @wachirawit-j มาช่วยชี้แจงแถลงไข ถึงต้องรีบจัดการเก็บข้อมูลไว้ เผื่อครั้งหน้าเจออีกแล้วลืมจะได้กลับมาอ่านซ้ำ ไปดูกันเล้ยยยยยย…