Mtk's Blog

2014年2月8日土曜日

[VOCALOID] MEIKO V3

CUBAE, StudioOne and MEIKO V3
MEIKO V3を使ってみました。

MEIKO V3
Joshin Web価格
（税込、送料込）

使ってみて思った点をまとめてみまとした。
初音ミクV3 や KAITO V3 のまとめと重複する点がありますのでご了承ください。

このブログを書いている時点の環境は次の通りです。
・Windows8 (64bit)
・ASIO対応オーディオインターフェイス
※残念ながらMac版のレビューはありません。

箱の中は
・MEIKO V3・Windows用DVD-ROM
・MEIKO V3・Mac用DVD-ROM
・StudioOne・Windows/Mac共通DVD-ROM
・ライセンス登録カード、マニュアル、チラシ類
が入ってます。
箱の下側の差し込みにメッセージが書いてあります。

ピアプロスタジオとStudioOne

MEIKO V3にはピアプロスタジオとMUTANTというVSTプラグインが付属します。
VSTプラグインは単体では起動できず、ホストとなるDAWが必要です。
MEIKO V3にはStuidoOne ARTIST Piapro EditionというDAWが付属します。
StuidoOneを使えば、録音した演奏や、MIDIシーケンサーを使ってシンセサイザーで伴奏を作ることが出来ます。
StuidoOneでMEIKO V3の歌声にエフェクトをかけたり、伴奏とミックスすることもできます。
条件さえ整えば市販されている他社製のVOCALOID3やVOCALOID2を歌わせることも出来ます。

[VOCALOID] ピアプロスタジオをStudioOneなしで起動する
[VOCALOID] 他社ボーカロイドに対応したピアプロスタジオ
ピアプロスタジオ 64bit版
[VOCALOID] StudioOneFreeでVOCALOIDの声を聞きやすくする

容量の内訳

MEIKO V3をWindowsにインストールするにはディスクドライブに25Gバイト以上の空き容量が必要とされています。
ライブラリーごとのおおよその内訳は次のようになってました。

POWER	1.25GB
STRAIGHT	1.18GB
DARK	1.28GB
WHISPER	1.03GB
ENGLISH	3.08GB

MEIKO V3は5種類のライブラリーすべてをインストールすると 7.82GB の容量になります。
インストールしないライブラリーを指定することも出来ます。
25GBというサイズはStudioOneなどを含めた容量のようです。
インストール先の空き容量が不足していれば不要なソフトをアンインストールして空き容量を増やすか、ハードディスクやSSDの追加・交換が必要になるかもしれません。
ちなみに初音ミクV3 は18Gバイト、 KAITO V3 は25Gバイトの空きが必要とされてます。

容量について他社の日本語VOCALOID3を調べてみたら2011年発売の「メグッポイドPower」(Internet)が900Mバイトですが2013年発売の「メルリ」(i-Style)は3Gバイトとなっています。
今後新しく発売されるボーカロイドは容量が増える傾向にあるのかもしれません。

別売りのWindows版 VOCALOID3 Editorで使えるか？

使えました。
EZmix 2 Lite や INTERNET FormantShift VST
を使って歌声にエフェクトを掛けることもできました。
StudioOneとピアプロスタジオを使いこなせればVOCALOID3 Editorは買う必要は無いのですが、ピアプロスタジオにどうしてもなじめない場合はご検討ください。
VOCALOID3 Editorは、他社製VOCALOID2をVOCALOID3にインポートしてピアプロスタジオで使えるようにするのに必要なライブラリー・インポート・ツールが付属したり、ジョブプラグインが使えるという特典があります。

[VOCALOID] VOCALOID3 Editor を使ってみました

ボカキュー(VOCALOID Editor for CUBASE)で使えるか？

・CUBASE7.5 (64bit)
・VOCALOID Editor for CUBASE 1.1.0 (64bit)
の環境で使えました。
ボカキューはCUBASEの拡張機能なのでCUBASEがなければ使えません。
CUBASEは価格が高い上にPC/Macもそれなりのスペックが必要になります。追加投資が必要になることもあります。
導入はよくご検討ください。
ボカキューにも他社製VOCALOID2をVOCALOID3にインポートしてピアプロスタジオで使えるようにするのに必要なライブラリー・インポート・ツールが付属します。

VOCALOID Editor for CUBASE（ボカキュー）で何が変わるか？
[VOCALOID] CUBASEで「ぼかりす」(VocaListener)っぽいことをする

ブレスの発音方法

MEIKO V3にはブレス(息継ぎする際の「はぁ」という発音)のサンプリングがwavファイルとして合計25種類収録されています。
ブレスの発音記号[br1]～[br5]も使えます。

裏技・インストール中の一時フォルダー

MEIKO V3はインストール中、Cドライブに一時フォルダーを作成します。
MEIKOの画像が画面いっぱいに表示されている間に Windowsキー + Eキーでエクスプローラーを起動し
%TMP%
という場所を開き(アドレスに入力し)、更新日時がインストールした時と一致するサブフォルダーがそれです。
このサブフォルダーの中に最大 1400×1050 ピクセルの3種類の画像が次のファイル名で保存されています。
Welcome_1024.bmp
Welcome_1280.bmp
Welcome_1400.bmp

