Tạo widget của riêng bạn: 6 bước

2024 Tác giả: John Day | [email protected]. Sửa đổi lần cuối: 2024-01-30 13:36

Tài liệu hướng dẫn này sẽ hướng dẫn bạn cách tạo một tài khoản Yahoo! cơ bản. Tiện ích con. Đến cuối hướng dẫn này, bạn sẽ học được một số JavaScript và XML.

Bước 1: Bắt đầu

Một số công cụ bạn sẽ cần để tạo một widget là: - Máy tính chạy Mac OS X hoặc Windows Xp / Vista- Một chương trình soạn thảo văn bản. (Notepad là hoàn hảo.) - Một chương trình chỉnh sửa hình ảnh. (Microsoft Paint vẫn ổn.) - Kiên nhẫn và thời gian.- Yahoo Widgets- Widget Converter Widget Khi bạn có các chương trình và tiện ích này, bạn đã sẵn sàng chuyển sang bước hai.

Bước 2: Tạo cấu trúc thư mục

Bây giờ bạn sẽ cần tạo cấu trúc thư mục để chứa tất cả các tệp tạo nên một widget, cấu trúc như sau: -Widget Name | Nội dung | Tài nguyên Widget.kon Main.js | Tất cả các hình ảnh mà tiện ích sẽ sử dụng Bạn có thể tải xuống tiện ích này để tự động tạo cấu trúc thư mục Cấu trúc - Reinier Kaper Thiết lập các tùy chọn của tiện ích bằng cách nhấp chuột phải vào bất kỳ phần nào của nó và nhấp vào tùy chọn. Thay đổi các tùy chọn của Cấu trúc thành như sau: root: Điều hướng đến thư mục widget của bạn. (Nằm trong 'Tài liệu của tôi' trên Windows) Bây giờ bạn có thể nhấp vào tiện ích và một hộp thoại sẽ bật lên, yêu cầu bạn nhập tên của tiện ích.

Bước 3: Tạo tất cả các tệp cần thiết

Chúng ta sẽ bắt đầu với việc tạo tệp widget.xml, tệp này cho công cụ phụ tùng biết thông tin về tiện ích con của bạn. Tải xuống mẫu mà bạn đã tạo để sử dụng. Liên kết tải xuống bên dưới. Đặt tệp vào thư mục 'Nội dung' nằm trong thư mục có tên bạn đã chọn trước đó. Mở tệp bằng trình soạn thảo văn bản mà bạn chọn và thay thế YourNameHere bằng tên của bạn. Lưu và đóng. Tiếp theo chúng ta sẽ tạo tệp.kon, tệp chính cho widget biết phải làm gì. Tệp.kon chỉ là một tệp XML có phần mở rộng đã được đổi tên. Tải xuống tệp widget.kon cơ bản này và cũng đặt nó trong thư mục 'Nội dung'. Một lần nữa, mở tệp bằng trình soạn thảo văn bản. Dòng đầu tiên cho biết tệp là tệp XML được tạo bằng mã hóa UTF-8. Thẻ tiếp theo cần thêm là thẻ widget; Sau đó, bạn khai báo cài đặt của mình, chẳng hạn như gỡ lỗi;. Bây giờ bạn đã sẵn sàng để thêm các phần tử cửa sổ của mình;. Widget có nhiều đối tượng làm những việc nhất định và có một số thuộc tính nhất định. Ví dụ đối tượng văn bản, tạo văn bản. Dưới đây là danh sách một số thuộc tính của đối tượng văn bản: -name (tự giải thích) -window (giảm giá trị) -data (văn bản để hiển thị) -color (tự giải thích) -size -font -hOffset (hay còn gọi là x) -vOffset (hay còn gọi là y)-width -height Với điều đó đã nói, chúng ta hãy bắt đầu viết mã. Thêm mã sau vào tệp kon, trong thẻ: myTextHello World! BlueArial18left252 Trong tiếng Anh, điều này thiết lập một đối tượng văn bản có tên myText, hiển thị "Hello World!" bằng phông chữ Arial, màu xanh lam và kích thước 12. Lưu tệp kon của bạn và tiếp tục bước bốn.

Bước 4: Rejoyce

Nhấp đúp vào tệp kon và tiện ích của bạn sẽ tải. Xin chúc mừng! Bạn đã tạo tiện ích con đầu tiên của mình. Nhưng chúng tôi vẫn chưa viết xong. Có lẽ bạn đang nghĩ, "Chỉ có vậy thôi?", Phải không? Tiếp tục đến bước 5 để thêm một số chức năng vào widget của bạn.

Bước 5: Thêm chức năng

Bây giờ chúng ta sẽ làm cho widget hiển thị thời gian hiện tại. Điều này sẽ yêu cầu bộ đếm thời gian cập nhật mỗi phút và một tệp khác. Tệp tiếp theo sẽ là tệp JavaScript, sẽ nằm trong thư mục 'Nội dung'. Mở trình soạn thảo văn bản của bạn và tạo một tệp có tên là main.js. Để thêm thời gian, chúng tôi sẽ sử dụng "đối tượng Ngày". Để thiết lập đối tượng ngày, bạn tạo một hàm. Thêm hàm này vào tệp js: function updateText () '{theTime = new Date (); theHour = String (theTime.getHours ()); theMinutes = String (theTime.getMinutes ()); myText.data = "Thời gian là:" + theHour + ":" + theMinutes; print ('update');} Widget của bạn sẽ không hiển thị thời gian vì nó không biết phải làm gì với tệp js. Để xử lý vấn đề này, chúng tôi thêm trình xử lý sự kiện này vào tệp Kon, trong các thẻ nhưng không phải trong các thẻ: include ('main.js'); Để cập nhật thời gian, chúng tôi cần tạo một bộ đếm thời gian. tệp Kon, trong các thẻ nhưng không trong các thẻ: Lưu tệp và tải tiện ích. Nó sẽ hiển thị thời gian. Nếu nó không hoạt động, hãy tải xuống cả kon và js từ bên dưới và thay thế bằng những cái cũ.

Bước 6: Tổng hợp tất cả

Sử dụng tiện ích chuyển đổi widget để chuyển đổi tiện ích thành tệp.widget. LƯU Ý: Kéo thư mục có tên là tên của tiện ích con của bạn vào trình chuyển đổi, không phải tệp kon. Nếu bạn muốn tiến xa hơn nữa với widget của mình, hãy lấy một số tài nguyên tại đây. Dưới đây là danh sách những điều bạn có thể cố gắng thực hiện với widget của mình: -Thêm tùy chọn để kiểm soát phông chữ bằng thẻ và thẻ phụ phông chữ- Thêm một số trình xử lý sự kiện như onClick bằng cách sử dụng thẻ hoặc.-Hiển thị hình ảnh từ tệp cục bộ bằng cách sử dụng đối tượng hình ảnh.