2013年5月6日月曜日

Titaniumでアプリ開発(10) 位置情報を表示する

ひとまず緯度経度を表示するアプリが完成しました。





























ソースの一部

③の部分
タブを作成する
// タブの作成
var tabGroup = Ti.UI.createTabGroup();

var tab1 = Ti.UI.createTab({
    icon: 'KS_nav_views.png',
    title: 'いどけーど',
    window: win1
});

var tab2 = Ti.UI.createTab({
    icon: 'KS_nav_ui.png',
    title: 'ヘルプ',
    window: win2
});

tabGroup.addTab(tab1);
tabGroup.addTab(tab2);
tabGroup.open();

// 現在地ボタンを押したときの処理
function setCurrentPosition () {
Titanium.Geolocation.getCurrentPosition(
function(e) {
if(!e.success || e.error){
alert('位置情報が取得できませんでした');
return;
}
// 現在地をセット
latitude = e.coords.latitude;
            longitude = e.coords.longitude;
// 現在地を動的に表示する
var currentPos = Titanium.Map.createAnnotation({
latitude: latitude,
longitude: longitude,
pincolor: Titanium.Map.ANNOTATION_RED,
animate: true
});
①の部分
                現在地をラベルとして表示する
               \でなく¥を使うとエラーになる
var lolabel = {
text: "緯度:"+latitude+"\r経度:"+longitude,
height: Ti.UI.SIZE
};
var label = Ti.UI.createLabel(lolabel);
topWindow.add(label);
    mapview.addAnnotation(currentPos);
        mapview.show(); // 隠していた地図を表示する
        mapview.setLocation({   // 現在地まで地図をスクロールする
            latitude:latitude,
            longitude:longitude,
            latitudeDelta:0.01,
            longitudeDelta:0.01
        });
}
);
}

②の部分
topのwindowを作成する
var topWindow = Ti.UI.createWindow(
    {
        height:150,
        width:300,
        top:20,
        font:{fontSize:20},
        borderWidth:2,
        borderColor:'#bbb',
        backgrondColor:'#fff',
        borderRadius:5
    }
);

④の部分
ボタンを作成
var locationButton = Ti.UI.createButton(
    {
        top: 190,
        left: 10,
        width: 90,
        height: 44,
        title: '現在地'
    }
);
ボタンを押したときに関数をsetCurrentPosition()を実行
locationButton.addEventListener(
    'click',
    setCurrentPosition
);

クリアボタン、メールボタン、ヘルプとかを一通り実装した段階で試しにAppleStoreに申請してみます。

0 件のコメント:

コメントを投稿