Androidプログラミングに挑戦2!(9)Hello World!アプリをいじる

0
    JUGEMテーマ:プログラミング

    それではまず、Android Studioの画面を見てみましょう。



    画面右2/3に表示されているのが、レイアウトのデザイナー画面です。実際の画面にパーツを配置するようなイメージで、GUIで画面をデザインできます。このエリアはコード編集画面にもなります。現在開かれているパーツがすぐ上の欄にタブで表示されています。現在は、「MainActivity.java」のコードと「content_main.xml」というレイアウトが開かれています。

    で、残りの左1/3に表示されているのがプロジェクトのツリーです。現在は「Android」モードの表示になっていますが、「App」の上の「Android」と書かれた部分をクリックすることで、色々なモードで表示させることができます。まずはこのまま進めます。

    現状でプロジェクトの中に表示されているのは、大項目で2つ、「App」と「Gradle Script」の2つです。このうち「Gradle Script」はアプリのビルドをコントロールするスクリプトで、のこる「App」が実際のアプリのコード類になります。

    「App」の中には3つのコンポーネントが表示されています。
    ・Manifests
    これは、アプリの名前やアイコン、機能類など様々な情報を定義する「AndroidManifest.xml」が保管されているフォルダです。
    現状のAndroidManifest.xmlの中身はこうなっています。



    ファイルの拡張子、および1行目の記述の通り、ファイルはXMLの文法で入れ子になったブロック要素として整理されて記述されています。画面の左にちこっと見えている緑色の物体は、デフォルトのアイコン画像です。

    ・java
    これはjavaで書かれたアプリのプログラムが置いてあるフォルダです。



    中にはMainActivity.javaというファイルとApplicationTest.javaというファイルの2つがあります。前者がアプリの本体で、後者はアプリをテストするためのコードです。

    ・res
    ここは、アプリの画面レイアウト、メニュー、アイコン、文字列等、アプリの部品となるリソースを保管するフォルダです。
    現状のフォルダを全部開くとこうなります。



    順に確認していきましょう
    -layoutフォルダ
    ここは、アプリの画面レイアウトを定義しているところです。
    このアプリでは、全体の構成をactivity_main.xmlで定義し、実際にHello World!を表示するコンテンツ部分のみをcontent_main.xmlで定義しています。

    -menuフォルダ
    アプリ画面右上のメニューボタンを押したときの表示に関する設定です。現状は「Settings」の文字が表示されるだけです。

    -mipmapフォルダ
    アプリのアイコン画像が保管されているフォルダです。サイズ違いで5つのアイコンが登録されています。

    -valuesフォルダ
    アプリの配色やマージン、使用する文字列等を定義する場所です。

    と、プロジェクトの全貌が見えたところで、今回のもう一つのテーマ、アプリの修正をやってみたいと思います。
    といっても「Hello World!」の文字列を表示するだけのアプリですから、できることは限られています。まずはストレートにこの「Hello World!」の文字を「こんにちは、世界!」に変えてみたいと思います。

    そもそも、現在「Hello World!」の文字はどこに定義されているのでしょうか?アプリのプログラムのコードMainActivity.javaか、コンテンツのレイアウトを決めているcontent_main.xmlか、アプリで使用する文字列を定義しているresフォルダ内のstrings.xmlあたりでしょうか。
    調べてみるとありました。content_main.xmlにありました。
    右のデザイン画面の、一番下に、「Design」と「Text」という下向きのタブがありますので、この「Text」の方をクリックしてみてください。



    プレビュー画面が右に寄って、真ん中にcontent_main.xmlのコードが表示されました。この下から2行目に「android:text="Hello World!」と書いてありました。この文字列を修正してやれば表示も変わるはずです。
    では「Hello Japan!」にしてみましょう。

    まず、コードの文字列を変えたところで、右側のプレビュー画面が「Hello Japan!」に変わりました。



    でもこの時点では画面右端に持ってきたエミュレータの画面は変化がありません。
    そこで緑の三角の「実行」ボタンをクリックします。すると、エミュレータ画面もHello Japan!に変わりました。



    しかも、この反映までの時間が約2秒!。これがAndroid Studio 2.0で導入されたInstant Runの威力、だそうですが、使い始めたばかりなので今一実感がわきません。きっともっと大きなプロジェクトをビルドするようになると実感するのでしょう。




    さて、ソースを直接いじって変えるだけではつまらないので、今度はデザイン画面を使い、Hello World!の文字列を外部化してみましょう。
    まず、先ほどの下タブでデザイン画面に戻し、画面のHello Japan!の文字をダブルクリックし、Hello Japan!の文字の右の「…」をクリックします。



    すると既存のリソースがResourceダイアログで表示されますが、今回は新しくリソースを起こすので、一番下の「New Resource」ボタンをクリックし、プルダウンされる「New String Value」をクリックします。



    すると、「New String Value Resource」ダイアログが表示されます。上の2つのボックスが空になっていますので、下の画像のように打ち込みOKをクリックします。



    すると、即座にプレビュー表示が「こんにちは、世界!」に変わりました!



    ソースの方はどうなっているでしょうか?
    先ほどHello World!が書かれていたcontent_main.xmlは、「android:text="@string/message"」つまり、string.xmlのmessageという名前の付いた文字列を持ってきなさい、という指示に書き換わっています。



    そして、string.xmlの方はというと、



    このように、3つ目の値として、「こんにちは、世界!」が追加されていました。
    あとは先ほどといっしょ、緑の三角マークの「実行」をクリックすると、数秒でビルドが完了し、エミュレータ画面に「こんにちは、世界!」の文字が表示されました。





    それでは今回はここまで。次回は、電卓アプリの前にもうちょっと簡単な単位変換アプリを作ってみましょう。


    コメント
    コメントする








       

    calendar

    S M T W T F S
      12345
    6789101112
    13141516171819
    20212223242526
    2728293031  
    << October 2019 >>

    アクセスカウンタ

    合計:
    今日:
    昨日:

    selected entries

    categories

    archives

    recent comment

    • ホームページをリニューアルするの巻(19)−Googleウェブサイト翻訳ツールを組み込む
      てちくん
    • ホームページをリニューアルするの巻(19)−Googleウェブサイト翻訳ツールを組み込む
      てちくん
    • ホームページをリニューアルするの巻(19)−Googleウェブサイト翻訳ツールを組み込む
      小田きく江
    • ロリポブログでGoogleにサイトマップを登録する際の注意事項
      てちくん
    • ロリポブログでGoogleにサイトマップを登録する際の注意事項
      suraugi
    • いそべぇのペーパークラフトを作る(初級編)(12)
      てちくん
    • いそべぇのペーパークラフトを作る(初級編)(12)
      だべえ
    • noomでマイナス12kgのダイエットに成功!
      Yoko

    recommend

    recommend

    recommend

    ドール デザートメーカー ヨナナス901
    ドール デザートメーカー ヨナナス901 (JUGEMレビュー »)

    結構高いんです、でも欲しいんです!

    links

    profile

    書いた記事数:173
    最近の更新日:2017/01/30

    search this site.

    others

    mobile

    qrcode

    powered

    無料ブログ作成サービス JUGEM

    Google Adsense

    楽天ブックス

    楽天