インストールが完了するとファイルは削除されるのですが、空のフォルダーが残ります。
KAITO V3や初音ミクV3はもちろん他社製品や体験版までもが同じようにインストール中に画像ファイルなどを展開し、インストール後は空フォルダーを残していきます。

空フォルダーを削除するとCドライブがきれいになった気分になれるという裏技です。

ボーカロイドの引っ越し儀式

初音ミクV3や他のボーカロイドを別のPC/Macにインストールし直すときは、先にインストール済のPC/Macで VOCALOID Deactivation Tool を実行してアクティベーションを解除しましょう。
これを忘れるとボーカロイドを引っ越し先のPC/Macにインストールしても動作しません。
とくに中古で販売されているボーカロイドは要注意です。
前のオーナーがアクティベーションを解除しないと自分のPCにインストールしても使うことが出来ません。
(そもそもボーカロイドは使用許諾契約により譲渡禁止とされています)

VOCALOID Deactivation Tool を使ってみました

まとめ

MEIKO V3は5種類のライブラリーとDAWやプラグインがセットで16800円という価格で販売されてます。
他社VOCALOID3が1つのライブラリーに付き1万円前後ですからMEIKO V3の価格は良心的な設定と思ってます。
StuidoOne ARTISTはCUBASEと比較すると、起動や画面表示などの動作がきびきびしているように思えます。
MEIKO V3は、声さえ気に入れば「DTM未経験だけどボーカロイドで作曲したい」という人にとってハードルを下げてくれる商品だと思います。
ただしDTMは覚えることがそれなりにありますので、分からないことがあっても気にせず分かる範囲で長く使い続けることをおすすめします。
なお、MEIKO V3の販売元が運営する http://piaprostudio.com/ では作曲のためのチュートリアルが用意されています。

日本語のみ

日本語と英語

2014年2月1日土曜日

[Android] AQUOS PHONE ZETA SH-06E

私事ですが最近スマートフォンを買いました。
2013年夏モデル AQUOS PHONE ZETA SH-06E

実際に使ってみて思った点をまとめてみました。

「エアオペレーション」はアイデア次第でおもしろ使い方が出来そう

「エアオペレーション」は画面に指を近づけるだけでタップ・スワイプと同じ動作が出来る機能です。
触ってないのに反応してしまうので慣れが必要ですが、専用アプリケーションを作ると面白そうです。

開発者泣かせの「エコ技」付き

「エコ技」はシャープ製のスマートフォンに搭載されている、バッテリーの消耗を抑える機能です。
特に開発者が影響を受けるのは、画面消灯中に
・ブロードキャストインテントの通知制限
・データ通信制限
・自動同期処理の遅延
を抑止する仕様です。
それと引き替えにバッテリーの持ちを良くしてくれる機能なので無視できません。
詳細はこちら
https://sh-dev.sharp.co.jp/android/modules/others/

充電やPCとの通信が出来ないUSBケーブルがある

同じ仕様のUSBケーブルにもかかわらず、充電が出来るものと出来ないものがありました。
同メーカーの旧機種で使えていたUSBケーブルにもかかわらず、この機種では使えないのです。
USBケーブルを調べてみましたが断線や漏電はありませんでした。
機種変更したらUSBケーブルも買い換える必要があるかもしれません。

USBケーブル以外のトラブルは特にありませんでした。
在庫処分されてた型落ち品ですが、デバッグ機としては十分なスペックですし、日常使うスマートフォンとしても問題ないようです。

以下、今まで使っていたLYNX 3D SH-03Cの思い出です。
Wi-Fi Sync Screen (特定のWi-Fiルーターをリセットさせる挙動を回避)
WebViewをタップするとアプリがクラッシュ (FATAL EXCEPTION)
画像ファイルをロードするとOuot of Memory Exceptionが起きやすい

実機は仕様通りに動作してくれないことが分かりました。
メーカー独自の機能が搭載されているためと思われます。
おかげでクラッシュしにくいアプリを作ることが出来ました。
SH-06Eもいろいろな挙動を見せてくれることに期待しています。

以上、参考になれば幸いです。

2014年1月25日土曜日

[Firefox] 消えてしまったブログのHTMLソースを復元するには

How to restore the deleted web contents
当ブログはBlogger.com(blogspot.com)を利用しています。
ブログを投稿するためのWebブラウザーはFirefoxを利用しています。

Blogger.comには「下書き」という機能があり、未完成のブログを保存することができます。
下書きはとても便利なのですが、ごくたまにブログの下書きが消えていることがあります。
ブラウザーで投稿画面を2つ以上開いていると消えてしまうことがあるようですが詳細は不明です。
先日も下書きが消えてしまうことがありました。

Firefoxは表示したWebの内容をキャッシュに保存しています。
プレビューしたときのキャッシュが残っていればキャッシュから復元することができます。
Firefoxで一度でも表示したことがあれば復元できる可能性があります。
Firefoxのこの機能のおかげで何とか復元することができました。

1.
ナビゲーションバーを右クリックし、メニューの「カスタマイズ」を表示させます。
「ツールバーのカスタマイズ」の中にある「履歴ボタン」をナビゲーションバーにドラッグ・ドロップします。

2.
Altキーを押してメニューを表示させます。
ファイル - オフライン作業
をクリックします。

