สถาปัตยกรรมวิดเจ็ต
วิดเจ็ตเป็นแอปพลิเคชันแบบสแตนด์อโลนที่มักจะพบได้ฝังอยู่ในไซต์ของบุคคลที่สาม เช่น นาฬิกา ตัวแสดงการประมูล การนับถอยหลังของกิจกรรม เป็นต้น วิดเจ็ตจึงเป็นแอปพลิเคชันขนาดเล็กที่ง่ายต่อการปรับใช้ รวดเร็วในการพัฒนา และใช้เพื่อยกระดับเทคโนโลยีขั้นสูงโดยเพิ่มฟังก์ชันการทำงานให้กับแอปพลิเคชันที่มีอยู่ หากคุณสามารถสร้างเว็บเพจได้ คุณก็จะรู้วิธีสร้างและใช้งานวิดเจ็ต เนื่องจากพวกมันใช้เทคโนโลยี JavaScript, DHTML และ CSS เดียวกัน วิดเจ็ตสามารถเป็นได้ทั้งอุปกรณ์เสริม แอปพลิเคชัน หรือวิดเจ็ตข้อมูล วิดเจ็ตอุปกรณ์เสริมมีอยู่ในตัวเองซึ่งทำงานโดยไม่ขึ้นกับอินเทอร์เน็ตหรือแอปพลิเคชัน วิดเจ็ตแอปพลิเคชันเชื่อมโยงกับแอปพลิเคชันอย่างเต็มรูปแบบในขณะที่วิดเจ็ตข้อมูลทำงานกับข้อมูลอินเทอร์เน็ต
สถาปัตยกรรม
ขั้นตอนที่ 1
เปิดโปรแกรมแก้ไขข้อความของคุณและสร้างไฟล์ HTML ไฟล์ HTML ควรเป็นไปตามมาตรฐาน XHTML 1.0 ขึ้นไป เพื่อให้สอดคล้องกับแนวทางปฏิบัติที่ดีที่สุดของมาตรฐานเว็บในปัจจุบัน รหัส XHTML อย่างง่ายจะมีลักษณะดังนี้:
วีดีโอประจำวันนี้
ขั้นตอนที่ 2
ใช้
ขั้นตอนที่ 3
ใช้ Cascading Style Sheets (CSS) เพื่อจัดรูปแบบวิดเจ็ตเพื่อให้แสดงอย่างสม่ำเสมอในทุกเบราว์เซอร์ ส่วนหนึ่งของไฟล์ CSS จะมีลักษณะดังต่อไปนี้:
ขั้นตอนที่ 4
วางไฟล์ด้านบนไว้ในไฟล์แยกต่างหาก ในตัวอย่างนี้ เราได้บันทึกไฟล์เป็น "widget.css" อ้างอิงไฟล์โดยใช้คำสั่ง "import" ในไฟล์ html หลักดังที่แสดง:
เพิ่มความไดนามิก
ขั้นตอนที่ 1
ใช้อ็อบเจ็กต์ "วิดเจ็ต" เพื่อเพิ่มความสามารถ ตัวอย่างเช่น ในการเข้าถึงการตั้งค่าผู้ใช้ ให้ใช้รหัสบรรทัดต่อไปนี้:
widget.setPreferenceForKey (ค่ากำหนด คีย์) GO widget.preferenceForKey (คีย์);
ขั้นตอนที่ 2
ใช้เหตุการณ์การเปิดใช้งานเพื่อหลีกเลี่ยงการใช้เวลา CPU หรือทรัพยากรเครือข่ายมากเกินไปโดยวิดเจ็ต รหัสด้านล่างแสดงวิธีการดำเนินการนี้:
ถ้า (window.widget) { widget.hide = ซ่อน GO widget.show = แสดง GO
ฟังก์ชั่นซ่อน () { ถ้า (timeInterval == null) { timeInterval = setInterval (updateTime (จริง);", 500) GO } }
เพิ่มฟังก์ชันอื่น ๆ ให้กับโค้ดตามที่คุณต้องการ
ขั้นตอนที่ 3
สร้างไฟล์ "Info.plist" เพื่อระบุวิดเจ็ตและทรัพยากร ไฟล์นี้แตกต่างกันไปตามสิ่งที่ควรมีขึ้นอยู่กับประเภทของวิดเจ็ต
เคล็ดลับ
เพื่อให้สอดคล้องกับการใช้เทคโนโลยีเว็บ วิดเจ็ตไดนามิกถูกจัดเตรียมโดยใช้ JavaScript ซึ่งช่วยให้วิดเจ็ตเข้าถึงการตั้งค่าผู้ใช้บนระบบ พลิกวิดเจ็ตเพื่อเข้าถึงการตั้งค่า เปิด แอปพลิเคชันอื่นๆ ตอบสนองต่อเหตุการณ์ของหน้าเว็บและดำเนินการคำสั่งของระบบ เช่น เครื่องมือบรรทัดคำสั่งและเชลล์ สคริปต์