多言語翻訳アプリ
入力した言葉を多言語に翻訳して結果を読み上げるアプリを作ります
日本語化プロジェクトのApp Inventor 2では翻訳コンポーネントが動かないので、無料で使えるGoogle Apps Scriptで作ったウェブアプリを呼び出して翻訳しています。このウェブアプリはこのApp Inventor 2アプリで使っている方法で自由に使ってもらって構いません。ページの最後にあるダウンロードセクションからソースコードをダウンロードできます。
[プロジェクト]メニューから[新規プロジェクトを始める]を選択し、"Translator“と名前を付けます。
デザイン編集
Screen1のタイトルを"翻訳"にします。
コンポーネントを追加
レイアウトパレットから水平配置コンポーネントを4個ビューアーに縦に並べ、横幅を親要素に合わせるにします。上から順に水平配置1, 2, 3, 4という名前になっているはずです。"水平配置1″にユーザーインターフェースパレットからラベルとスピナーを並べ、ぞれぞれ"入力言語ラベル"、"入力言語"と名前を変えます。"入力言語ラベル"のテキストプロパティーは"入力言語"にします。"水平配置2″には同じくユーザーインターフェースパレットからラベルとスピナーを並べ、ぞれぞれ"出力言語ラベル"、"出力言語"と名前を変えます。"出力言語ラベル"のテキストプロパティーは"出力言語"にします。入力言語スピナーの文字列から要素プロパティーは"英語,日本語,スペイン語,フランス語,ドイツ語"、選択要素は"英語"にします。出力言語スピナーの文字列から要素プロパティーは"英語,日本語,スペイン語,フランス語,ドイツ語"、選択要素は"日本語"にします。
“水平配置3″にはユーザーインターフェースパレットからラベルとテキストボックスとボタンを並べ、ぞれぞれ"入力ラベル"、"入力"、"入力消去"と名前を変えます。"入力ラベル"のテキストプロパティーは"入力"に、"入力"の横幅は親要素に合わせるにしマルチラインをチェックしてヒントは空白にし、"入力消去"のテキストプロパティーは"X"にし横幅は32ピクセルにします。"水平配置4″にはユーザーインターフェースパレットからラベルとテキストボックスを並べ、ぞれぞれ"出力ラベル"、"出力"と名前を変えます。"出力ラベル"のテキストプロパティーは"翻訳結果出力"に、"出力"の横幅は親要素に合わせるにしマルチラインをチェックしてヒントは空白にします。次にユーザーインターフェースパレットからボタンを"水平配置4″の下にドラッグアンドドロップし、名前を"翻訳ボタン"に変え、テキストプロパティーを"翻訳実行"とします。
最後に非可視コンポーネントとしてメディアパレットからテキスト読み上げを1個、接続パレットからウェブを1個、ビューアーにドラッグアンドドロップします。下図のようになります。