子ども向けの時計アプリ「こどもクロック」を公開しました

困ったことに、うちの小学一年生の娘は時計が全然読めません。
というか、「今日はあと何日?」とか「明日は何時?」といった、時の概念が頭の中に存在していないのかと思われる異次元発言も多々見受けられ、将来がいささか不安でもあります。

そんな時計が読めない子ども向けにAndroid用アプリを作成しました。

こどもクロック使い方

基本機能は

  • 「はちじはっぷん」のように時間を唱えれば、その時間を文字盤にスルスルっとセットします
  • 文字盤にセットした時間をロボットっぽく読み上げます

「ロボットっぽく」というのは単にGoogleのテキスト読み上げがそんな感じなので、本当は人間っぽくスラスラ読み上げて欲しいところ。なんでもソツなくこなすGoogleさんの技術力もまだまだ発展途上のようです。

アプリはスマホからタブレットまで対応しています。

Googleの音声認識とテキスト読み上げの機能をフル活用しているので、Androidアプリオンリーです。iPhoneにはSiriっていう音声認識の機能が組み込まれているので、そのAPIが開発者に公開されれば対応できるのですが、しばらくは無理っぽいですね。

よかったら使ってみてください。無料です。

こどもクロック
STUDIO BEATNIX
価格:0  平均評価:0.0(0 件)


SwiftのプロジェクトにAdMob 7.0を導入

SwiftのプロジェクトにGoogle Mobile Ads SDK 7.0を導入してみました。

7.0からフレームワークという形での配布になったり、公式サイトでの説明はObjective-Cでの説明だったりと、つまずく人はつまずくと思うのでメモしておきます。ちなみに僕はつまずきやすいところでは必ずつまずくタイプ。現実の世界でも、段差があるところは必ずつまずきます。

こちらが公式の説明。英語ですが図が豊富なのでなんとなくわかります。
https://developers.google.com/mobile-ads-sdk/docs/admob/ios/quick-start

まずSDKを入手します

SDKはこちらからダウンロードできます
Downloads – Google Mobile Ads SDK — Google Developers
2015年2月19日現在、最新バージョンは7.0.0です

プロジェクトに追加する

ダウンロードした「googlemobileadssdkios.zip」を解凍するとできる「GoogleMobileAds.framework」をプロジェクトに組み込みます。「GoogleMobileAds.framework」を組み込みたいプロジェクトにドラックすれば追加されます。

必要なframeworkを追加する

ここは公式の説明そのままなので省略します

Storyboardでバナー用のViewを追加する

こちらも公式の説明そのままです。

プログラムにAdMob呼び出しの記述を追加

Storyboardで作ったバナーとViewControllerを接続します。
これも公式サイトに説明が詳しいです。

接続すると、ViewControllerに
@IBOutlet weak var bannerView: GADBannerView!
が追加されます。

このままではプログラムが「GADBannerView」って何なの?わからない!ってなってエラーがでるので、
import GoogleMobileAds
を追加します。さっき追加したframeworkですね。

AdMobの呼び出しも追加するとViewController.swiftはこんな感じになります。

import UIKit
import GoogleMobileAds

class ViewController: UIViewController {

