darjjeelling apps website


セピアカラー(sepia+color) ver.3.0公開

%e3%82%bb%e3%83%92%e3%82%9a%e3%82%a2%e3%82%ab%e3%83%a9%e3%83%bc

お久しぶりです、セピアカラーをご利用のみなさん。
いつもありがとうございます。

このたびアップデートが公開されましたので、お知らせいたします。

今回からアイコンを少し変更しました。
またiOS10対応を行いました。
なお今回からiOS7以降に対応とさせていただきます。

だいぶ放置してしまっていましたが、これを機にまたセピアカラーを使っていただけると幸いです。

これからも、よろしくお願いいたします!

darjjeelling - View my 'sepia+color' set on Flickriver

sepia+color


Xamarin Studio for Macでアプリを作ってストア公開してみた4

(2016/9)
(この記事は、Xamarin for Macでアプリを作ってストア公開してみた3 のつづきです)

ic_launcher明るさ変更機能の追加

前回ではズーム表示の機能を作りましたが、今回は画面の明るさを変更できる機能を追加してみましょう。

と、説明に入る前にいきなり余談ですが。
実はここは最大の鬼門でした。この機能をどうコーディングするかが分からずに1日くらい無駄にしてしまいました。

Androidでスマホの画面の明るさを指定するには、こんな感じで書けばいいですよね。

LayoutParameterクラスnewしてscreenBrightnessに好きな明るさの値を入れて、あとはgetWindow()でとったWindowにセットしてやります。

なので、これに対応するAPIを公式ドキュメントで探してみるわけです。
Android/iOS API互換100%をうたうXamarinですから、あるはずですよ!
そして近いのを見つけました。
これ↓
https://developer.xamarin.com/api/type/Android.Views.WindowManagerLayoutParams/
このWindowManagerLayoutParamsを使ってgetWindow()に対して指定してやればいいはず。
が、しかし、、、

