Tìm hiểu cách lập trình gadgetcho Window Vista phần 2 docx
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (521.96 KB, 6 trang )
Kích cỡ mặc định của 1 gadget thường là 129 pixel , dù ta có thể chỉnh to hơn
thành 250 nhưng theo tôi bạn lên để chế đó chuẩn và thiết kế 1 gadget theo kích
thước này .
V.Lập trình với Gadget bằng Visual Studio 2005 -2008
1.Cài đặt addin & gagget template project cho Visual Studio 2005 -2008
Ngoài cách tự dựng lấy các file cần thiết để làm một gadget, chúng ta còn có thể
xây dựng một gadget template và intstall nhanh chóng bằng Visual studio 2005 –
2008 .Dễ hiểu thôi, chúng ta cần một công cụ mạnh để soạn ,thiết kế html, viết
script có hỗ trợ gợi nhớ code…và nhiều thứ khác nữa.Dù notepade là công cụ soạn
thảo cũng khá mạnh đấy nhưng hãy quên nó đi .
Các bước tiến hành như sau
– Cài đặt Visual studio 2008 hoặc 2008, ở đây tôi chọn bản 2008,
– Cài đặt phần addin : RunVistaGadgetAddInSetup, bạn có thể download phần
mềm miễn phí này tại địa chỉ :
Sau khi cài đặt thì chương trình này sẽ tích hợp vào visual studio, hỗ trợ chúng ta
tạo template gadget và cung cấp luôn tiện ích “Run vista gadget” trên menu
tool.Nếu chưa thấy thì có thể nó chưa được load,bạn cần vào menu Tools\Addin-
Manager để lôi nó ra
2. Gadget đầu tiên – Light google
Dân IT thì 100% đều dung google vậy tại sao không để nó lên sidebar cho tiện nhỉ
?? Gadget của chúng ta sẽ có giao diện như một google thu nhỏ,khi cần tìm kiếm
chỉ việc gõ từ khóa lên gadget rồi enter là xong ! để lập trình được một gadget tiện
dụng như vậy ta chỉ mất có 5 dòng ,dưới đây là chi tiết các bước.code
2.1 Tạo gadget template project
- Trong cửa sô Visual studio 2008 , chọn menu File >New >Web site…
Nếu chúng ta cài đặt VistaGadgetAddIn thành công thì hộp thoại New Website sẽ
hiện ra như hình dưới.Template HelloWorldVistaGadget đã được dựng sẵn với các
file cần thiết như CSS, setting… bạn nhắp tiếp vào template này và nhấn OK
.VS2k8 sẽ hiển thị tiếp hộp thoại yêu cầu upgrade lên Net 3.5,bạn có thể bỏ qua
hoặc chấp nhận nếu viết gadget bằng siverlight hoặc WPF .
Cuối cùng cửa số solution explorer hiện ra như hình dưới.
Trong các file, folder trên ,ngoài các file chính gadget.xml: lưu thông tin cấu hình
gadget, gadget.html :chính là trang web sẽ được đưa lên sidebar ,và file css thì còn
lại có thể xóa được,file gadget.js là file script được tạo sẵn để chứa code javascript,
tuy nhiên nếu bạn dùng vbscript thì có thể thay bằng file gadget.vbs rồi thay đổi
dòng sau trong file gadget.html
<script src="scripts/gadget.js" type="text/javascript"></script>
Nhắp đúp chuột vào file gadget.html , ta thấy các đoạn mã có sẵn như sau
<html xmlns="
<head>
<title>Untitled Page</title>
<link href="css/gadget.css" type="text/css" rel="Stylesheet"/>
<script src="scripts/gadget.js" type="text/javascript"></script>
</head>
<body onload="document.body.focus();">
<div>
Hello World!
</div>
</body>
</html>
OK ! bây giờ bạn hãy chạy thử gadget helloworl này xem sao, ta chọn menu
tool\runVistagaget
Khi hộp thoại sercurity warning hiện ra,nhấn tiếp install để cài đặt gadget.
Kết quả cuối cùng hiển thị trên sidebar có thể làm bạn hơi thất vọng
Đương nhiên rồi vì nó chỉ có một lệnh là hiển thị chuỗi hello world thôi mà, để làm
được một gaget hữu dụng ta cần động tay chân một chút , bạn có thể dùng một
công cụ nào đó chuyên dụng để thiết kế 1 trang web có 1 textbox và 1 image của
chữ GOOGLE như Microsoft Fronpage 2003 chẳng hạn hoặc có thể tận dụng luôn
chức năng design webpage của VS2k8.
Sau 3 phút loay hoay, trang web light google của tôi như sau :
Tôi chọn chế độ split để xem cả code lần design, trông cũng không tệ lắm nhỉ
Hình ảnh GOOGLE là tôi capture lại từ rồi resize cho nhỏ
lại, vì chúng ta chỉ nên giới hạn trong 1 khung 129 x 60 pixel thôi ạ, bạn có thể xóa
hết nôi dung file gadget.html ở trên rồi paste đoạn mã sau vào thay thế
1. <html xmlns="
2. <head>
3. <title>Untitled Page</title>
4. <link href="css/gadget.css" type="text/css" rel="Stylesheet"/>
5. <script src="scripts/gadget.js" type="text/javascript"></script>
6. </head>
7. <body onload="document.body.focus();">
8. <div style="height: 19px" dir="rtl">
