1. 程式人生 > >類似於微信的在一個Activity中介面的相互切換

類似於微信的在一個Activity中介面的相互切換

今天我們講一個例子,主要的實現是通過點選介面下方的不同按鈕,然後在上面顯示不同的Fragment佈局

步驟:

1、在res資料夾下新建一個drawable檔案,然後在裡面建立4個新的Selector型別的xml檔案,

檔案內容是:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/firstpage" android:state_checked="true"></item>
	<item android:drawable="@drawable/firstpage_blue" android:state_enabled="false"></item>
	
	<item android:drawable="@drawable/firstpage_blue"></item>
</selector>
這裡我只列舉了一個,其它三個和它是一樣的。

2、然後就是activity_main.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:orientation="vertical" >
    <FrameLayout 
        android:id="@+id/frame"
        android:layout_height="0dp"
        android:layout_width="match_parent"
        android:layout_weight="9"
        >
    </FrameLayout>
	<RadioGroup 
	    android:id="@+id/group"
	    android:layout_height="0dp"
	    android:layout_width="match_parent"
	    android:layout_weight="1"
	    android:orientation="horizontal">
	    <RadioButton 
	        android:id="@+id/rbOne"
	        android:layout_width="0dp"
	        android:layout_weight="1"
	        android:layout_height="match_parent"
	        android:button="@null"
	        android:checked="true"
	        android:background="@drawable/rb_one_selector"/>
	     <RadioButton 
	        android:id="@+id/rbTwo"
	        android:layout_width="0dp"
	        android:layout_weight="1"
	        android:layout_height="match_parent"
	        android:button="@null"
	        android:background="@drawable/rb_two_selector"/>
	      <RadioButton 
	        android:id="@+id/rbThree"
	        android:layout_width="0dp"
	        android:layout_weight="1"
	        android:layout_height="match_parent"
	        android:button="@null"
	        android:background="@drawable/rb_three_selector"/>
	       <RadioButton 
	        android:id="@+id/rbFour"
	        android:layout_width="0dp"
	        android:layout_weight="1"
	        android:layout_height="match_parent"
	        android:button="@null"
	        android:background="@drawable/rb_four_selector"/>
	</RadioGroup>
</LinearLayout>
3、定義四個Fragment和四個xml檔案,這裡我們只列出一條吧,其它三條和它是一樣的:

OneFrag:

package org.mobiletrain.fragment_demo13;

import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class OneFrag extends Fragment{

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		return inflater.inflate(R.layout.one, null);
	}
}
第一個Fragment的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:orientation="vertical" >
    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="這時第一個介面"
        android:textSize="30sp" />
</LinearLayout>
4、接下來就是在MainActivity中實現相應的邏輯操作:
package org.mobiletrain.fragment_demo13;

import android.os.Bundle;
import android.app.Activity;
import android.app.Fragment;
import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.view.Menu;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;

public class MainActivity extends Activity {

	FragmentManager manager;
	RadioGroup group;
	OneFrag onefrag;
	TwoFrag twoFrag;
	ThreeFrag threeFrag;
	FourFrag fourFrag;
	FragmentTransaction transaction;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_home);
		group = (RadioGroup)findViewById(R.id.group);
		manager = getFragmentManager();
		onefrag = new OneFrag();
		//設定初始的Fragment
		manager.beginTransaction().replace(R.id.frame, onefrag).commit();
		//設定RadioGroup的監聽事件
		group.setOnCheckedChangeListener(new OnCheckedChangeListener() {
			
			@Override
			public void onCheckedChanged(RadioGroup group, int checkedId) {
				// TODO Auto-generated method stub
				transaction = manager.beginTransaction();
				switch (checkedId) {
				case R.id.rbOne:
					//例項化一個Fragment物件然後替換掉上面的Fragment
					onefrag = new OneFrag();
					transaction.replace(R.id.frame, onefrag);
					break;
				case R.id.rbTwo:
					twoFrag = new TwoFrag();
					transaction.replace(R.id.frame, twoFrag);
					break;
				case R.id.rbThree:
					threeFrag = new ThreeFrag();
					transaction.replace(R.id.frame, threeFrag);
					break;
				case R.id.rbFour:
					fourFrag = new FourFrag();
					transaction.replace(R.id.frame, fourFrag);
					break;
				default:
					break;
				}
				//提交
				transaction.commit();
			}
		});
		
		
	}

	

}
執行效果圖: