AI2(7) Xylophone2
木琴 (Chapter 9. Xylophone) 何を構築するか 図 9-1 に示すアプリ (元々は App Inventor チームの Liz Looney によって作成されました) を使用すると、次のことが可能になります。 画面上の色付きのボタンをタッチして、8 つの異なる音を演奏します。 再生ボタンを押すと、以前に演奏したノートが再生されます。 リセット ボタンを押すと、以前に演奏した音符がアプリに忘れられ、新しい曲を入力できるようになります。 図9-1。木琴アプリのUI 学べること このチュートリアルでは、次の概念について説明します。 単一のサウンドコンポーネントを使用して、さまざまなオーディオ ファイルを再生します。 Clockコンポーネントを使用して、アクション間の遅延を測定および強制します。 プロシージャをいつ作成するかを決定します。 それ自体を呼び出すプロシージャを作成します。 項目の追加、項目へのアクセス、リストのクリアなど、リストの高度な使用法。 表9-1。木琴アプリのすべてのコンポーネント デザイナー画面 ブロックエディタ リソース 1.wav 2.wav 3.wav 4.wav 5.wav 6.wav 7.wav 8.wav
AI2(c) 最終課題
最終課題要件 1-4人のクループで、自分のデザインのアプリを作成する。 この課題の得点は、Mobile Computing コース成績の50%に相当する。 どんな種類のアプリでも自由にデザインすることができる。 アプリの洗練さや複雑さの面においでは、些細なではない(non-trivial )アプリである。 例えば、アプリケーションの重要な拡張が大丈夫ではあるが、コースでやったアプリのうちの1つのマイナーな調整ではない。 最小技術要件 アプリは特定の最小技術要件を満たしている必要があります。 データ抽象化 。 アプリには少なくとも2つの変数が必要、 どちらかのリストまたはデータベースを使用する必要 。 手続き抽象化 。 アプリには少なくとも2つのプログラマー定義のプロシージャまたは関数を含める必要。 アルゴリズムと制御。 少なくとも1つのif / else構造体または1つのループを含める必要 。 評価基準 課題を評価するために、次の基準が使用されます。 各基準は、0点(評価不能)から5点(良好)までの合計5点で合計20点の価値があります。 目的 :アプリの目的が明確に記述されており、アプリ自体が目的を明確に果たしています。 技術的要件 :アプリケーションは上記の最低限の技術要件を満たしています。 機能的性能 。 アプリはダウンロードされ、テストされ、大きなパフォーマンス上の問題やバグがなければ期待どおりに機能しました。 スコープ :このアプリは重要なクリエイティブな成果を表しており、コースで行ったアプリのうちの1つの小さな変化や拡張ではありません。 最低限のプレゼンテーション要件 このコースでは、アプリケーションがレビューされるためには、wordpress.comで公開されているプレゼンテーションへのリンクを提供する必要があり、 以下の最小要件を満たしている必要がある。 タイトル。 アプリのタイトル。 エレベーターピッチ。 一言でアプリの基本的な目的を説明する。 説明。 アプリケーションの1つのパラグラフの説明。目的と範囲を説明し、基本機能を要約しています。 アプリスクリーンショット。 アプリのメイン画面またはビューのスクリーンショット。 ブロックスクリーンショット。 アプリケーションがプロジェクトの技術的プログラミング要件を満たしていることを示すブロックのスクリーンショット。 QRコードとダウンロードリンク。 機能しているQRコードと、アプリのAPKファイルへの機能するHTMLリンク、およびレビュー担当者がアプリをテストする方法の簡単な説明。 サンプルプレゼンテーション https://github.com/edu2web/PhotoBlog/blob/master/README-Jp.md アプリのAPKファイルの公開 […]
AI2(b) Final Project
Final Project Requirements For this assignment you will create an app of your own design. You will have two weeks to complete it. Your score on this project, is worth 50% of your course grade. You are free to design whatever type of app you want. In terms of the sophistication or complexity of the app, it must be […]
AI2(x) Amazon API
第11章 Amazon API (Chapter 13. Amazon Bookstore) Amazon API は、普通に利用できなくなったので、この実例は作動できない まず、App Inventor専用のAmazon APIを見てください。 http://aiamazonapi2.appspot.com/ 試しに、1449397484入力すると、ISBN番号1449397484の本の書名、単価が返ってくる。 デザイン BarcodeScanner 図書のISBN番号の入力の代わりに、ISBNのバーコードを読み取ることもできる。 BarcodeScannerは非表示部品です。この部品を使ってバーコードを撮影します。 撮影はバーコード撮影用の別バーコードを読み取るアプリが起動します。そのためアプリを動かす端末に「ZXing」のようなバーコードを読み取るライブラリが必要です(マーケットから無料でダウンロード可能)。 Amazon API検索 このAmazon APIは、TinyWebDBのAPIを利用して、図書の検索を行う。「tag」を送信して、「value」を取得する代わりに、検索ワードを送り、検索結果を受け取り。 テスト 撮影はバーコード撮影用の別画面が起動します。明るい枠の中にある赤い線の上に乗ったバーコードを読み取ります。このプレビューではバーコードに反応して赤い線の上に黄色い丸が出現しています。バーコードのスキャンの際はシャッターを切る必要はありません。このプレビューでも明るい枠内に全てのバーコードが入るようにカメラを動かせば、自動的にスキャンします。スキャンが終わると、赤い線が緑になり、App Inventorのアプリに画面が戻ります。 ISBN番号9781491906842の本のバーコード
AI2(9) Take Quiz
第11章 Web API (WordPress TinyWebDB API) WordPressは人気のCMSであり、サーバセキュリティ、パフォーマンスチューニング、スケールアップ、クラウド対応など沢山ノウハウが蓄積された。WordPressに API機能を追加して、クライドとして利用する方法を試み。 WordPressとApp Inventorの連携 App InventorはAndroidのApp作りに簡単な環境である。そのTinyWebDBコンポーネントは、TinyDBのWeb版といったものです。タグをつけてメッセージをサーバーに保存したり、サーバーにタグ名を送信してその値を受け取ったりすることができます。あらかじめTinyWebDBにあわせてサーバー側にプログラムを用意し、そこにアクセスする形で処理を用意しなければいけません。 WordPressは人気のCMSであり、サーバセキュリティ、パフォーマンスチューニング、スケールアップ、クラウド対応など沢山ノウハウが蓄積された。WordPressをWebコンテンツを作るに最適な環境。WordPressサイトは、App InventorのTinyWebDBサービスとして利用できるか? 答えはYes. WordPress に TinyWebDB API WordPressに API機能を追加して、クライドとして利用する方法を試み。 WP-TinyWebDB-APIは、両者の長所を連携し、WordPressをAppInventorのTinyWebDBサービスとして利用するためのAPIを、WordPressのプラグインとして提供したもの。 本章は、WP-TinyWebDB-APIのインストール、Postman を使ってAPIの動作確認, そして第9章のWebデータベースに応用する検証を行う。 WP-TinyWebDB-APIのインストール 公式サイトを利用する FTPツールでtinywebdb-api ディレクトリー全体を WordPress の pluginsフォルダーにコピーして下さい(/wp-content/plugins/). FTP the entire tinywebdb-api directory to your WordPress blog’s plugins folder (/wp-content/plugins/). 管理パネルの「Plugins」タブ上のpluginを有効化してください。 Activate the plugin on the “Plugins” tab of the administration […]
AI2(8) Make Quiz
**第9章 Web データベース ** TinyWebDB (Chapter 10. MakeQuiz and TakeQuiz) Chapter 8 に、TinyDBを使って簡単なメッセージを保存する処理を作成しました。 Androidでは、ネットワーク経由でサーバーにアクセスするアプリが多数あります。Androidのシステムにネットワーク通信のための機能が備わっており、それを利用して非常に簡単にサーバーとやり取りするアプリを作れるのです。 App Inventorでも、サーバーとやり取りするアプリを作ることができます。これは「TinyWebDB」という部品として用意されています。 TinyWebDBは、TinyDBのWeb版といったものです。タグをつけてメッセージをサーバーに保存したり、サーバーにタグ名を送信してその値を受け取ったりすることができます。ただし、それ以上に複雑なことは、現時点ではできません。ですから、あらかじめTinyWebDBにあわせてサーバー側にプログラムを用意し、そこにアクセスする形で処理を用意しなければいけません。 下記のテスト用サーバが用意されてる http://tinydb.edu2web.com/ ※TinyWebDBの仕様 では、TinyWebDBは、どのような形でサーバーにアクセスするのでしょうか。データの保管と取得について、その仕様をざっと整理しておきましょう。 ○データの送信 URL: アドレス/storeavalue パラメータ: tag=タグ名&value=値 データをサーバーに送信する場合、送信先となるWebサイトのアドレスの./storeavalueというURLにアクセスをします。送られるタグ名と値は、それぞれ「tag」「value」というパラメータとして送られます。 ○データの取得 URL: アドレス/getvalue パラメータ: tag=タグ名 サーバーからデータを受け取る場合、送信先となるWebサイトのアドレスの./getvalueというURLにアクセスをします。取得したい値のタグ名が「tag」パラメータで送信されます。 注意しておきたいのは、「サーバーからTinyWebDBが受け取るデータは、JSON形式でなければいけない」という点です。JSONというのは「JavaScript Object Notation」というもので、JavaScriptのオブジェクトを記述するためのフォーマットです。これを利用して、テキストやリストなどを送れるようにしています。 TinyWebDBでは、あらかじめ決められた形式でまとめられたJSONデータを受け取り、それを利用します。また送信先のURLや、送付するパラメータ名なども決まっています。それらに従って、サーバー側に処理用のプログラムを用意しなければいけないのです。 サンプルプログラム Make Quiz Design: Components: Blocks: Refer: http://www.appinventor.org/MakeQuiz10 – (English)
AI2(x) TinyDB
**第8章 データベース ** (TinyDB) (Chapter 7. Android, Where’s My Car?’) ANDROID 、私の車はどこですか この実例はAndroidで作動しますが、iOS動作できない場合がある アプリの内容はロケーションセンサ(LocationSensor)でケータイの位置を記憶(TinyDB)し、別の場所に移動した後に記憶した場所がどの方向にあるかを示すものです。なお、ロケーションセンサはエミュレータでは動作しません。動作の確認はAndroidケータイで行ってください。 データベース TinyDB : アプリを終了させても残るデ-タを持つことができる部品。デ-タはキ-とバリュ-の対で記憶される. デザイン デザイン画面 コンポーネントリストの後半 部品の一覧(プロパティ名も変更してください) グル-プ 部品名 COMPONENT上の部品名 プロパティ名 プロパティ値 - Screen Screen1 Title 私の車はどこですか? Basic Label CurrentHeaderLabel FontBold ON Text あなたの現在位置 Screen Arrangement HorizontalArrangement HorizontalArrangement1 - - Screen Arrangement HorizontalArrangement HorizontalArrangement2 - - Basic Button RememberButton Text 現在位置を記憶 Enabled […]
AI2(6) Tokyo Map Tour
第7章 位置情報 (Chapter 6. Map Tour) (Walking Tour) 今回はTokyo Map Tourというアプリを作ります。 予め登録してある3つの場所をセレクトボタンから選択すると、その場所のマップやストリートビューが表示される、というものです。 Androidでは、あるアプリから別のアプリを起動して、それに処理を渡したり、別のアプリでの実行結果を受け取ったりすることが比較的簡単にできるのです。 Tokyo Map Tourでは、Android端末に用意されているGoogle Mapのアプリを利用します。 Map Tour 東京の観光地の地図を表示するアプリです。 [目的地リスト]のボタンを押すと、東京の観光地のリストが表示されます。 Tokyo Tower (東京タワー) Imperial Palace(「皇居」二重橋) Sensoji Temple(浅草寺) リストの中から、行きたい場所を選択すると、地図が表示されます。 では、チュートリアルに従って、作ってみます。 Designer まずは、「Designer」ですね。 使用するコンポーネントは、Image、ListPicker、ActiveStarterです。 Table 6-1. Components for the Paris Map Tour 部品 PALETTE 名前 用途 Image User Interface Image1 東京画像 Label User Interface Label1 Androidで東京発見を表示 ListPicker […]
AI2(5) Ladybug Chase
第6章 センサー(1) 加速度センサー (chapter 5. Ladybug Chase) てんとう虫の冒険 スマホの傾きでてんとう虫をコントロール。 てんとう虫は、アブラ虫を食べて、エネルギーを蓄え。カエルに食べられたらおしまい。 コンポーネント パレット 命名 用途 Canvas Drawing and Amination FieldCanvas 運動場 ImageSprite Drawing and Amination Ladybug てんとう虫 OrientationSensor Sensor OrientationSensor1 スマホの傾きでてんとう虫をコントロール Clock User Interface Clock1 向き変更 ImageSprite Drawing and Amination Aphid アブラ虫(餌) ImageSprite Drawing and Amination Frog カエル(敵) Canvas Drawing and Amination EnergyCanvas てんとう虫のエネルギー Button User Interface […]
AI2(4) Media
第5章 メディア (Chapter 4. No Texting While Driving) — 運転中チャット(Texting)しない 内容はショットメッセージ受信してたら、電話番号とメッセージの音声の読み上げ、自動返信です。 1)日本では、ショットメッセージあまり普及しないので、このコース実験用スマートフォンは回線契約もないので、実施は困難。 そこで、内容は日本人の間流行っているTwitterの発信、受信( 読み上げ?)にアレンジする。 これをベースに、音声の読み上げ (発音テスト?)、翻訳ツールの作成、IoTのセンサー情報の公開も考えられます。 2)Twitter 改悪(2019)により、Twitterアカウント申請は有料になり、こちらも実施は困難になりました。 ***** Twitter とは Twitterは、140文字以内の短文「ツイート」の投稿を共有するウェブ上の情報サービスである。 https://twitter.com/ Twitterへようこそ. 「いま」起きていることを見つけよう。国内のニュースから身近なできごとまで、みんなの話題がわかる。 Twitterアカウント申請 Twitterアプリを作る場合は「Twitter」の「Properties」にある「ConsumerKey」と「ConsumerSecret」が必要になります。これはTwitterアプリの製造者番号のようなので、アプリ単位にTwitterに申請をするともらえます。 番号を取得するためにはTwitterアカウントを持っていてログイン出来ていることが前提条件になります。またアプリ製作者はモバイル登録されていることが条件になっています。携帯電話の番号を事前に登録しておきます。 Twitter App申請 アプリ登録は下記リンクの「Create New App」からできます。 必要事項を入力して登録が完了すれば「Keys and Access Tokens」から「Consumer Key (API Key)」「Consumer Secret (API Secret)」がすぐにもらえます。 ConsumerKey ConsumerSecret Application Management https://apps.twitter.com/ フォームに登録内容を入力してください。 [Name] 自分で考えてアプリの名前を入力。適当でよい。ただし、世界中に唯一無二の名前でないと登録するときに怒られる [Description] 簡単なアプリの説明を入力。最低でも10文字必要 [Website] 存在するWebサイトのアドレスを入力。お持ちのWebサイトやブログのアドレスがよい。持っていない方は日本App Inventorユーザー会のアドレスである「http://www.app-inventor.jp」を使ってもらってもよい [Callback […]