2013年9月26日木曜日

猫のトイレ臭い対策でデオトイレを買ってみる

DSC00339普通の猫トイレを使っていたけど、1週間ほどで臭くなりだして、ニャンコも嫌がっている様子。

揃えた猫用品は前の記事を参照。猫2匹、5ヶ月のオスとメス

調べてみると重曹(ベーキングパウダー)を下に敷くと臭いが抑えられると聞いてやってみた。

確かに臭いが控えめになった気がする。。。けど、トイレが綺麗になるわけもなく、2週間で猫砂をまるっと替えているのが現状。

何とかならないものかと調べてみて、今度はシート交換式のデオトイレを買ってみた。

154521-1

おしっこの場合は下のシートが吸収してくれるので、掃除がかなり楽になる。

うんちは相変わらず臭い。こっちでうんちした場合はなぜか砂をかけてくれない。砂が大きいから?

前の猫トイレと両方おいておくと、前のトイレを優先的に使うみたい。猫砂の感じがお気に入りらしい。前の猫砂をデオトイレで使いたいが、砕けてシートの上に落ちてしまう。

総体的には買って良かった。

おしっこをデオトイレ、うんちを前の猫トイレでしてもらえると大変助かります。

 

< Related Posts >

2013年9月20日金曜日

[Titanium] iOSとAndroidで地図アプリ(Google Maps)を起動

map-app_from_titaniumアプリ内の地図と地図アプリを連携すると便利なので、パラメータを渡して起動する方法を調査。

環境: Titanium SDK 3.1.1.GA

参考にしたのは下記。

 

実際書いたコードを下記に抜粋。

iOSの場合はグーグルマップアプリがインストールしてあれば、そちらを優先して開く。
Androidの場合はおなじみのアプリを選択する。

緯度と経度をクエリとして渡した方がピンが立つので分かりやすい。

if (this.isAndroid) {
    // Google Map
    url = [];
    url.push('http://maps.google.com/maps');
    //url.push('?ll=' + this.region.latitude + ',' + this.region.longitude);
    url.push('?q=' + this.region.latitude + ',' + this.region.longitude);
    url.push('&z=16');
    Titanium.Platform.openURL(url.join(''));
    return true;
}

if (this.isIos) {
    // Google Map of Native App
    url = [];
    url.push('comgooglemaps://');
    //url.push('?center=' + this.region.latitude + ',' + this.region.longitude);
    url.push('?q=' + this.region.latitude + ',' + this.region.longitude);
    url.push('&zoom=16');
    if (Titanium.Platform.canOpenURL(url.join(''))) {
        Titanium.Platform.openURL(url.join(''));
        return true;
    }

    // Native App
    url = [];
    url.push('http://maps.apple.com/');
    //url.push('?ll=' + this.region.latitude + ',' + this.region.longitude);
    url.push('?q=' + this.region.latitude + ',' + this.region.longitude);
    url.push('&z=16');
    Titanium.Platform.openURL(url.join(''));
    return true;
}

 

< Related Posts >

2013年9月19日木曜日

[Titanium] Google Maps API v2用Androidモジュールを設定

google-maps-v2_titanium_android-moduleTitanium Mobileで作成したiOSアプリ、Androidアプリ内にGoogle Mapを表示して、店舗情報をプロット表示するために調査したときの覚書。

環境: Titanium SDK 3.1.1.GA

Titanium公式ドキュメントを読む。

iOSでは「Titanium.Map」
Androidでは「Modules.Map」というモジュール
を使うらしい。

iOS用にはKitchenSinkを参考にすれば難しくないと思う。ここからはAndroid用のモジュールを使えるようにするまでの手順。

 

Android用のモジュールに関する公式ドキュメントはこちら。

このモジュールはTitanium 3.1.0以上が必要なので注意。

 

簡単に手順をまとめると。

1.Google Play Services SDKをインストール

Android SDK Managerを起動して「Extras」 → 「Google Play services」をインストールする。

 

 

2.Google APIs Consoleに登録してAPI Keyを取得

Google APIs Consoleにアクセスして「Google Maps Android API v2」をONにする。

Google APIs Consoleの「API Access」 → 「Create new Android Key...」からアプリに埋め込まれているFingerPrintを入力

開発用のFingerPrintは下記コマンドで確認できる(パスワードはなし)。S
$ keytool -list -v -keystore ~/Library/Application\ Support/Titanium/mobilesdk/osx/3.1.1.GA/android/dev_keystore

すでにアプリを公開しているなら、keystoreファイルを作成しているはずなので、同じコマンドで確認できる。
$ keytool -list -v -keystore /path/to/keystore