3.
1.で表示させた履歴ボタンをクリックします。
履歴を検索するためのサブウインドウが表示されるのでキーワードを入力して探り当てます。

4.
履歴をクリックすると、キャッシュが残っていればプレビューした当時のブログが表示されます。

Ctrlキーを押しながらSキーでページを丸ごと保存するか、右クリックの「ページのソースを表示」でHMTLソースをコピーするなどの方法で取り戻しましょう。

条件によってはキャッシュがなくなっていることがあります。

(最後に閲覧してから日が経ちすぎている、キャッシュの容量が制限を超えた、コンテンツがキャッシュ禁止にされているなど)
キャッシュがなければFirefoxの履歴から復元することはできません。

以上、参考になれば幸いです。

2014年1月18日土曜日

[Android] アナログ時計アプリをライブ壁紙に改造する

The analog clock on the live wallpaper
前回 SurfaceViewで作成したアナログ時計アプリをライブ壁紙として改造てみました。
ライブ壁紙のAPIはSurfaceViewにそっくりです。
ソースコードを丸ごと流用できるわけではありませんが、SurfaceViewで開発したアプリはライブ壁紙に移植しやすいです。

針の画像です。128×128ピクセルです。

左から秒針、分針、時針のつもりです。
針の画像それぞれのピクセル数は32×128です。一番右の黒い塗りつぶしの領域は使用しません。

Eclipseのパッケージ・エクスプローラーで、プロジェクトの res フォルダーの下に
drawable-nodpi
というフォルダーを作り針の画像を配置します。

解像度ごとに大きさを合せた針の画像を用意したほうがいいかもしれません。

今回の開発環境は次の通りです。
・64bit版 Windows8
・32bit版 Eclipse3.7 (Windows XPモードで使用)
・Android-SDK r22.3

ライブ壁紙の対応OSはAndroid2.1以上なのでSDKの最小バージョンは7以上にする必要があります。

ライブ壁紙はXMLによるメタデータが必要です。
Eclipseのパッケージ・エクスプローラーで res フォルダーの下に xml というフォルダーを作り、メタデータのファイルを保存します。
メタデータファイル(res/xml/wallpaper.xml)

<?xml version="1.0" encoding="utf-8"?>
<wallpaper
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:thumbnail="@drawable/ic_launcher" />

ライブ壁紙のソース(WallpaperSasmple.java)

package jp.fujiu.analogclockwallpaper;

import java.lang.ref.WeakReference;
import java.util.Calendar;

import android.content.SharedPreferences;
import android.content.SharedPreferences.OnSharedPreferenceChangeListener;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.os.Handler;
import android.os.Message;
import android.service.wallpaper.WallpaperService;
import android.view.SurfaceHolder;

public class AnalogClockWallpaper extends WallpaperService {
 private static boolean isAlive = true;

 @Override
 public Engine onCreateEngine() {
  return new MyEngine();
 }

 private static class MyHandler extends Handler {
  static final int WHAT = 1;
  private static final long INTERVAL = 50;

  private WeakReference<MyEngine> engine = null;

  private Bitmap secNeedleImg = null;
  private Bitmap minNeedleImg = null;
  private Bitmap hourNeedleImg = null;

  private boolean isFast;
  private int centerX = 0;
  private int centerY = 0;
  private int drawX = 0;
  private int drawY = 0;
  private int width = 0;
  private int height = 0;

  //時間
  int preSec = -1;

  public MyHandler(WeakReference<MyEngine> engine) {
   this.isFast = true;
   this.engine = engine;
   this.secNeedleImg = engine.get().secNeedleImg;
   this.minNeedleImg = engine.get().minNeedleImg;
   this.hourNeedleImg = engine.get().hourNeedleImg;
  }
  
  public void setScreenSize (int width, int height){
   this.width = width;
   this.height = height;
    isFast = true;
   
  }

  //描画のメインループ
  @Override
  public void handleMessage(Message msg) {
   removeMessages(WHAT);

   /*
   Log.d(getClass().getSimpleName(), "handleMessage");
   Log.d(getClass().getSimpleName(), "isAlive: " + String.valueOf(isAlive));
    */
   
   if (isAlive == false) {
    return;
   }

   //現在時刻から各針の角度を算出
   Calendar now = Calendar.getInstance();
   int sec = now.get(Calendar.SECOND);
   if (sec != preSec) {
    preSec = sec;
    float secDegree = (float) sec * 6;
    int min = now.get(Calendar.MINUTE);
    float minDegree = (float) min * 6 + secDegree / 60;
    int hour = now.get(Calendar.HOUR);
    float hourDegree = (float) hour * 30 + minDegree / 12;

    SurfaceHolder holder = this.engine.get().getSurfaceHolder();
    Canvas canvas = holder.lockCanvas();
    if (canvas == null) {
     //SurfaceViewの準備が終わってなければ時間を空けてリトライ
     sendEmptyMessageDelayed(WHAT, 10);
     return;
    }

    //最初の1回だけの処理
    if (isFast) {
     //中心座標を計算
     centerX = this.width / 2;
     centerY = this.height / 2;
     drawX = centerX - secNeedleImg.getWidth() / 2;
     drawY = centerY - secNeedleImg.getHeight() / 2;
     isFast = false;
    }

    //背景を灰色で塗りつぶし
    canvas.drawColor(Color.GRAY);

    //秒針の表示
    canvas.save();
    canvas.rotate(secDegree, centerX, centerY);
    canvas.drawBitmap(secNeedleImg, drawX, drawY, null);
    canvas.restore();

    //分針の表示
    canvas.save();
    canvas.rotate(minDegree, centerX, centerY);
    canvas.drawBitmap(minNeedleImg, drawX, drawY, null);
    canvas.restore();

    //時針の表示
    canvas.save();
    canvas.rotate(hourDegree, centerX, centerY);
    canvas.drawBitmap(hourNeedleImg, drawX, drawY, null);
    canvas.restore();

    holder.unlockCanvasAndPost(canvas);

   }
   sendEmptyMessageDelayed(WHAT, INTERVAL);
  }
 };

