2007年1月30日に発売されたMicrosoft Windows Vistaの新機能として、サイドバーガジェットと呼ばれるガジェットが搭載されました。
今回@niftyが提供するガジェットを使えば、デスクトップ上から簡単に@niftyのサービスを利用することができます。Windows Vistaをお使いの方は、ぜひその便利さをご体験ください。
 |
「rescuenow@nifty」ガジェット
|
 |
「プロ野球速報」ガジェット
|
 |
「瞬！ワード」ガジェット
|
 |
「12星座占い」ガジェット
|
【コラム】ガジェットを作ってみよう!
はじめに
@niftyラボのジョニーです。
@niftyラボには「インサイド ラボ」というコラムのコーナーがあります。今回はその出張版ということで、Windows Vistaの新機能、サイドバーガジェットの作り方を紹介します。
Windows VistaのガジェットはHTMLとJavaScriptによって作ることができるので、今まで以上に簡単にデスクトップ上のミニアプリケーションを作ることができます。
サイドバーガジェットの詳細についてはマイクロソフトのページや、今後でてくるWebや雑誌の記事を見ていただくとして、ここでは"Hello World"を表示するだけのシンプルなガジェットを作ってみたいと思います。
ファイルの作成
この"Hello Worldガジェット"の制作手順はたったの4ステップです。
- "sample.gadget"というフォルダを作成する
- 上記フォルダのなかに"sample.htm"というファイルを作成する
- 上記フォルダのなかに"gadget.xml"というファイルを作成する
- "sample.gadget"のフォルダを各ユーザー用のガジェットフォルダにコピーする。
下記の画面は"sample.gadget"というフォルダの中身です。サイドバーガジェットのフォルダ名は".gadget"で終わらせる必要があります。
"sample.gadget"フォルダのなかに入れるsample.htmとgadget.xmlの内容は下記の通りです。
"sample.htm"は"hello world"と表示するための画面を作るHTMLで、"gadget.xml"はガジェットの情報を定義するマニュフェストファイルになります。
注意点として文字コードをutf-8にしてセーブしてください。
sample.htm
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
<style>
body {
width:130;
height:130;
}
</style>
</head>
<body>
Hello world!
</body>
</html>
gadget.xml
<?xml version="1.0" encoding="utf-8" ?>
<gadget>
<name>ハロー ワールド</name>
<namespace>yoursamplegadget.jp</namespace>
<version>1.0.0.0</version>
<author name="Your Name">
<info url="hoge.yoursamplegadget.jp" />
</author>
<copyright>2007</copyright>
<description>初めてのサイドバーガジェット</description>
<!-- icons>
<icon height="48" width="48" src="icon.png"/>
</icons -->
<hosts>
<host name="sidebar">
<base type="HTML" apiVersion="1.0.0" src="sample.htm" />
<permissions>full</permissions>
<platform minPlatformVersion="0.3" />
</host>
</hosts>
</gadget>
"sample.gadget"フォルダをガジェットのフォルダにコピーします。ユーザー個人のガジェットが格納されるフォルダは通常、下記の場所になります。
- "C:\Users\ユーザー名\AppData\Local\Microsoft\Windows Sidebar\Gadgets"
そして"ハローワールド"ガジェットのアイコンをクリックして追加すると、下記のようにガジェットがサイドバーに表示されれば成功です。
どうでしょう？ HTMLを書いたことのある方なら容易に作成できたのではないかと思います。
もちろん動きや機能を付けるにはJavaScriptやCSSを使う必要がありますが、Webページを作る要領で、デスクトップ上のミニアプリができるというのは新鮮な驚きではないでしょうか？
おわりに
今回のサンプルは単純にHTMLを表示するだけでしたが、「瞬！ワード」ガジェットや「12星座占い」ガジェットのように、インターネットのリソースにアクセスするガジェットもJavaScriptを使って作ることが出来ます。
@niftyのサービスにはRSSやXMLなどガジェットに使えそうなさまざまなデータを提供しています。最後に私の独断ですが（笑）、使ってみたら面白そうなデータを挙げておきます。これらのデータを使ったガジェットを自由なアイデアで作ってみませんか?
- ココログ RSSといえばブログサービスが代表例。ココログの各ページだけではなく、さまざまな情報がRSSで取得できるのでお勧めです。
- ポッドキャスティングジュース ポッドキャスティングジュースでは音声や動画の情報がRSSで配信されています。Windows MediaやQuickTimeをJavaScriptから呼べば、ラジオやテレビのようなガジェットができる気が。
- ニフティクリップβ ニフティクリップは流行りのソーシャルブックマークです。注目の話題集めなど情報収集に向いている上に、各データをRSSで配信しています。気になる情報を常に表示するガジェットなども簡単に作れそうです。
- アプラグβ アプラグβはブログやWebページに情報を貼り付けるブログパーツ的なサービスです。ガジェットはXMLなどのデータだけではなく、インターネット上のJavaScriptも呼べるので、アプラグβを活用すれば簡単に高度なガジェットができるかも。
- @search ニフティの検索サービスである@searchは、瞬！ワードのRSSだけでなく、ブログ検索の結果もRSSにすることができます。このデータを使えば自分の気になる情報をウォッチするガジェットも簡単にできると思います。
