Go to Qiita Advent Calendar 2024 Top
LoginSignup
70
56

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

@griffin921

MATLABで簡単にGUIを作ろう！

Last updated at Posted at 2020-03-14

#どんな記事なの？
日記みたいなもんです！
MATLABのAppDesignerという機能を使って簡単にGUIが作れてうれしいですね！
っていうのを共有する記事です。

仕事でちょっとだけ勉強したので作っていくプロセスの紹介と、
使ってて面白いな～と思ったことをまとめたいと思います。

追記:もう少しapp designerの詳しい説明をしている記事のリンクも貼っておきます〜

#なに作ったの？
簡単なボイスレコーダーです。

39BBEBB4-88BB-4F5C-BB4E-21E537D361F3.GIF

RECを押すと5秒間マイクで録音します。
Playを押すと5秒間の録音データを再生します。

REC,Playを押した後の5秒間はボタン入力を受け付けません。
録音時間は0~60sの間で変更可能です。

#作り方の手順
ざっくりと手順を説明します。
あくまでGUIアプリ作成プロセスなんでマイク録音の仕方等の説明は省きますが、コードをご覧いただけると大体わかると思います。

##Step１　ウィンドウ作ってみよう！
JavaのSwingに似てます。EclipseでWindow作るみたいに勝手にGUIコードを生成してくれます。

  1. MATLABを起動したら　アプリタブからアプリの設計をクリック。
    image.png

  2. 新規作成で"空のアプリ"を選択。

  3. なんかもうウィンドウできてるぞ。
    image.png

  4. 左のカラムからお好きなGUIをドラックアンドドロップで張り付けて・・・
    image.png

  5. ・・・をやっているうちに出来上がったのがこちらになります。
    image.png

  6. 各パーツが持っている要素や値は、右側にでているコンポーネントブラウザから閲覧・設定できます。RECボタンとPlayボタンはここから録音・再生のPng画像を読み込むよう指定しています。
    image.png

7.ここまでいじって画面中央右上部にある　コードビューをクリックして　[設計ビュー]から[コードビュー]に切り替えましょう。
GUIに関するコードが自動生成されております。

Step2. コールバック関数やプロパティを書こう！

コールバック関数はここではなんかしらのイベント（ボタンを押すとか）をきっかけに呼ばれる関数だと思ってください。
正確にはほかのコードや関数に”引数として”与えられる関数です。
ボタンを押すって関数がコールされたら、動作してほしい関数をPushButton関数に引数として渡して、
直後にボタンを押したことによる振る舞いを実行し始める・・・　といった使い方がされます。

プロパティは自動生成されるアプリが持つ変数要素のことみたいです。

では作っていきましょう！

  1. 画面を[コードビュー]に切り替えたら、左側のコードブラウザから　コールバック->＋ボタンでコールバック関数追加
    image.png

  2. [コンポーネント]でコールバック関数を作りたいコンポーネント名を選択します。例えばボタンにコールバック関数を結び付けたいときはボタンのコンポーネント名に設定します。 [コールバック]はそのコンポーネントで使えるコールバック関数をプルダウンで選べます。どんな時に呼ばれる関数かは英語で名前がかいてあります。私のように英語が苦手な人はなんとなく読んで内容悟ってください（笑）。この場合ボタンが押された時に呼ばれるコールバック関数みたいです。
    image.png

  3. あとはコールバック関数に内容を書き込みます。例えば録音をするRECなら録音用の処理を記述します。App Designerでは自動生成したGUIやクラス定義部分は編集できないようグレーアウトしているので初心者にも安心です。
    image.png

Step3. 動かしてみよう！

  1. 実行ボタン押したらもう動くんです。[コードビュー]ではBreakPointも設定できるのでデバックもできますよ。
    image.png

  2. .mファイルにエキスポートすれば実行可能・配布可能な状態になります。
    image.png

これだけでもとりあえず動くものはできちゃいます！

簡単ですよね。

私が一番最初にGUIアプリ作ったときはWindowAPIを直接たたいてました。今そういうことしてる人いないですよね・・・.Netつかいますよね・・・
そこから比べるととっても楽になりました。

私もまだまだ勉強中でもっといろんなことができそうなのですが、また試してみます。

さぁ、これで皆さんもノリでGUIでアプリを開発しちゃいましょう！

#想定質問

###QtやC#とかあるじゃん
そうですね！
でもGUI以外にもいろんなライブラリ必要ですよね。
このアプリだとマイク入力とか。
MATLABだとそういうライブラリも豊富にあるので手軽に機能含めて作れてしまうのがいいとこかなと思います。

###MATLABもってないんだけど・・・
アプリはMATLABランタイムがあれば動きます。
動かすだけなら本体は必要ないんです！

###ランタイムをインストールどうやってすんのとか調べるのだるいよね
だるいですね!そんな時はパッケージ化しましょう。
MATLAB以外にもMATLAB CompilerというToolBoxが必要になってしまいますが、実行ファイルにパッケージングすることができます。
パッケージングかすると実行したときスプラッシュスクリーンを出すこともできますよ。なんかかっこいいですよね。
image.png

###Qtはマルチプラットフォームで動くけど？MATLABだとどうなってんの？

ですよね！でもMATLABだって、ほら！
Macでも動きましたよ！やったー！
もちろんMac向けに実行ファイルにパッケージングすることもできます。やはりMATLAB Compilerが必要ですが・・・
スクリーンショット 2020-03-15 1.38.06.png

70
56
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
70
56

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?