ディーバ Blog

大阪発 C#の会社、株式会社ディーバの Blog です。

画像から音楽を自動生成するスマホアプリ「mupic(ミューピック)」を令和元年5月1日に正式リリース!

青柳 @ShinichiAoyagi です。
なんだかいろいろとバタバタしていてブログもずいぶん間が空いてしまいました。

本日、令和元年5月1日に「mupic(ミューピック)」という画像から音楽を自動生成するスマホアプリを正式リリースしました。
(ちょっと前からAppStoreで公開状態でしたがもろもろの都合で本日が正式リリースという設定となりました)

Webサイト: mupic.jp
App Store: mupic

f:id:ShinichiAoyagi:20190501230652p:plain:w200

正式リリースに先立って平成最後の平日である平成31年4月26日にプレスリリースも発表しています。
ディーバ、DOZAN11(元・三木道三)プロデュースの画像から音楽を自動生成するスマホアプリ「mupic(ミューピック)」を令和元年5月1日に正式リリース!

プレスリリースにもあるとおり、このmupicというアプリは DOZAN11 さんプロデュースです。DOZAN11さんは平成13年(2001年)に「Lifetime Respect」という曲でミリオンセラーを達成した「三木道三」その人です。平成を生きた人(笑)なら「一生一緒にいてくれや」のフレーズに聞き覚えがある人も多いんじゃないでしょうか。
平成と言えば、Yahoo!の【連載・「わたし」と平成】という企画でDOZAN11さんのインタビュー記事もあります。
大ヒットからの引退と復帰、今はアプリ開発も DOZAN11(元・三木道三)の軌跡
(この記事の最後にもちょっとmupicの話題が出てきます)

もうひとりmupicに重要なキーパーソンとして株式会社ビジョナリストの三木さんがいます。三木さんは色彩の専門家で以前から色彩に関する研究や著作などがあります。その一環として写真やイラストの色彩を分析して楽器や音程を割り当てるといったことも研究されていました。
しかし、単純に音にしてもほぼノイズにしかなりません。人が聞いて音楽だと感じるにはそれなりのルールが必要なんですね。Yahoo!の記事にもあるようにDOZAN11さんは音楽理論などを研究していて、その一環として三木さんと写真やイラストの色彩をいかに音楽にするかといったことも研究されていたんですね。

そんなDOZAN11さん三木さんと私・青柳が知り合ったのをきっきけにmupicの開発はスタートすることになりました。
もちろん、DOZAN11さんが音楽面を、三木さんが色彩面を、そして、 ディーバ が開発を担当する形です。開発は青柳個人ではなくディーバのプロジェクトとしておこなっています。
(そもそもなんでミュージシャンと知り合ったの?とか書きたいことはいろいろあるんですが長くなるのでそれらはまた別に記事にしたいと思っています)

このmupicですが、ディーバが開発を担当したっていうことは当然のようにXamarinです。プロトタイプはXamarin.Formsを使っていましたが今はXamarinネイティブです。ただ、画面はすべて MonoGame なのでXamarinネイティブと言えるかどうかちょっと微妙ですが。ぶっちゃけ、Unityでもよかったんですが今回はXamarin + MonoGameを使ってみました。
(こういった技術的な話もいずれ記事にまとめたいと思います)

今はまだiOS版のみですが、もちろん近日中にAndroid版もリリース予定です。優先順位的にiOSが先となりましたがAndroid版もiOSと並行して実装は進めています。というか、Xamarin + MonoGameなので実装のかなりの部分はiOSとAndroidで共通です。
これだけでなくいろいろと変更や追加はしていきたいと考えています。開発時間的な制約からまだまだ熟れていない面もありますし、不十分な面も多くあると思っています。そしてなにより、DOZAN11さんは「よりよい音楽にするにはどうすればいいか」を、三木さんは「写真の色彩、ひいては、雰囲気や空気感をより読み取るにはどうすればいいか」をいつも考えていますのでそれらを反映していきたいというのもあります。
ディーバのプロダクトのひとつとして今後も継続して開発していきますのでよろしくお願いします。

「Xamarinネイティブによるモバイルアプリ開発 C#によるAndroid/iOS UI 制御の基礎」アップデート情報・正誤表・エラッタ

最終更新日: 2017/12/12

