วิธีสร้างวิดเจ็ต

click fraud protection
...

สถาปัตยกรรมวิดเจ็ต

วิดเจ็ตเป็นแอปพลิเคชันแบบสแตนด์อโลนที่มักจะพบได้ฝังอยู่ในไซต์ของบุคคลที่สาม เช่น นาฬิกา ตัวแสดงการประมูล การนับถอยหลังของกิจกรรม เป็นต้น วิดเจ็ตจึงเป็นแอปพลิเคชันขนาดเล็กที่ง่ายต่อการปรับใช้ รวดเร็วในการพัฒนา และใช้เพื่อยกระดับเทคโนโลยีขั้นสูงโดยเพิ่มฟังก์ชันการทำงานให้กับแอปพลิเคชันที่มีอยู่ หากคุณสามารถสร้างเว็บเพจได้ คุณก็จะรู้วิธีสร้างและใช้งานวิดเจ็ต เนื่องจากพวกมันใช้เทคโนโลยี JavaScript, DHTML และ CSS เดียวกัน วิดเจ็ตสามารถเป็นได้ทั้งอุปกรณ์เสริม แอปพลิเคชัน หรือวิดเจ็ตข้อมูล วิดเจ็ตอุปกรณ์เสริมมีอยู่ในตัวเองซึ่งทำงานโดยไม่ขึ้นกับอินเทอร์เน็ตหรือแอปพลิเคชัน วิดเจ็ตแอปพลิเคชันเชื่อมโยงกับแอปพลิเคชันอย่างเต็มรูปแบบในขณะที่วิดเจ็ตข้อมูลทำงานกับข้อมูลอินเทอร์เน็ต

สถาปัตยกรรม

ขั้นตอนที่ 1

เปิดโปรแกรมแก้ไขข้อความของคุณและสร้างไฟล์ HTML ไฟล์ HTML ควรเป็นไปตามมาตรฐาน XHTML 1.0 ขึ้นไป เพื่อให้สอดคล้องกับแนวทางปฏิบัติที่ดีที่สุดของมาตรฐานเว็บในปัจจุบัน รหัส XHTML อย่างง่ายจะมีลักษณะดังนี้:

วีดีโอประจำวันนี้

วิดเจ็ต

ขั้นตอนที่ 2

ใช้ แท็กเพื่อทำการเรนเดอร์ 2D แบบเต็มสำหรับวิดเจ็ตหากจำเป็น แอตทริบิวต์ "คอมโพสิต" เป็นอีกส่วนเพิ่มเติมของแท็กที่ช่วยให้ระบุวิธีการแสดงรูปภาพ ("picture.png")

ขั้นตอนที่ 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 ซึ่งช่วยให้วิดเจ็ตเข้าถึงการตั้งค่าผู้ใช้บนระบบ พลิกวิดเจ็ตเพื่อเข้าถึงการตั้งค่า เปิด แอปพลิเคชันอื่นๆ ตอบสนองต่อเหตุการณ์ของหน้าเว็บและดำเนินการคำสั่งของระบบ เช่น เครื่องมือบรรทัดคำสั่งและเชลล์ สคริปต์

หมวดหมู่

ล่าสุด

วิธีเปลี่ยน "บันทึกล่าสุดโดย" ในเอกสาร Word

วิธีเปลี่ยน "บันทึกล่าสุดโดย" ในเอกสาร Word

เอกสารที่คุณสร้างด้วย Microsoft Word ซึ่งเป็นโป...

วิธีใช้ GRUB Rescue

วิธีใช้ GRUB Rescue

วิธีใช้ GRUB Rescue เครดิตรูปภาพ: agrobacter/E...

วิธีการกู้คืนไฟล์ที่ถูกลบใน Linux

วิธีการกู้คืนไฟล์ที่ถูกลบใน Linux

วิธีการกู้คืนไฟล์ที่ถูกลบใน Linux แม้จะพยายามอย...