2009年12月23日水曜日

mixiアプリの練習1

mixiアプリとはいうものの要はOpenSocialのAPIを使うようですのでその辺を調べてみました。
とりあえず何か出すところまで。

1 デベロッパー登録する。
http://developer.mixi.co.jp/appli/pc/pc_prepare/add_app_flow
このあたりのページにデベロッパー登録のやりかた書いてあるんでまずは登録します。(と、いうかこの辺のページを見たら何か出すまでのやり方は書いてあるんですがw)

2 作ろうとしているアプリの情報を登録する。
http://mixi.jp/add_appli.pl
適当に登録します。重要なのはガジェットURLの欄ですね。他は適当でいいです。
ここには自分でファイルをおけるURLを指定します。
今回は、http://app.ukauka.net/g.xmlを指定しました。これはGoogle App Engine
で作成出来るスペースを利用しています。

3 ガジェットのxmlを作成
ガジェットURLに指定したファイルを作成します。
とりあえず以下のような感じにしました。

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="test" >
<Require feature="opensocial-0.8" />
</ModulePrefs>

<Content view="home">
<![CDATA[
ホームビュー
]]>
</Content>

<Content view="canvas">
<![CDATA[
<script type="text/javascript" src="http://app.ukauka.net/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://app.ukauka.net/app1.js"></script>

<div id='contents'></div>
]]>
</Content>

<Content view="profile">
<![CDATA[
プロフィールビュー
]]>
</Content>

</Module>


ポイントはContentのタグです。ここでは3つ設定されています。
home,canvas,profileです。
これはそれぞれアプリの表示される場所を表しています。
homeはホーム画面、プロフィール画面に表示されます。画面の右下のほうにちょろっと表示されます。
canvasがアプリを表示するメインの領域ですかね。

ここではcanvasに表示するために記述しています。homeとprofileには適当に文字が表示されるだけになっています。
canvasでは使用するjavascriptのファイルと、javascriptから表示領域をいじくるための目印としてidを設定したdivタグを記入しています。

0 件のコメント:

コメントを投稿