詳しくは公式ドキュメントで。

複数行登録出来るようなので、開発用も同じAPI Keyにしてみた。FingerPrintとセミコロンのあとに入力するpackage nameはtiapp.xmlの「id」。

 

 

3.tiapp.xmlにAPI Keyとモジュールを設定

公式ドキュメントにあったのをそのまま貼り付け。ただGPS機能は使わないので除外。

<android>
    <manifest>
        <!-- Allows the API to download data from Google Map servers -->
        <uses-permission android:name="android.permission.INTERNET"/>
        <!-- Allows the API to cache data -->
        <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>  
        <!-- Allows the API to access Google web-based services -->
        <uses-permission android:name="com.google.android.providers.gsf.permission.READ_GSERVICES"/>
        <!-- Specify OpenGL ES 2.0 as a requirement -->
        <uses-feature android:glEsVersion="0x00020000" android:required="true"/>
        <!-- Replace <com.domain.appid> with your application ID -->
        <uses-permission android:name="<com.domain.appid>.permission.MAPS_RECEIVE"/>
        <permission android:name="<com.domain.appid>.permission.MAPS_RECEIVE" android:protectionLevel="signature"/>
        <application>
            <!-- Replace "PASTE YOUR GOOGLE MAPS API KEY HERE" with the Google API key you obtained -->
            <meta-data android:name="com.google.android.maps.v2.API_KEY" android:value="PASTE YOUR GOOGLE MAPS API KEY HERE"/>
        </application>
    </manifest>
</android>

読み込むモジュールも記述

<modules>
    <module platform="android">ti.map</module>
</modules>

 

 

4.使ってみる

var MapModule = require('ti.map');

win.add(MapModule.createView({
    mapType: MapModule.NORMAL_TYPE,
    animate: true,
    region: {
        latitude: 35.136942151841716,
        longitude: 136.90021680351,
        latitudeDelta: 0.05,
        longitudeDelta: 0.05
    },
    userLocation: false
}));

 

最後に開発してて気づいたことをいくつか

  • regionに緯度と経度は負の値を設定すると「Invalid Region」と怒られる(iOS)
  • scrollViewの中に入れるとうまく動作しない(Android)

 

 

< Related Posts >

2013年9月18日水曜日

リニア長野県駅「新飯田」の(大まかな)位置が公表されたので、Google Mapsに描画してみた

私の実家の近くに駅ができると聞いていたので気になっていた駅の場所。本日だいたいの位置が公表されたので、Google Mapsの機能を使って書いてみた。

情報元はJR東海の公式ホームページ

下記地図で枠が表示されない場合はこちらから。

153号線に隣接すると思うから、パチンコダイナムとドラッグストアの間ぐらいかな?

実家から歩いていけなくはないけど、個人的にはもう少し東の方がよかった。

2027年完成予定。

2013年9月11日水曜日

anyDensity="false"から脱出するためにAndroidの画面サイズ関連を理解する

screen-adjust-for-androidTitanium Mobileで開発していると、iOSアプリで確認してからAndroidアプリで確認してみると、レイアウトが崩れてしまうことが多い。

当初は「anyDensity="false"」に設定して誤魔化してきたけど、どのAndroid端末でも同じユーザーインターフェイスになるように画面サイズに関する資料を読んでみたときの覚書。

まずは公式ドキュメントを読む。

用語と概念を理解する

Screen size
画面サイズ
端末の物理的な画面の大きさ。
Androidでは、すべての画面サイズを4つに分類している。

small
normal
large
xlarge (extra large)
Screen density
画面密度
画面に対するピクセル数の密度。
単位はdpi (dots per inch)
ディスプレイではピクセルとドットが1体1で対応するので、ppi (pixel per inch)でも同じ意味になる。(wikipedia
Androidでは、全ての画面密度を4つに分類している。最近1つ増えた。

ldpi (low)
mdpi (medium)
hdpi (high)
  端末例)Samsung S2 (SC-02C), Xperia arc (SO-01C)
xhdpi (extra high)
  端末例)Samsung S3 (SC-06D), Xperia A (SO-02E)
xxhdpi
  端末例)Samsung S4 (SC-04E), HTC J One (HTL22)