 public class MyEngine extends Engine implements OnSharedPreferenceChangeListener {
  private MyHandler myHandler = null;
  private Bitmap needleImg = null;
  private Bitmap secNeedleImg = null;
  private Bitmap minNeedleImg = null;
  private Bitmap hourNeedleImg = null;

  @Override
  public void onSurfaceChanged(SurfaceHolder holder, int format, int width, int height) {
   super.onSurfaceChanged(holder, format, width, height);
   if (myHandler == null) {
    initHandler();
   }
   myHandler.setScreenSize(width, height);
   myHandler.sendEmptyMessage(MyHandler.WHAT);
  }

  @Override
  public void onVisibilityChanged(boolean visible) {
   AnalogClockWallpaper.isAlive = visible;
   if (visible) {
    if (myHandler == null) {
     initHandler();
    }
    myHandler.sendEmptyMessage(MyHandler.WHAT);
   }
  }
  
  private void initHandler(){
   //画像のロード
   needleImg = BitmapFactory.decodeResource(getResources(), R.drawable.clock_needles);

   int destWidth = this.needleImg.getWidth();
   int destHeight = this.needleImg.getHeight();

   //秒針の画像
   secNeedleImg = Bitmap.createBitmap(needleImg, 0, 0, destWidth / 4, destHeight);

   //分針の画像
   minNeedleImg = Bitmap.createBitmap(needleImg, destWidth / 4, 0, destWidth / 4, destHeight);

   //時針の画像
   hourNeedleImg = Bitmap.createBitmap(needleImg, (destWidth / 4) * 2, 0, destWidth / 4, destHeight);

   needleImg.recycle();

   myHandler = new MyHandler(new WeakReference<MyEngine>(this));
  }

  @Override
  public void onSharedPreferenceChanged(SharedPreferences sharedPreferences, String key) {
  }
 }
}

マニフェスト(AndroidManifest.xml)

<manifest
    xmlns:android="http://schemas.android.com/apk/res/android"
    package="jp.fujiu.analogclockwallpaper"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="7"
        android:targetSdkVersion="7" />

    <uses-feature
        android:name="android.software.live_wallpaper" />

    <uses-permission
        android:name="android.permission.SET_WALLPAPER" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="Analog Clock Wallpaper" >
        <service
            android:name=".AnalogClockWallpaper"
            android:label="Analog Clock Wallpaper"
            android:permission="android.permission.BIND_WALLPAPER" >
            <intent-filter>
                <action android:name="android.service.wallpaper.WallpaperService" />
            </intent-filter>

            <meta-data
                android:name="android.service.wallpaper"
                android:resource="@xml/wallpaper" />
        </service>
    </application>

</manifest>

エミュレーターで動作させたスクリーンショットです。
動作保証は出来ませんがこのようになると思います。
ライブ壁紙なので、ショートカットアイコンやウィジットより後ろに重ねて表示されます。

2014年1月11日土曜日

[Android] SurfaceViewのアナログ時計アプリを作ってみました

The analog clock application on SurfaceView
前々回と前回のアナログ時計のアプリをSurfaceViewで表示するように作り直してみました。
OpenGLよりSurfaceViewのほうがずっと簡単です。

今回の開発環境は次の通りです。
・64bit版 Windows8
・32bit版 Eclipse3.7 (Windows XPモードで使用)
・Android-SDK r22.3

針の画像です。

以下ソースです。

アクティビティ(MainActivity.java)

package jp.fujiu.surfaceclock;

import java.lang.ref.WeakReference;
import java.util.Calendar;

import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.view.SurfaceView;

public class MainActivity extends Activity {

 private static class  MyHandler extends Handler {
  static final int WHAT = 1;
  private static final long INTERVAL = 50;
  private SurfaceView surface = null;
  
  private Bitmap secNeedleImg = null;
  private Bitmap minNeedleImg = null;
  private Bitmap hourNeedleImg = null;

  private boolean isFast;
  private int centerX = 0;
  private int centerY = 0;
  private int drawX = 0;
  private int drawY = 0;

  //時間
  int preSec = -1;
  
  public MyHandler(WeakReference<MainActivity> activity){
   this.isFast = true;
   this.surface = activity.get().surface;
   this.secNeedleImg = activity.get().secNeedleImg;
   this.minNeedleImg = activity.get().minNeedleImg;
   this.hourNeedleImg = activity.get().hourNeedleImg;
  }
  
