■ なぜXMLでUIを書くのか?
Androidアプリでは、UI(ユーザーインターフェース)をXMLファイルで定義するのが一般的です。HTMLのようなタグベースの記述形式で、どの部品(View)をどこにどのように配置するかを、視覚的・構造的に記述できます。
Java(やKotlin)のコードでもUIを構築できますが、XMLは分離・再利用・視認性の高さの点で優れており、Android Studioのレイアウトエディタとも連携しています。
■ UIのXMLファイルの例(res/layout/activity_main.xml)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/helloText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="こんにちは" />
<Button
android:id="@+id/clickButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="押してね" />
</LinearLayout>
ここでは、縦方向に TextView
と Button
が並んでいます。それぞれに android:id
がついており、コード側でこのIDを使って部品を操作します。
■ コードとの連携(Activityクラス)
XMLだけではボタンを押しても何も起きません。Java側でイベント処理などのロジックを記述して、UIと結びつける必要があります。
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); // ①XMLを読み込む
// ②XMLに定義したViewを取得
TextView textView = findViewById(R.id.helloText);
Button button = findViewById(R.id.clickButton);
// ③ボタンが押されたときの処理を記述
button.setOnClickListener(v -> {
textView.setText("こんにちは、世界!");
});
}
}
ポイント:
setContentView()
でXMLを画面として読み込むfindViewById()
でXML内のViewをJavaコードから取得- 必要に応じてイベント処理やプロパティ変更を行う
■ なぜこの構成が良いのか?
- UI(見た目)とロジック(処理)を分離できる → 保守性が高くなる
- XMLファイルを再利用できる(
include
やmerge
などの構文もある) - デザイナーとエンジニアで作業を分担しやすい
- Android Studioのレイアウトプレビューで即時確認できる
■ よくあるミスと注意点
findViewById()
の型やIDの間違い → コンパイルは通っても落ちるsetContentView()
を忘れると画面が表示されない- IDが
@+id/...
で定義されていないとコードから参照できない - Viewが
null
になる場合は、対象のXMLに本当に存在しているかを確認
まとめ:XMLは“見た目を作る”、Javaは“動きを作る”
AndroidのUIは、基本的に「XMLで画面を作り、Javaで動きを与える」という役割分担で構成されます。最初は連携に少し戸惑うかもしれませんが、慣れるととても効率よく開発ができます。