HP webOS 3.0 SDK をインストールしたので、Enyo Framework で遊んでみました。
SDK のインストールは特に問題なくスムーズにインストールできました。
- 旧バージョンの確認（有ればアンインストール）
- Javaの確認（無ければインストール）
- VirtualBoxの確認（なければインストール）
- SDKのインストール
ざっとこんな感じインストールが出来ました。
さっそく、HP TouchPadのエミュレータを起動して見ます。
起動は「HP webOS Emulatorショートカット」から出来ます。（Windowsの場合）
エミュレータが確認出来ました。で、終わるって言うのもつまらないので簡単なアプリを作ってみました。
タブレットなので折角だからマルチパネルのあるアプリにしてみました。
[ソース]
enyo.kind({
name: "MultiPanel",
kind: enyo.VFlexBox,
components: [
{name: "slidingPane", kind: "SlidingPane", flex: 1, components: [
{name: "left", width: "320px", kind:"SlidingView", components: [
{kind: "Header", content:"ヘッダ 1"},
{kind: "Scroller", flex: 1, components: [
{content: "Hello World !"}
]},
{kind: "Toolbar", components: [
{kind: "GrabButton"}
]}
]},
{name: "middle", width: "320px", kind:"SlidingView", peekWidth: 50,
components: [
{kind: "Header", content:"ヘッダ 2"},
{kind: "Scroller", flex: 1, components: [
{kind: "Button", caption: "Hello World !", onclick: "btnClick"}
]},
{kind: "Toolbar", components: [
{kind: "GrabButton"}
]}
]},
{name: "right", kind:"SlidingView", flex: 1, components: [
{kind: "Header", content:"ヘッダ 3"},
{kind: "VFlexBox", flex: 1, components: [
{kind: "RowGroup", caption: "グループ", components: [
{content: "Hello World !"}
]}
]},
{kind: "Toolbar", components: [
{kind: "GrabButton"}
]}
]}
]},
{name: "myDialog", kind: "Dialog", components: [
{content: "Hello World !", style: "padding-left: 10px"},
{layoutKind: "HFlexLayout", pack: "center", components: [
{kind: "Button", caption: "OK", onclick: "okClick"}
]}
]}
],
btnClick: function() {
this.$.myDialog.open();
},
okClick: function() {
this.$.myDialog.close();
}
});
Mojo と Enyo ではユーザーインターフェースの作り方が大分違うのでまた少しずつ勉強しないと。
Programing
hp webos
Permalink