  @Override
  public void handleMessage(Message msg) {
   removeMessages(WHAT);
   
   if (!isAlive) {
    //フラグオフなら終了
    return;
   }
   
   //現在時刻から各針の角度を算出
   Calendar now = Calendar.getInstance();
   int sec = now.get(Calendar.SECOND);
   if (sec != preSec){
    preSec = sec;
    float secDegree = (float) sec * 6;
    int min = now.get(Calendar.MINUTE);
    float minDegree = (float) min * 6 + secDegree/60;
    int hour = now.get(Calendar.HOUR);
    float hourDegree = (float) hour * 30 + minDegree/12;
    
    Canvas canvas = surface.getHolder().lockCanvas();
    if (canvas == null) {
     //SurfaceViewの準備が終わってなければ時間を空けてリトライ
     sendEmptyMessageDelayed(WHAT, 10);
     return;
    }
    
    //最初の1回だけの処理
    if (isFast) {
    //中心座標を計算
     centerX = surface.getWidth() / 2;
     centerY = surface.getHeight() / 2;
     drawX = centerX - secNeedleImg.getWidth() / 2;
     drawY = centerY - secNeedleImg.getHeight() / 2;
     isFast = false;
    }
    
    //背景を灰色で塗りつぶし
    canvas.drawColor(Color.GRAY);
    
    //秒針の表示
    canvas.save();
    canvas.rotate(secDegree, centerX, centerY);
    canvas.drawBitmap(secNeedleImg, drawX, drawY, null);
    canvas.restore();
    
    //分針の表示
    canvas.save();
    canvas.rotate(minDegree, centerX, centerY);
    canvas.drawBitmap(minNeedleImg, drawX, drawY, null);
    canvas.restore();
    
    //時針の表示
    canvas.save();
    canvas.rotate(hourDegree, centerX, centerY);
    canvas.drawBitmap(hourNeedleImg, drawX, drawY, null);
    canvas.restore();
    
    surface.getHolder().unlockCanvasAndPost(canvas);
   }
   
   sendEmptyMessageDelayed(WHAT, INTERVAL);
  }
 }

 private SurfaceView surface = null;
 private MyHandler myHandler = null;
 
 private Bitmap needleImg = null;
 private Bitmap secNeedleImg = null;
 private Bitmap minNeedleImg = null;
 private Bitmap hourNeedleImg = null;
 
 private static boolean isAlive;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
 }

 @Override
 protected void onResume() {
  super.onResume();
  
  //画像のロード
  needleImg = BitmapFactory.decodeResource(getResources(), R.drawable.clock_needles);
  
  int destWidth = this.needleImg.getWidth();
  int destHeight = this.needleImg.getHeight();
  
  //秒針の画像
  secNeedleImg = Bitmap.createBitmap(needleImg, 0, 0, destWidth / 4, destHeight);
  
  //分針の画像
  minNeedleImg = Bitmap.createBitmap(needleImg, destWidth / 4, 0, destWidth / 4, destHeight);
  
  //時針の画像
  hourNeedleImg = Bitmap.createBitmap(needleImg, (destWidth / 4) * 2, 0, destWidth / 4, destHeight);
  
  needleImg.recycle();
  
  surface = new SurfaceView(getApplicationContext());
  surface.setFocusable(true);
  surface.setKeepScreenOn(true);
  setContentView(surface);
  
  //ループ処理開始
  isAlive = true;
  myHandler = new MyHandler(new WeakReference<MainActivity>(this));
  myHandler.sendEmptyMessage(MyHandler.WHAT);
 }
 
 @Override
 protected void onPause() {
  super.onPause();
  
  //ループフラグ・オフ
  isAlive = false;
  
  //画像の解放
  secNeedleImg.recycle();
  minNeedleImg.recycle();
  hourNeedleImg.recycle();
 }
}

MyHandlerクラスでループ処理の頻度を制御しています。
設定次第でループ処理を減らせるのでOpenGLで作った場合にに比べるとバッテリーの持ちをよくする効果が期待できます。
MyHandlerクラスのINTERVALという定数の数値を大きくすればループ処理を減らせます。
ただし、INTERVALの数値を大きくしすぎると針が指す時刻と実際の時刻の誤差が大きくなります。

320×480ピクセルのエミュレーターで実行するとこんな感じになります。

OpenGLのアプリは画像の大きさを画面サイズに対して相対的に指定できましたが、SurfaceViewは絶対値で指定する必要があります。
1024×640の画面で実行すると下のようになります。

各針の画像の絶対的な大きさは変わらないのですが、画面が広くなった分小さく見えてしまいます。
解像度ごとに大きさを合せた針の画像を用意するか、Canvasクラスのscaleメソッドで画面サイズに合わせて拡大するといいかもしれません。