株式会社ディーバ 代表取締役 青柳臣一が執筆した、2017年9月15日発売 Xamarinネイティブによるモバイルアプリ開発 CによるAndroid/iOS UI制御の基礎 (翔泳社)のアップデート情報・正誤表を勝手に記します(適宜この記事を更新します)。

購入者が実際に試した「 テスターが #Xamarin でキッチンタイマーを作ってみた! - Togetter」も参考になります(一部参考にしてここでも記載します)

Chapter 3: Visual Studio で iOS キッチンタイマーを作ろう

リスト 3.24 (p.156) ShowRemainingTime メソッド

private void ShowRemainingTime()
{
    RemainingTimeLabel.Text = string.Format("{0:f0}:{1:d2}",
        _remainingTime.TotalMinutes,
        _remainingTime.Seconds);
}

正(修正例)

private void ShowRemainingTime()
{
    RemainingTimeLabel.Text = string.Format("{0:f0}:{1:d2}",
        Math.Floor(_remainingTime.TotalMinutes),
       _remainingTime.Seconds);
}

Chapter 4: Xamarin でアプリを実装する

ポータブル クラス ライブラリ (PCL) p.182

ポータブル クラス ライブラリ クラス ライブラリ(レガシ ポータブル)

Visual Studio 2017 Ver. 15.3 頃から ポータブル クラス ライブラリ は、レガシ ポータブルと表記されています。

Chapter 5: MVVMCross について学ぼう

MVVMCross MvvmCross

MVVMCross、MVVM Cross でもなく MvvmCross が公式表記です。ただし、最新のロゴは MVVMCROSS と大文字表記です。

Chapter 8: MVVMCross を使いこなそう

ビューモデルのライフサイクル (p.330, 331)

Start メソッドは MvvmCross 3.x/4.x 系のライフライクル で使われるメソッドのため非推奨です。

MvvmCross 5.6 の ライフライクル は次のように変更されています。

メソッド名
コンストラクタ―
void Prepare(TParameterModel parameter)
async Task Initialize()
void ViewCreated()
void ViewAppearing()
void ViewAppeared()
void ViewDisappearing()
void ViewDisappeared()
void ViewDestroy(bool viewFinishing)

Tips: 注意: Initialize メソッドが呼ばれないケース (p.333)

「今後の MVVMCross では修正されるかもしれませんが」とありますが、Navigation Service を使う場合 Core プロジェクトの App class (App.cs) の下記メソッドを変更します。

RegisterAppStart<ViewModels.MainViewModel>();

RegisterNavigationServiceAppStart<ViewModels.MainViewModel>();

CodeZineにインタビュー記事が掲載されました

青柳です。

書籍「Xamarinネイティブによるモバイルアプリ開発 CによるAndroid/iOS UI制御の基礎」に関連してCodeZineにインタビュー記事が掲載されました。

codezine.jp

メールやチャットではなくインタビュワーさんと面と向かって話をしました。時間にしたら30分ちょっとくらいでしょうか?1時間近く話してたかもしれません。話し言葉なのであっちいったりこっちいったりしたと思うのですがすっきりとまとめてくださってます。
(それにしても、自分の写真を見るなんてめっちゃ久しぶりだけどものすごく太いな)

「Xamarinネイティブによるモバイルアプリ開発 C#によるAndroid/iOS UI 制御の基礎」が出版されました

青柳です。

先週、9月15日に私が執筆した Xamarinネイティブによるモバイルアプリ開発 CによるAndroid/iOS UI制御の基礎 が出版されました。

CodeZineに紹介記事があります。
C#でアプリ開発できるXamarinを体験!『Xamarinネイティブによるモバイルアプリ開発』
キャンペーンページ もあります。

ちなみに、こういうのは私も全然知らなくて、Twitterとかでつぶやかれているのを見てこういうページがあることを知りました。アマゾンの表紙写真にもあるようにちょまどさんのコメントが帯に載る(しかも写真入り)というのもちょまどさんのツイートで知ったくらいだったりします。事前に編集さんから「マイクロソフトの方にコメントをもらえないかと思っている」ということは聞いてはいましたがそれがこういう風になるとは。ちょまどさんは私はきちんとはお会いしたことはない(去年のde:codeのときに遠くからお見かけしたことはある)のですがマイクロソフトのエバンジェリストの方で、Xamarin界隈でもとても有名ですね。そんな方に「良本」なんて言っていただけて嬉しい限りです。

