1. HOME
  2. »
  3. プログラミング・Web
  4. »
  5. Androidアプリ開発
  6. »
  7. 【Android Studio】TextView を使ってテキストを変更、追加する方法。

【Android Studio】TextView を使ってテキストを変更、追加する方法。

TextViewの文字列を変更するより、これまでの人生を変更したい@It_is_Rです。

Android Studioを使ったアプリ開発講座6回目です。
今回はアプリに表示されたテキストを変更、そして、さらに別のテキストを追加表示してみます。

※今回使用しているバージョンは「Android Studio 2.3.3.0」です。

前回までの解説では、アプリ内に「Hello World!」と表示されているだけでした。
言い換えれば「Hello World!」と書かれた TextView が、あらかじめ用意されているということです。
本来の開発であれば、これが不要の場合、削除してしまいます。が、今回はそのままにしておきます。
今回はここからテキストの変更や追加、表示する方法を解説していきたいと思います。
android studio

目次
  1. TextView のテキストを変更する
  2. テキストを追加する

TextView のテキストを変更する

まずはテキストを変更する方法です。
その方法は「Design」もしくは「Text」で編集していきます。

Design で変更する方法

「activity_main.xml」ファイルを開くと、左下に「Design」と「Text」が選べるようになっています。
ここでは「Design」を選びましょう。
android studio

すると下のように、アプリ画面のデザインが表示されます。
今回は文字を変更したいので、アプリ画面中央の文字をクリックして選択します。
右に「Properties」が表示されますので、TextView→textの「Hello World!」を好きな文字に変更します。
android studio

私は「ハローワールド!」に変更してみました。
android studio

Text で変更する方法

ソースを編集するのに慣れている方は、こちらの方が分かりやすいかもしれません。
「activity_main.xml」ファイルを開き「Text」を選択します。
android studio

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.r.myapplication.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

12行目のandroid:text="Hello World!"が、アプリ内のTextViewに表示されている文字を表しています。
この部分を変更してみましょう。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.r.myapplication.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ハローワールド!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

どちらの方法でも、実行するとこのように文字が変更されます。
android studio

エラー?が表示されます

さて、文字列を変更すると、エラー?が表示されます。
android studio

この赤い四角をクリックすると、次のように表示されます。
android studio

実は今回のこれはエラーではなくWarning(警告)です。
Warning: Hardcoded string “ハローワールド!”, should use `@string` resource

つまり、@stringを使った方がいいよ、ということです。
このままでも実行はされますが、警告をそのままにしておくのも気持ち悪いので、@stringを使ったものに作り変えてみたいと思います。
「strings.xml」を使用することで、これを解決することができます。

「strings.xml」を使う

「strings.xml」ファイルを開きます。

<resources>
    <string name="app_name">My Application</string>
</resources>

ここに表示したいテキストをあらかじめ入力しておきます。
こんな感じです。

<resources>
    <string name="app_name">My Application</string>
    <string name="text">ハローワールド!</string>
</resources>

入力したら「activity_main.xml」を開きます。
ここから「Design」か「Text」かのどちらかで変更していきます。

まずは「Design」で変更する方法です。
TextViewを選択し「Properties」から「text」の部分を書き換えます。
@string/textと入力します。ここでいうtextというのは、先ほど「strings.xml」で指定した「name」にあたるものです。
android studio

もしも「Text」で編集する場合は、ソースを以下のように変更します。
変更する箇所は12行目です。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.r.myapplication.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/text"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

テキストを追加する

では、テキストを追加してみましょう。
これも「Design」と「Text」の二つの方法があります。

Design で変更する方法

追加は「Palette」から「TextView」をドラッグすることでできます。
android studio

Text で変更する方法

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.r.myapplication.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/text"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <!-- ここから -->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TextView" />
    <!-- ここまで追加 -->

</android.support.constraint.ConstraintLayout>

とりあえずテキストを追加することができますが、このままでは位置を指定していないので、実行しても左上に文字がきてしまいます。
文字の位置を指定する方法については、後日別の記事で紹介したいと思います。
android studio