関連ブログ
[Android] アナログ時計のアプリを作ってみました
[Android] アナログ時計のアプリをC/C++で改良
[Android] ストップウォッチアプリを作ってみました
[Android] ストップウォッチアプリの表示をC言語でスムーズに改造する
[Android] 方位センサーを使ってコンパスアプリを作る
[Android] Javaのstaticクラスから非sataticメソッドを呼び出すには
[Android] OpenGLの簡易画像ビュアーにSDカード内の画像を表示する
[Windows8][Android] EclipseをXP互換モードで起動する理由(Can't bind to local 8600 for debugger)
[Android] Android-SDKでやってはいけないこと
[Android] Toastに画像やボタンを表示するには
[Android] ライブ壁紙の作り方
[Android] Activityに時計を表示する（Activityの非同期更新）
[Android] Webコンテンツを強制的に表示するには
[Android] Toastをcancelするには

以上、参考になれば幸いです。

2014年1月4日土曜日

[Android] アナログ時計のアプリをC/C++で改良

Analog clock on OpenGL by Android-NDK
前回のアナログ時計アプリのOpenGLの部分をC/C++言語で書けるだけ書いてみました。

C/C++を利用した場合、Javaだけで書いたアプリと比べると次のような特徴があります。
・マシン語で動作するコードの比率が増える
・C/C++出使用するオブジェクトはガーベジコレクター(GC)の対象にならない
このおかげでアプリの高速化やバッテリー消費を抑えるなどの効果が期待できます。

今回の開発環境は次の通りです。
・64bit版 Windows8
・32bit版 Eclipse3.7 (Windows XPモードで使用)
・Android-SDK r22.3
・Android-NDK r9

針の画像です。

以下ソースです。
※ Android.mk と jni.cpp と glu.h の3つのファイルはEclipseのプロジェクト・エクスプローラーでjniというフォルダーを作ってそこに保存します。

アクティビティ(MainActivity.java)

package jp.fujiu.analogclockjni;

import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;

import android.opengl.GLSurfaceView;
import android.opengl.GLSurfaceView.Renderer;
import android.os.Bundle;
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.view.SurfaceHolder;

public class MainActivity extends Activity {
 static {
  System.loadLibrary("jni");
 }
 
 private MainSurface surface = null;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  surface = new MainSurface(getApplicationContext());
  surface.setRenderer(surface);
  surface.setFocusable(true);
  surface.setKeepScreenOn(true);
  setContentView(surface);
 }

 // OpenGLのViewクラス
 private class MainSurface extends GLSurfaceView implements Renderer{
  native private void setJniPixels(int[] pixels, int width, int height);
  native private void onJniSurfaceCreated();
  native private void onJniSurfaceChanged(int width, int height);
  native private void onJniDrawFrame();
  native private void jniSurfaceDestroyed();
  
  public MainSurface(Context context) {
   super(context);
   
   //画像を読み込んでJNIに渡す
   Bitmap dstImage = BitmapFactory.decodeResource(getResources(), R.drawable.clock_needles);
   int widthDst  = dstImage.getWidth();
   int heightDst = dstImage.getHeight();
   
   int[] pixels = new int[widthDst *  heightDst];
   dstImage.getPixels(pixels, 0, widthDst, 0, 0, widthDst, heightDst);
   setJniPixels(pixels, widthDst, heightDst);
   pixels = null;
   dstImage.recycle();
  }
  
  @Override
  public void onSurfaceCreated(GL10 gl, EGLConfig config) {
   onJniSurfaceCreated();
  }
  
  @Override
  public void onSurfaceChanged(GL10 gl, int width, int height) {
   onJniSurfaceChanged(width, height);
  }

  @Override
  public void onDrawFrame(GL10 gl) {
   onJniDrawFrame();
  }
  
  @Override
  public void surfaceDestroyed(SurfaceHolder holder) {
   jniSurfaceDestroyed();
   super.surfaceDestroyed(holder);
  }
 }
}

Android.mk

LOCAL_PATH := $(call my-dir)
include $(CLEAR_VARS)
LOCAL_MODULE    := jni
LOCAL_SRC_FILES := jni.cpp
LOCAL_LDLIBS := -lGLESv1_CM -llog
APP_ABI := all
include $(BUILD_SHARED_LIBRARY)

jni.cpp

#include <jni.h>
#include <GLES/gl.h>
#include <GLES/glext.h>
#include <time.h>
#include "glu.h"

