Viewを動的に切り替える
はじめに
ボタンを押すと画面のビューを別のものに切り替えたい場合があります。
そのときはgetLayoutInflater().inflate(int ResourceId, ViewGroup root)を使えばいいです。
// 変更したいレイアウトを取得する LinearLayout layout = (LinearLayout)findViewById(R.id.layout); // レイアウトのビューをすべて削除する layout.removeAllViews(); // レイアウトをR.layout.sampleに変更する getLayoutInflater().inflate(R.layout.sample, layout);
サンプルの作成
それではボタンを押すとその下の赤い部分が青に変更するプログラムを作成します。
起動したときは赤
クリックすると青に変更
切替元レイアウトを指定する
はじめにactivity_main.xmlに変更するレイアウトを作成し、idを設定する
<LinearLayout android:id="@+id/layout" android:background="#FF0000" ... ><!-- 赤色 -->
切替後のレイアウトを作成する
切替後のレイアウトは背景(background)が青のものを作成します
sample.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#0000FF" android:orientation="vertical" > </LinearLayout>
ボタンを押したときの処理を記述する
今回はonCreate()にボタンを押すとレイアウトが切り替えるような処理を記述します。
// ボタンを押したときにイベントを取得できるようにする Button button1 = (Button)findViewById(R.id.button1); button1.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { /* * 一部のビューだけを変更する */ // 変更したいレイアウトを取得する LinearLayout layout = (LinearLayout)findViewById(R.id.layout); // レイアウトのビューをすべて削除する layout.removeAllViews(); // レイアウトをR.layout.sampleに変更する getLayoutInflater().inflate(R.layout.sample, layout); } });
ソースコード
MainActivity.java
package com.example.blogsample; import android.os.Bundle; import android.app.Activity; import android.view.Menu; import android.view.View; import android.view.View.OnClickListener; import android.widget.Button; import android.widget.LinearLayout; public class MainActivity extends Activity{ @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); setTitle("View切替のサンプル"); // ボタンを押したときにイベントを取得できるようにする Button button1 = (Button)findViewById(R.id.button1); button1.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { /* * 一部のビューだけを変更する */ // 変更したいレイアウトを取得する LinearLayout layout = (LinearLayout)findViewById(R.id.layout); // レイアウトのビューをすべて削除する layout.removeAllViews(); // レイアウトをR.layout.sampleに変更する getLayoutInflater().inflate(R.layout.sample, layout); } }); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.main, menu); return true; } }
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context=".MainActivity" > <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignParentRight="true" android:layout_alignParentTop="true" android:text="Click!" /> <LinearLayout android:id="@+id/layout" android:background="#FF0000" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/button1" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_alignParentRight="true" android:layout_below="@+id/button1" android:orientation="vertical" > </LinearLayout> </RelativeLayout>
sample.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#0000FF" android:orientation="vertical" > </LinearLayout>