参考:Androidアプリーリソース画像サイズ&種類ー : Excite Designer's Blog
参考:最新スマホ26機種徹底比較|スマートフォンガイド
参考:画面サイズと画面密度のシェア率 | Android Developers
Orientation
オリエンテーション
画面の向き。
横長か縦長か。
Resolution
画面解像度
画面のピクセル数の総数。
横ピクセル数x縦ピクセル数(例:1024x768)で表記される。
開発するときは画面のサイズと密度のみを意識し、解像度を意識することはない。
Density-independent pixel(dp)
密度非依存ピクセル
画面密度に影響されない仮想的なピクセル単位。
これが見た目の長さになる。
px = dp * (dpi / 160)
この「dp」単位を用いて画面レイアウトすべき。dipも同じ意味

 

Titaniumのデフォルトでは
Androidは「pixel」
iOSは「dp」
を使う。詳しくは公式ドキュメントで。

開発するときに長さを指定する箇所は共通関数を使う記述するようにしていると楽。

frameView = Titanium.UI.createView({
    width: Titanium.UI.FILL,
    height: Titanium.UI.SIZE,
    top: this.$.utils.len(20) // ← 各クラスに必ず渡す「$」に共通関数を定義してある
});

 

< 2015/07/28 Modified >
tiapp.xmlでデフォルトの単位を指定出来る。最近は新しいプロジェクトを作成するとデフォルトで「dp」が設定してある。

<property name="ti.ui.defaultunit" type="string">dp</property>

 


画面密度に対応した画像を用意する

iOSのRetina対応は倍の大きさの画像を同じディレクトリに「@2x」をつけて置いとけばいい。これはTitaniumではなくiOS開発のルール。

Androidの場合は指定のディレクトリを用意しておけば自動で読み込んでくれる。

 

Androidは「9-patch」という仕組みがあるので、要素に合わせて背景画像が伸縮する場合も綺麗に表示できる。

 

アイコンの作成に関するTipsも参考になる。

 

 

< Related Posts >

2013年9月10日火曜日

Google Maps API v3を使って地図上に店舗情報をプロットする

google-maps-api-v3Google Mapに店舗情報をプロットする開発したときの覚書。1年前の下書きを元にしているので情報が古いかも。

環境: Google Maps API v3

やりたい事

  • 緯度と経度を元にGoogle Map上にプロットする
  • プロットしたときのアイコンを独自のアイコンにしたい
  • 表示される吹き出しもいい感じにしたい
  • 表示された店舗情報の数・位置によって、地図上の縮尺をいい感じにしたい
  • たくさんの情報がプロットされたとしてもいい感じに表示したい
  • 住所から緯度と経度を取得したい。逆も。

こんな風に実現できた。

image

 

まずはGoogleの公式ドキュメントを読む。

 

地図を日本語表示したい場合は「language=ja」を追加する

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&language=ja">

 

住所から緯度と経度を取得するには、下記を参考に。

 

Google Mapに渡せるQuery Parameterは下記に情報があったけど、今はなくっているみたい(2013年9月9日時点)

 

jQueryで簡単に使えるようなライブラリがやっぱりあった。

でも使ってない。

 

近くに情報があったときにまとめて表示するには、下記ライブラリを使う。

これのMarker Clusterer。サンプルがあるので分かりやすい。

 

その他開発するときにハマったのは、Google Mapを読み込む際にElementが非表示だとうまく動作しないので注意。

この場合は表示した段階で地図が読み込み完了しているか判断する必要がある。

 

Google Mapをライセンス上使いたくない場合は下記のようなサービスを利用してみてもいいかも。

 

< Related Posts >

2013年9月9日月曜日

Androidアプリの画面(UI)設計をする際に読んでおきたい資料

android-design-patternsアプリの画面設計する際にどんなUIにするべきか調査したときの覚書。役に立ちそうなサイトの紹介

 

Android Interaction Design Patterns
Androidのデザインパターンを紹介。
それぞれの利点と欠点があり、サンプルアプリを掲載されていてわかりやすい。

 

Draw 9-patch | Android Developers
「NinePatch」を活用すれば、吹き出しや角丸デザインも恐くない。
ちなみにiOSでは同じ仕組みはない。外部ライブラリを使えば出来るみたい。

 

Android Asset Studio
9-patchやアイコンなどを生成してくれるオンラインサービス。

 

Android UI Patterns: Watch this: Google I/O 2013 - Android Design for UI Developers
Google I/O 2013のセッション記事。UI設計に関する動画へのリンクがある。
Android 4.0からのデザインガイドラインの説明。

 

Android UI design patterns: Google I/O 2010
Google I/O 2010のUI設計に関するセッション動画。
まだAndroid2.3系も多いので、この辺の方が役に立つかも。

 

他にもGoogle先生に「App UI Design Pattern」などで聞くといろいろ参考になる情報が出てくる。

 

< Related Posts >

Related Posts Plugin for WordPress, Blogger...

Blog Archives