extern "C" {
 // 針ポリゴンの頂点座標
 float secNeedle[] = { -0.125f, -0.5f, 0.125f, -0.5f, -0.125f, 0.5f, 0.125f, 0.5f };
 float minNeedle[] = { -0.125f, -0.5f, 0.125f, -0.5f, -0.125f, 0.5f, 0.125f, 0.5f };
 float hourNeedle[] = { -0.125f, -0.5f, 0.125f, -0.5f, -0.125f, 0.5f, 0.125f, 0.5f };
 
 //秒針画像の頂点
 float secNeedleCoords[] = { 0, 1, 0.25f, 1, 0, 0, 0.25f, 0 };
 
 //分針画像の頂点
 float minNeedleCoords[] = { 0.25f, 1, 0.5f, 1, 0.25f, 0, 0.5f, 0 };
 
 //時針画像の頂点
 float hourNeedleCoords[] = { 0.5f, 1, 0.75f, 1, 0.5f, 0, 0.75f, 0 };
 
 //テクスチャの各定義
 GLuint textures[1];
 GLuint textureId = 0;
 unsigned char* pixels;
 
 //テクスチャのサイズ
 int texWidth;
 int texHeight;
 
 // カメラの位置
 float cameraX = 0;
 float cameraY = 0;
 
 //現在時刻
 time_t now;
 struct tm *tmNow;
 int sec;
 int min;
 int hour;
 int preSec = -1;
 
 //針の角度
 float secDegree;
 float minDegree;
 float hourDegree;
 
 JNIEXPORT void JNICALL Java_jp_fujiu_analogclockjni_MainActivity_00024MainSurface_setJniPixels(JNIEnv *env, jobject, jintArray jintPixels, jint width, jint height) {
  texWidth = width;
  texHeight = height;
 
  // jintArrayをjint配列に変換
  jint* arr = env->GetIntArrayElements(jintPixels, NULL);
 
  // int型(4バイト)ARGBのピクセル情報を1バイトごとにRGBAに並べ替えてunsigned char型配列に格納
  int size = width * height;
  pixels = new unsigned char[size * 4];
  for (int i = 0; i < size; i++) {
   int j = i * 4;
   pixels[j + 2] = arr[i]; //Blue
   arr[i] >>= 8;
   pixels[j + 1] = arr[i]; //Green
   arr[i] >>= 8;
   pixels[j + 0] = arr[i]; //Red
   arr[i] >>= 8;
   pixels[j + 3] = arr[i]; //Alpha
  }
 }
 
 JNIEXPORT void JNICALL Java_jp_fujiu_analogclockjni_MainActivity_00024MainSurface_onJniSurfaceCreated(JNIEnv *, jobject) {
  // テクスチャ管理番号割り当て
  glDeleteTextures(1, textures);
  glGenTextures(1, textures);
  textureId = textures[0];
 
  // テクスチャ管理番号バインド
  glBindTexture(GL_TEXTURE_2D, textureId);
  glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, texWidth, texHeight, 0, GL_RGBA, GL_UNSIGNED_BYTE, pixels);
  glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
  glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
 }
 
 JNIEXPORT void JNICALL Java_jp_fujiu_analogclockjni_MainActivity_00024MainSurface_onJniSurfaceChanged(JNIEnv *, jobject, jint width, jint height) {
  glViewport(0, 0, width, height);
  glMatrixMode(GL_PROJECTION);
  glLoadIdentity();
 
  int size = width>height ? height : width;
  glViewport((width - size) / 2, (height - size) / 2, size, size);
 
  // 背面塗り潰し色の指定・黒
  glClearColor(0.0f, 0.0f, 0.0f, 1.0f);
 }
 
 JNIEXPORT void JNICALL Java_jp_fujiu_analogclockjni_MainActivity_00024MainSurface_onJniDrawFrame(JNIEnv *, jobject) {
  //現在時刻から各針の角度を算出
  now = time(NULL);
  tmNow = localtime(&now);
  sec = tmNow->tm_sec;
  if (sec != preSec){
   preSec = sec;
   secDegree = (float) sec * 6;
   min = tmNow->tm_min;
   minDegree = (float) min * 6 + secDegree / 60;
   hour = tmNow->tm_hour;
   hourDegree = (float) hour * 30 + minDegree / 12;
  }
 
  // 画面クリア
  glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
 
  glPushMatrix();
 
  // カメラ
  gluLookAt(cameraX, cameraY, 3, cameraX, cameraY, 0, 0, 1, 0);
 
  // テクスチャーの有効化
  glEnable(GL_TEXTURE_2D);
  glEnableClientState(GL_TEXTURE_COORD_ARRAY);
  glBindTexture(GL_TEXTURE_2D, textureId);
 
  //アルファブレンドの有効化
  glEnable(GL_BLEND);
  glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
 
  glMatrixMode(GL_PROJECTION);
 
  //秒針の表示
  glPushMatrix();
  glLoadIdentity();
 
  // 頂点配列の指定
  glEnableClientState(GL_VERTEX_ARRAY);
  glVertexPointer(2, GL_FLOAT, 0, secNeedle);
 
  glRotatef(secDegree, 0, 0, -1);
 
  glTexCoordPointer(2, GL_FLOAT, 0, secNeedleCoords);
 
  // テクスチャ描画
  glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);
 
  glDisableClientState(GL_VERTEX_ARRAY);
 
  glPopMatrix();
 
  //分針の表示
  glPushMatrix();
  glLoadIdentity();
 
  // 頂点配列の指定
  glEnableClientState(GL_VERTEX_ARRAY);
  glVertexPointer(2, GL_FLOAT, 0, minNeedle);
  glRotatef(minDegree, 0, 0, -1);
 
  glTexCoordPointer(2, GL_FLOAT, 0, minNeedleCoords);
 
  // テクスチャ描画
  glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);
 
  glDisableClientState(GL_VERTEX_ARRAY);
 
  glPopMatrix();
 
  //時針の表示
  glPushMatrix();
  glLoadIdentity();
 
  // 頂点配列の指定
  glEnableClientState(GL_VERTEX_ARRAY);
  glVertexPointer(2, GL_FLOAT, 0, hourNeedle);
  glRotatef(hourDegree, 0, 0, -1);
 
  glTexCoordPointer(2, GL_FLOAT, 0, hourNeedleCoords);
 
  // テクスチャ描画
  glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);
 
  glDisableClientState(GL_VERTEX_ARRAY);
 
  glPopMatrix();
 
  //アルファブレンドの無効化
  glDisable(GL_BLEND);
 
  // テクスチャーの無効化
  glDisableClientState(GL_TEXTURE_COORD_ARRAY);
  glDisable(GL_TEXTURE_2D);
 
  glPopMatrix();
 }
 
 JNIEXPORT void JNICALL Java_jp_fujiu_analogclockjni_MainActivity_00024MainSurface_jniSurfaceDestroyed(JNIEnv *, jobject) {
  delete[] pixels;
 }
}