getWindow()に対応するAPIがない!( ;´Д`)

なんじゃこりゃあ?絶対あるはずだ〜?でも検索に引っかからない、サンプルコードにもないし!?
もうパニックになりつつ迷って、これは誰かに聞くしかないか。と思った瞬間、フォーラムを探すのを忘れていたことに気づきました。
そしたら案の定、同じく悩んでた人がいるじゃないですか。

答えはバッチリここにありました。。。
http://forums.xamarin.com/discussion/comment/144246#Comment_144246

これをもとに書いた明るさを変えるコードがこちら。

うーん、言われてみれば、ActivityのWindowにSetAttributeって自然な流れのようにも見えますが。。。Androidの流儀とは全く違いますよねえ。Androidをもとに探してたらわかりませんよ。

Xamarinの罠にかかった、と思った瞬間でした。。。

さて、前置き長くなりましたが、さっきのChangeBrightness()を画面の明るさを変えるためのメソッドとして作り、これを画面上のボタンを押すたびに呼ばれるようにしていきましょう。
ボタンは例によって「+」「−」の二つを後で用意しますので、それぞれ押すと呼ぶ関数をここで作っておきます。
それがこちらです。

Lighten()が明るくするボタンを押された時に呼ぶ、Darken()は逆です。それぞれの関数内で先ほどのChangeBrightness()を呼んでますよね。これらのメソッドはMirrorFragmentクラス内に作ります。

さて、説明をスルーしてきましたが、MirrorControllerクラスに明るさ値を変更し、それを読み出せるようなメソッドを作っておきます。それを呼んでいるコードが上記に出てくる、
MirrorController.GetInstance().GetBrightness();
MirrorController.GetInstance().Lighten();
MirrorController.GetInstance().Darken();
なのです。
中身も一応見ておきましょう。MirrorController.csファイルを見てください。

明るさ値を保存する変数mBrightnessを用意して、1から5の範囲で値が変えられるようにします。GetBrightness()で返す値は、0〜1.0の値にするため5で割っています。

以上でメソッドの準備は終わり。
続いてfragment_mirror.xmlをいじって、ボタンを画面上に追加しましょう。
これは、前回のズームボタンとやり方は同じです。もう分かりますよね。

こちらのXMLファイルを見てみてください。
https://github.com/darjjeelling/mirrorapp/blob/master/Droid/Resources/layout/fragment_mirror.xml
これで、こんな画面イメージになります。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-08-27-19-16-47

そして、ボタンを押された時に先のLighten()/Darken()を呼ぶよう、MirrorController.csのOnClick()のSwitch文に追加すればOKです。

あとはボタンのリスナー登録もお忘れなく。
ここまで出来れば明るさ変更機能の完成です。

ic_launcherタップでストップ」機能の追加

さて、鏡アプリによくある機能でもうひとつ。それは、

画面を一時停止する機能。

使ったことありませんか?
横顔とか、後ろ髪とか、ふつうの鏡使っても自分の目でなかなか見えない場所。スマホをその辺りに向けて画面タップして一時停止してあげます。そのあと画面を見れば、見えない場所も自分で確認できるというものです。
まあ、簡易的なカメラ機能ですね。
これが、「タップでストップ」機能です。

それでは、画面をタップした時に一時停止を行えるようにしましょう。
まずは画面をタップしたことを検知するリスナーの登録。MirrorFragment.csに以下のように書きます。

View.IOnTouchListenerをクラス宣言に追加して、OnTouch()リスナー内に呼び出しコードを書きます。
ここではStopCapture()を呼ぶようにしています(8行目)
そのメソッドの中で画面を一時停止しますが、このように書きます。

7行目のmPreviewSession.StopRepeating();が肝です。
mPreviewSession変数はCameraCaptureSessionクラスで、これはカメラから流れてくる映像ストリーミングの制御するためのクラスです。
ミラー機能を実現するために、ふだんは前面カメラからリアルタイムに流れるストリーミングは垂れ流しで画面上に表示され続けます。この表示を開始するのがSetRepeatingRequest()メソッド。
これをMirrorFragmentクラスのUpdatePreview()内で呼んでいました。
ですが、今回は逆にこれを止めたい。
そのためのメソッドがStopRepeating()です。

上記のコードでは4行目でStopRepeating()つまり一時停止、と、表示の再開、つまりSetRepeatingRequest()もといUpdatePreview()を切り替えています。

そのフラグ切り替えのためのコードは例によってMirrorContorollerクラス内に作ります。

これで、画面をタップするたびに画面上の映像が止まったり再開したりする、「タップでストップ」機能が出来上がりました。

ic_launcher情報画面の追加

さて、ここまでで鏡アプリとして作っておきたい機能は作り終わりました!
ですが、最後に情報画面を追加してみましょう。
いわゆるPreferenceです。

Androidと同様に、以下の場所にXMLファイルを生成します。
Resources/Xml/preferences.xml

スクリーンショット 4-1.png

この中に、アプリのバージョン情報やサポートリンクなどを書きます。
さらに、このXML定義を使って画面を作るActivityクラスファイル(SettingsActivity.cs)も用意します。
この方法はAndroidで作る時と同様ですので解説を省きます。
出来上がりはこちらの2つのファイルです。
https://github.com/darjjeelling/mirrorapp/blob/master/Droid/Resources/Xml/preferences.xml
https://github.com/darjjeelling/mirrorapp/blob/master/Droid/SettingsActivity.cs

あと、情報画面を開くためのボタンを追加します。
それが、Resources/layout/fragment_mirror.xml内の以下の部分です。

画面の右上に出るようにレイアウトしています。
ボタン画像ファイルはmipmap-xhdpi/settings.pngを用意しました。

そして、ボタンを押された時に情報画面を表示するためのコードは、いつもの場所、MirrorFragmentクラス内のOnClick()に追加しましょう。

以上の手順を終えたら、画面右上のボタンを押して、情報画面が開くようになっていることを確認してみてください。

ic_launcher日本語化

ところで、これまでアプリ名やらToast表示やらは全部、英語表記のままでした。
これを日本語化しておきましょう。

やり方は、Resources/valuesフォルダと同列に、Resources/values-jaフォルダを作り、そこにStrings.xmlを作って日本語定義を書いてやります。
#これもAndroid開発の場合と同じですね。

こんな感じです。
https://github.com/darjjeelling/mirrorapp/blob/master/Droid/Resources/values-ja/Strings.xml

ic_launcherこれでおわり?

さてさて、ここまでおつかれさまでした。
これで鏡アプリとして作りたい機能はできました。めでたくアプリが完成!
、、、と言いたいところですが、まだやることは残っています。よね。

ともあれ今回はここまで。
つづきは次回最終回にて!

<この記事で作るアプリ>
鏡ミラー
https://play.google.com/store/apps/details?id=com.darjjeelling.app.mirror
Get it on Google Play

<アプリのソース>
https://github.com/darjjeelling/mirrorapp

<記事一覧>
Xamarin Studio for Macでアプリを作ってストア公開してみた
Xamarin Studio for Macでアプリを作ってストア公開してみた2
Xamarin Studio for Macでアプリを作ってストア公開してみた3
Xamarin Studio for Macでアプリを作ってストア公開してみた4
Xamarin Studio for Macでアプリを作ってストア公開してみた5


フォローチェックiPhone版 新バージョン9.5.1登場

Icon-App-60x60@3x

いつもフォローチェックのご利用誠にありがとうございます。

このたび新バージョン(9.5.1)が登場しましたのでおしらせします。

今回のバージョンはマイナーバージョンアップで、いくつかのバグ修正が含まれています。

・今日のレポートの表示修正
・オート de DM(設定より)の広告変更
・その他バグ修正

これからもよろしくお願いします!!

フォローチェック for Twitter


ポイント残高v3.0アップデート公開

ポイント残高

「ポイント残高」のご利用、ありがとうございます。

久々にアップデートをいたしました。
今回からiOS10に対応しました。
また、デザインも少し新しくなってます。

今後ともポイント残高をよろしくお願いいたします!

ポイント残高


Xamarin Studio for Macでアプリを作ってストア公開してみた3

(2016/9)
(この記事は、Xamarin Studio for Macでアプリを作ってストア公開してみた2 のつづきです)

ic_launcher「相手から見たモード」機能の追加

さて前回、インカメラからの映像を画面上に表示させるところまでやりました。
ここにもう少し鏡アプリらしい機能を追加していきましょう。

ち、な、み、に、

みなさん鏡アプリって使ったことありますか?
昔から数多く出ていますが、その中でも特に日本製アプリでよく見かける機能があるんですが、なにか分かりますか?

そう、「相手から見たモード」です!

普通にインカメラに映る自分の姿は、鏡を見ているのと同じ左右状態になっています。
これを左右反転して表示させると、相手から見た自分の姿が見える。(例えば、相手から見て左側は自分から見て右側)
これが相手から見たモード。この機能を追加していきましょう。

まずMirrorController.csファイルを新規追加します。
後でこのクラスを呼び出す関係でSingletonにします。
C#ではこんな感じで書けばいいようですね。

続いてこのクラス内に、現在どちらのモード(相手から見たモード?通常の鏡モード?)かを保存するフラグmMirrorFlipと、それを返す関数GetMirrorFlip()を用意します。
さらに、後でボタンを用意しますので、ボタンを1回押すごとにフラグを反転させるトグルスイッチの役目になる関数ToggleMirrorFlip()も追加します。
その結果がこちら。

ここまでできたら、画面にボタンを追加していきましょう。
Continue reading this entry »


Xamarin Studio for Macでアプリを作ってストア公開してみた2

(2016/9)
(この記事は、Xamarin Studio for Macでアプリを作ってストア公開してみた のつづきです)

ic_launcher新規プロジェクト作成

それでは、アプリを作り始めましょう。

まずはXamarinを立ち上げ、初期画面で”New Solution…”を選択。
Multiplatform>App>Native>Single ViewAppを選択します。
そして、”App Name””Organazaion Identifier”を入力していきます。
今回は
1)”App Name”:mirror
2)”Organazaion Identifier”:com.darjjeelling.app.mirror
とします。1)がアプリ名、2)がアプリ識別子です。
その他はとりあえずデフォルトにしておきましょう。

スクリーンショット2-01

これでプロジェクトが新規作成されました。

さて、今から作ろうとしているアプリがこちらですが、
鏡ミラー
https://play.google.com/store/apps/details?id=com.darjjeelling.app.mirror
前回説明しましたとおりこのアプリはカメラを使います。
なので、カメラへのアクセス権の設定が必要になります。

というわけでまずはマニフェストの設定を行っていきましょう。
Continue reading this entry »