この企画の一覧はこちら

  1. Android StudioをMacにインストールする方法
  2. 【Android Studio】新規プロジェクトを作成する方法
  3. 【Android Studio】エミュレータを起動してプログラムを実行する方法!
  4. 【Android Studio】開発したアプリの実機テストを行う方法。
  5. 【Android Studio】アプリ開発の基本とそれぞれのファイルの役割を覚える。
  6. 【Android Studio】TextView を使ってテキストを変更、追加する方法。
  7. 【Android Studio】Button(ボタン)を作る基本中の基本。
  8. 【Android Studio】TextView 文字の色やサイズ、書体を変更する方法。
  9. 【Android Studio】レイアウト( Layout )の種類を覚えよう!
  10. 【Android Studio】 GridLayout の使い方。複雑なレイアウトを表現する方法
  11. 【Android Studio】じゃんけんゲームの作り方(アプリ開発の基本)

スポンサードリンク

関連コンテンツ

オススメ記事

Homebrew

Homebrewの使い方。よく使うコマンド一覧と詳しい解説まとめ

※追記 この記事は2018/04/30に最新の情報に書き直しました。 人生をもう一度やり直したいとつくづく思う@It_is_Rです。 今回はHomebrewについての記事を書いて

java

【Java】スーパクラス、サブクラスとは?継承について。

猿も木から落ちますが、Rは木から落ちません。だって登らないから。 @It_is_R です。いや、登ろうと思っても登れません。 Javaを使っていると継承という言葉をよく耳にしますよね。どういうも

WordPress|ショートコードの作り方&使い方。確実に使いこなす為のガイド。

前回、WordPressで、特定のカテゴリ一覧を表示する方法について書きました。 改めまして、@It_is_Rです。 特定のカテゴリ一覧を表示したとき、ショートコードというものを使いましたが、

FC2 blog customize

FC2ブログ ”最強” カスタマイズ入門講座。文字の大きさを設定する。

こんにちわ。美しいものほど濁って見える@It_is_Rです。 今回もFC2ブログの最強カスタマイズを始めていこうと思います。 今回は文字の大きさや色など、ブログ内の文字の設定をしていきます。初

キー入力で文字を切り替えるべ

【JavaScript】ノベルゲーム風にキー入力で文字を切り替える方法! 小学生からのプログラミング入門

小学生からのJavaScript講座です。 前回、文字を一文字づつ表示させる方法と改行の方法を紹介しました。 今回はこのプログラムに、キー入力によって文字を切り替えられる機能をつけてみましょう。

【Xcode7】Storyboardを使ってMacアプリ開発に挑戦。

何だか今日はトイレが近い。@It_is_Rでございます。 現在開発中の人魚のゲームは今ストーリーを練っている所です。まだまだ時間がかかりそうです。 さて、Rは今、Macアプリ開発を勉強中なので

Scratchでピアノを 作ってみよう!

Scratchでピアノ鍵盤を作って音を鳴らそう! 小学生からのプログラミング入門

小学生から始めるScratch入門です。 前回はじゃんけんゲームを作りました。 今回はピアノの鍵盤を作って、音を鳴らしてみましょう。 プロローグ [serif icon="aru-s.jpg"

【Xcode7】Swift2でMacアプリ開発。Storyboardでボタンを作る。

喧嘩するほど仲がいいとは言いますが、喧嘩する相手がいません。友達がいないということでしょうか。@It_is_Rです。 前回、StoryboardでMacのウィンドウに文字を表示しました。しかし、

リセットCSS は何を使う? おすすめ8選(コピペも可能!)

Web開発でブラウザごとの表示の違いをリセットしてくれる リセットCSS というものがあります。 しかし、何を使っていいのかと感じている人もいると思います。 今回はこの リセットCSS につい

WordPressのテーマを自作してみよう。テーマ開発の方法を徹底解説!

WordPressテーマの自作方法を紹介していきます。 今回はテーマ作成における知識や、ツール、ファイル構成、実際の作り方などを書いていきます。 WordPressのテーマを自作する上

コメントをどうぞ!(コメントは承認後に反映されます)

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です