glu.h （Android-NDKのsampleの com.example.SanAngeles から抜粋しました）

#include <math.h>
#define PI 3.1415926535897932f

/* Following gluLookAt implementation is adapted from the
 * Mesa 3D Graphics library. http://www.mesa3d.org
 */
static void gluLookAt(GLfloat eyex, GLfloat eyey, GLfloat eyez, GLfloat centerx, GLfloat centery, GLfloat centerz, GLfloat upx, GLfloat upy, GLfloat upz) {
 GLfloat m[16];
 GLfloat x[3], y[3], z[3];
 GLfloat mag;

 z[0] = eyex - centerx;
 z[1] = eyey - centery;
 z[2] = eyez - centerz;
 mag = (float) sqrt(z[0] * z[0] + z[1] * z[1] + z[2] * z[2]);
 if (mag) {
  z[0] /= mag;
  z[1] /= mag;
  z[2] /= mag;
 }

 y[0] = upx;
 y[1] = upy;
 y[2] = upz;

 x[0] = y[1] * z[2] - y[2] * z[1];
 x[1] = -y[0] * z[2] + y[2] * z[0];
 x[2] = y[0] * z[1] - y[1] * z[0];

 y[0] = z[1] * x[2] - z[2] * x[1];
 y[1] = -z[0] * x[2] + z[2] * x[0];
 y[2] = z[0] * x[1] - z[1] * x[0];

 mag = (float) sqrt(x[0] * x[0] + x[1] * x[1] + x[2] * x[2]);
 if (mag) {
  x[0] /= mag;
  x[1] /= mag;
  x[2] /= mag;
 }

 mag = (float) sqrt(y[0] * y[0] + y[1] * y[1] + y[2] * y[2]);
 if (mag) {
  y[0] /= mag;
  y[1] /= mag;
  y[2] /= mag;
 }

#define M(row,col)  m[col*4+row]
 M(0, 0) = x[0];
 M(0, 1) = x[1];
 M(0, 2) = x[2];
 M(0, 3) = 0.0;
 M(1, 0) = y[0];
 M(1, 1) = y[1];
 M(1, 2) = y[2];
 M(1, 3) = 0.0;
 M(2, 0) = z[0];
 M(2, 1) = z[1];
 M(2, 2) = z[2];
 M(2, 3) = 0.0;
 M(3, 0) = 0.0;
 M(3, 1) = 0.0;
 M(3, 2) = 0.0;
 M(3, 3) = 1.0;
#undef M
 {
  int a;
  GLfixed fixedM[16];
  for (a = 0; a < 16; ++a)
   fixedM[a] = (GLfixed) (m[a] * 65536);
  glMultMatrixx(fixedM);
 }

 glTranslatex((GLfixed) (-eyex * 65536), (GLfixed) (-eyey * 65536), (GLfixed) (-eyez * 65536));
}

※特別な権限(Permission)は不要なのでマニフェストは省略します。
Target SDK Version が4以上の設定でビルドできます。
Android1.6以降で動作します。
Android-NDKのビルド方法は環境に強く依存するので省略させて頂きます。
SH-03C(実機)、Android-SDK付属のエミュレーター、Blue Stacksで動作することを確認していますが動作保証は出来ません。

エミュレーターのスクリーンショットです。

前回のJavaだけで書いたアプリと同じように動作するように作ったので見た目の変化はありません。
1秒に1回しか画面が変化しないので、ログまでチェックしないとGCが減ったかどうかは分かりにくいですね。

関連ブログ
[Android] アナログ時計のアプリを作ってみました
[Android] ストップウォッチアプリの表示をC言語でスムーズに改造する
[Android] ストップウォッチアプリを作ってみました
[Android] 方位センサーを使ってコンパスアプリを作る
[Android] OpenGLでプロ生ちゃんをアニメーションさせる
[Windows8][Android] Can't bind to local 8600 for debugger
[Android] 端末の傾きに立方体を連動させる
[Android] フリーサイズの画像をOpenGLのテクスチャに表示する
[Android] Android-NDKでテクスチャを表示するには
[Android] OpenGLで頂点の多いポリゴンを扱うには

以上、参考になれば幸いです。

2014年1月1日水曜日

[Application] Eye元気！2がｄマーケットアプリ＆レビューに掲載されました

Eye元気！2がｄマーケットアプリ＆レビューに掲載されました。
http://app.dcm-gate.com/app_review/0012777/?utm_source=twi

掲載して頂きありがとうございます。

Eye元気！2はAndroidスマートフォン・タブレットがドコモでなくてもご利用頂けます。
Androidスマートフォン・タブレットで下のPlayストアをタップするとダウンロードのページに移動します。

https://play.google.com/store/apps/details?id=jp.fujiu.eye_genki2

Playストア
※ダウンロード前にエンドユーザーライセンス契約(EULA) とプライバシーポリシーを必ずお読みください。

Eye元気！2をはじめMtkのアプリとブログを今年もよろしくお願いします！

登録: 投稿 (Atom)

新アプリケーション