    @IBOutlet weak var bannerView: GADBannerView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // AdMob呼び出し
        bannerView.adUnitID = "ca-app-pub-0000000000000000/0000000000"
        bannerView.rootViewController = self
        bannerView.loadRequest(GADRequest())
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

これをシミュレーターで実行すればテストバナーが表示されます。
AdMob表示

Swiftのプロジェクトにレビューへ誘導するダイアログを表示するAppiraterを導入

SwiftはObjective-Cに比べると融通が利かないというか、頑固というか、ちょっとしたことでエラーが出て困りますね。思うように進まなくて非常にもどかしい。

例えば変数の型。型が違うもの同士を計算するだけでエラーです。字はあってるけど書き順が違うからバツ、この漢字はちゃんとはねてないからとバツみたいな恐ろしく厳しい先生みたいです。たぶんその厳しさを乗り越えたら、バグの少ないプログラムが書けるようになるんだと自分に言い聞かせ、Swift先生の愛のムチに耐えながらプログラムを書いています。

そういや、新人の頃に始めて作ったプログラムで安易にキャスト(型変換)を使ってこっぴどく怒られた覚えがあります。型はとても大事。

それはさておき。

アプリのレビューへ誘導するダイアログ表示を簡単に実装できるAppiraterをSwiftのプロジェクトに組み込んでみました。

レビュー誘導のダイアログはユーザーにとっては迷惑なものですが、アプリ制作者としてはちょっとでも反応が欲しかったりするので、組み込むべきかどうか悩ましいところです。その点Appiraterは、アプリをある程度使い込んでからダイアログを出すなど、細かくカスタマイズできて便利です。

このAppiraterですがObjective-Cで書かれているので、Swiftのプロジェクトに組み込むには一手間必要になります。以下その手順です。

Appiraterを入手する

まずはともあれAppiraterをダウンロードします
Appiraterダウンロード

ダウンロードできたら「appirater-master.zip」を解凍してプロジェクトに追加します。「appirater-master」フォルダをぐわっと組み込みたいプロジェクトにドラッグすれば追加できます。CocoaPodsとか使うと簡単なのかな?とりあえず今回は自力で追加です。

Appiraterをプロジェクトに追加する

必要なフレームワークを追加する

ここまではObjective-Cの時と変わりません。
ターゲットを選んで、「General」の「Linked Frameworks and Libraries」でフレームワークを追加します。追加するのは「CFNetwork.framework」「SystemConfiguration.framework」「StoreKit.framework」の3つです。 「StoreKit」だけはOptionalで。

必要なフレームワークを追加

特別なヘッダファイルを作る

swiftからObjective-Cのソースを参照できるように、特別なヘッダを作成します。作成するファイル名は
(ターゲット名)-Bridging-Header.h
です。今回は「AppiraterDemo」ってターゲット名なので「AppiraterDemo-Bridging-Header.h」を作成します。

特別なヘッダファイルを作る

この作成したヘッダファイルに

#import "Appirater.h"

と記述します。Objective-Cのソースを参照したい場合、そのヘッダファイルをここにどんどん追加していくわけですね。今回は「Appirater.h」だけ追加。

で、プロジェクトのビルド設定の「Swift Compiler – Code Generation」の「Objective-C Bridging Header」に作成したヘッダファイルのパスを記述します
今回は
AppiraterDemo/AppiraterDemo-Bridging-Header.h
を設定
パスを設定

プログラムに組み込みます

AppDelegate.swiftにイニシャライザを追加(自動で作られるソースにはないはず)して、Appiraterの初期化処理を書きます。普通にSwiftのコードでかけるのがすごいですね。

override class func initialize() {
    Appirater.setDebug(true)        // デバッグ(必ずダイアログを表示)
    Appirater.setAppId("123456")    // アプリのAppId(自分のアプリIDに変更)
    Appirater.appLaunched(true)
}

これで実行すれば、ダイアログが表示します。簡単簡単。

ダイアログ表示

・・・と思ったらアプリ名の部分が(null)になってますね。(null)なんてアプリ名にした記憶は全くないのに!

これは「CFBundleDisplayName」を設定していないからです。CFBundleDisplayNameはinfo.plistで設定できますが、ここに追加してもダメなので、新規に「InfoPlist.strings」というファイルを作る必要があります。新規ファイルの作成して、ResourceからString.fileを選んで作成します。

ダメな例。ちゃんと追加しているのにアプリ名が(null)になります。
info.plistに追加

アプリ名を国ごとに変えたい場合にも必要になるので、ここは素直にInfoPlist.stringsを作ります。
InfoPlist.stringsを作成

そのInfoPlist.stringに

CFBundleDisplayName = "Appiraterデモ";

と記述して実行してみると・・・

ダイアログ表示

無事アプリ名が表示されました。
Appirater自体の設定は、丁寧に説明してくれているサイトがすでにたくさんあるので、ここでは割愛します。