キャンペーンページやちょまどさん効果といったことも多分にあると思いますが、8月下旬からアマゾンの「モバイルプログラミング」のジャンルで1~5位くらいのあたりをうろうろしています。毎日見ていたわけではありませんがだいたいそれくらいみたいです。「プログラミング」のジャンルでは20位ちょっとくらいでした。このジャンルだと上位はディープラーニングとかPythonとかExcel VBAなどのいかにも売れ筋の本たちですのでかなり健闘していると言っていいんじゃないかと思います。うれしいなぁ

ちょっと思い出話を

もともと今回の執筆の話をいただいたのは去年の7月くらいです。もう1年以上経つんですね。shoeisha.co.jpドメインの知らない方からメールで「Xamarin書籍の企画があるんだけど興味ありませんか?」と来たのが最初だったと思います。もしかしたらTwitterやFacebook Messengerだったかもしれませんが。まぁ、そんな感じで始まりました。
本業があるので執筆は夜や休日が中心になります。なので、執筆を生業としている人に比べるとどうしても時間はかかると思います。そんな話をしてそれでOKということでやらせていただきました。
ちなみに本業は 株式会社ディーバ の代表取締役です。経営業だけでなくプログラマーとしてガシガシコードも書いてます。むしろそちらの方が比重としては高いくらいです。ほんとは経営業に専念した方がいいというのはわかってるんですがなにぶん人手不足でして。(ちなみに求人中です。興味のある方いたら連絡ください。XamarinだけでなくUWP、WPF、ASP.NET MVCといろいろやってます。どれもC#です)
話がそれましたがこういう立場なのでサラリーマンの方と違い調整さえつけば時間は自由になります。業務時間中に執筆することもできます。けど、日中はなんだかんだと予定が入ってやっぱり執筆は自宅に帰ってからの夜や休日が中心でした。そうするとどうしても途切れがちになるし、忙しいときには睡眠時間を削るしかなくなって、思った以上に大変でした。

本当ならもうちょっと執筆に時間を取りたかったです。技術的に間違ったことを書くことがないように、その面についてしっかり時間を取ってやったつもりです。けど、わかりやすい文章になるように吟味するとか、図表を追加するとか、そういった面に関してはちょっと時間不足だったと感じています。個人のブログとかWeb上の解説記事とかと違い、これだけのボリュームがあると書いてる途中で「この間書いたあそこはこう変えよう。あっちも直した方がいいな」といろいろ出てきて、けどそれを全部やっていたら時間足りないし、とどんどんとっちらかっていって収拾がつかなくなってしまうんです。プロの執筆家の人ってどうしてるんだろう?
分量も難しかったです。最初の時点で「350ページくらい」というのは決まっていました。以前に WindowsPhoneビジネスアプリケーション開発ガイド という書籍を秀和システムさんから出したんですが、これも340ページと同じくらいの分量でした(ちなみに、この本も編集さんの方から「こういう企画があるんですが興味ありませんか?」とメールが来たのが最初でした)。けど、2回目だからと言って感がつかめているわけでもなく書きたいように書いていったら思ったより多くなってしまいました。実は半分くらいの時点では「このままだとページ数足りないかもしれませんね」と言われてたんです。けど、その後書き続けていったら450ページくらいになってしまいました。それでも書きたいことをすべて書ききったというわけではなかったんですが。結局、なくても支障はないというところを削って本文380ページくらい、削った部分だけどせっかくなら読んでもらえるといいよね、というところを購入者特典としてPDFで提供するという形にすることになりました。

がんばって書いたので興味のある方は手にとっていただけると幸いです。

Xamarin ネイティブによるモバイルアプリ開発 C# による Android/iOS UI 制御の基礎

株式会社ディーバ 代表取締役 青柳臣一が、Xamarinネイティブによるモバイルアプリ開発 CによるAndroid/iOS UI制御の基礎 (翔泳社)を執筆しました。

2017年9月15日発売です。

AndroidもiOSも。 C#を使ったクロスプラットフォーム開発に挑戦!

これまで別々の言語や環境で開発していたAndroid/iOSアプリを 共通の言語(C#)や環境(.NET Framework)で作成する 注目の開発環境Xamarin。

マイクロソフトMVP受賞経験のある著者が、豊富なアプリケーション開発の 経験を活かし、すべてのモバイルアプリ開発者に向けてXamarinネイティブ によるクロスプラットフォーム開発を徹底解説しました。

本書は「Xamarinとは何か」にはじまり、汎用ライブラリMVVMCrossを 使って、本格的なクロスプラットフォームを開発するノウハウまで、 ミニサンプルアプリを作りながらわかりやすく学ぶことができます。

また、特にAndroid/iOS開発経験のある読者のために、 JavaやObjective-C、Swiftと比較しながらの解説も行っています。

現場の開発者のための、Xamarinを使ったクロスプラットフォーム開発を スムーズに学べる一冊です。

Xamarin.Android SfDataGrid でセルの背景色を変える

Syncfusion SfDataGrid でセルの背景色を変える方法です。

※ この記事の投稿時点の SfDataGrid のバージョンは v15.2.0.46 です。

f:id:jz5_diva:20170722011745j:plain

セルの背景色の変更は GridCell クラスを継承したクラスを GridColumn クラス UserCellType プロパティに指定します。背景色以外も自由にカスタマイズできます。

ちなみに、行全体の背景色を変えるには DataGridStyle クラスが使えます(Styles 参照)。

次のようにユーザー定義のセルを作ります。

public class ColoredCell : GridCell
{
    private readonly TextView _textView;
    private readonly View _view;

    public ColoredCell(Context context) : base(context)
    {
        _view = new View(context);
        _textView = new TextView(context)
        {
            Gravity = GravityFlags.Center
        };
        _textView.SetTextColor(Color.Black);

        AddView(_view);
        AddView(_textView);
        CanRenderUnLoad = false;
    }

    protected override void UnLoad()
    {
        (Parent as VirtualizingCellsControl)?.RemoveView(this);
    }

    protected override void OnLayout(bool change, int l, int t, int r, int b)
    {
        _view.Layout(1, 1, Width - 1, Height - 1);
        _textView.Layout(1, (int)(10 * Resources.DisplayMetrics.Density), Width, Height);
    }

    protected override void OnDraw(Canvas canvas)
    {
        base.OnDraw(canvas);

        var valueText = DataColumn.CellValue.ToString();
        _textView.Text = valueText;

        // セルの値が true のとき背景色を変える
        if (bool.TryParse(valueText, out var result) && result)
        {
            _view.SetBackgroundColor(Color.Orange);
        }
    }
}

GridColumn.UserCellType に設定します。

var col = new GridTextColumn {
    // ...
};
col.UserCellType = typeof(ColoredCell);
_dataGrid.Columns.Add(col);

Xamarin.Android SfDataGrid で編集時にキーボードの種類を変える

Syncfusion SfDataGrid で編集する際にキーボードの種類(InputType)を変更する方法です。

※ この記事の投稿時点の SfDataGrid のバージョンは v15.2.0.46 です。

f:id:jz5_diva:20170722010425j:plain

Editing 機能で Excel のセルのように編集できます。キーボードの種類を指定するには、カスタム GridCellTextViewRenderer クラスを使います。

セルに入力できる値を制限をする場合、Column Types の GridNumericColumn 等も使えます。

public class GridCellTextViewRendererExt : GridCellTextViewRenderer
{
    protected override void OnEnteredEditMode(DataColumnBase dataColumn, View currentRendererElement)
    {
        base.OnEnteredEditMode(dataColumn, currentRendererElement);

        // MappingName により分岐させる場合は次のように参照
        if (dataColumn.GridColumn.MappingName != "ProductNo") return;
        
        // 行のデータにより分岐させる場合は次のように RowData を参照
        // var item = dataColumn.RowData as MyViewModel;

        var editText = currentRendererElement as EditText;
        if (editText == null) return;

        // InputTypes を変更
        editText.InputType = InputTypes.ClassNumber;
    }
}

作成したカスタムレンダラーに差し替えます。

_dataGrid = new SfDataGrid(this);

// Add custom renderer    
_dataGrid.CellRenderers.Remove("TextView");
_dataGrid.CellRenderers.Add("TextView", new GridCellTextViewRendererExt());