Android 基礎:Fragment的介紹與應用,QQ底欄,側滑選單
Fragment介紹
Android是在Android 3.0 (API level 11)開始引入Fragment的。可以把Fragment當成Activity的一個介面的一個組成部分,甚至Activity的介面可以完全有不同的Fragment組成,而且Fragment擁有自己的生命週期和接收、處理使用者的事件,這樣就不必在Activity寫一堆控制元件的事件處理的程式碼了。更為重要的是,你可以動態的新增、替換和移除某個Fragment。
Fragment的生命週期
因為Fragment必須嵌入在Acitivity中使用,所以Fragment的生命週期和它所在的Activity是密切相關的。
如果Activity是暫停狀態,其中所有的Fragment都是暫停狀態;如果Activity是stopped狀態,這個Activity中所有的Fragment都不能被啟動;如果Activity被銷燬,那麼它其中的所有Fragment都會被銷燬。
但是,當Activity在活動狀態,可以獨立控制Fragment的狀態,比如加上或者移除Fragment。
當這樣進行fragment transaction(轉換)的時候,可以把fragment放入Activity的back stack中,這樣使用者就可以進行返回操作。
Fragment的使用相關
使用Fragment時,需要繼承Fragment或者Fragment的子類(DialogFragment, ListFragment, PreferenceFragment, WebViewFragment),所以Fragment的程式碼看起來和Activity的類似。
使用Support Library
Support Library是一個提供了API庫函式的JAR檔案,這樣就可以在舊版本的Android上使用一些新版本的APIs。
比如android-support-v4.jar.它的完整路徑是:
<sdk>/extras/android/support/v4/android-support-v4.jar.
它就提供了Fragment的APIs,使得在Android 1.6 (API level 4)以上的系統都可以使用Fragment。
為了確定沒有在舊版本系統上使用新版本的APIs,需要如下匯入語句:import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager;
必須實現的回撥函式
onCreateView()
當第一次繪製Fragment的UI時系統呼叫這個方法,必須返回一個View,如果Fragment不提供UI也可以返回null。
注意,如果繼承自ListFragment,onCreateView()預設的實現會返回一個ListView,所以不用自己實現。
public class ExampleFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // Inflate the layout for this fragment return inflater.inflate(R.layout.example_fragment, container, false); } }
把Fragment加入Activity
Fragment有兩種載入方式:一種是在Activity的layout中使用標籤<fragment>宣告;另一種方法是在程式碼中把它加入到一個指定的ViewGroup中。
載入方式1:通過Activity的佈局檔案將Fragment加入Activity
在Activity的佈局檔案中,將Fragment作為一個子標籤加入即可。
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <fragment android:name="com.example.news.ArticleListFragment" android:id="@+id/list" android:layout_weight="1" android:layout_width="0dp" android:layout_height="match_parent" /> <fragment android:name="com.example.news.ArticleReaderFragment" android:id="@+id/viewer" android:layout_weight="2" android:layout_width="0dp" android:layout_height="match_parent" /></LinearLayout>
載入方式2:通過程式設計的方式將Fragment加入到一個ViewGroup中
當Activity處於Running狀態下的時候,可以在Activity的佈局中動態地加入Fragment,只需要指定加入這個Fragment的父View Group即可。
首先,需要一個FragmentTransaction例項:
FragmentManager fragmentManager = getFragmentManager(); FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
(注,如果importandroid.support.v4.app.FragmentManager;那麼使用的是:FragmentManager fragmentManager = getSupportFragmentManager();)
之後,用add()方法加上Fragment的物件:
ExampleFragment fragment = new ExampleFragment(); fragmentTransaction.add(R.id.fragment_container, fragment); fragmentTransaction.commit();
其中第一個引數是這個fragment的容器,即父控制元件組。
最後需要呼叫commit()方法使得FragmentTransaction例項的改變生效。
Fragment簡單的應用
1、新建工程
2.、建立若干個簡單的佈局(用於fragment的載入),如下:
activiy_main為主佈局檔案,fragment1,fragment2為fragment的佈局檔案
3、建立Fragment的類
建立Fragment1:建立過程與建立Activity類似,不過繼承的是android.support.v4.app.Fragment
建立Fragment2:同上
複寫onCreateView函式載入fragment的佈局,R.layout.fragment1就是剛剛建立的佈局檔案。
4、執行
Fragment擴充套件應用
底欄按鈕切換介面的實現(類似QQ底欄)
1、與上面類似,新建佈局檔案activity2.xml,具體佈局如下:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/bottom"
android:layout_width="match_parent"
android:layout_height="65dp"
android:layout_alignParentBottom="true"
android:background="@null"
android:gravity="center_vertical"
android:orientation="horizontal" >
<Button
android:id="@+id/f1"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="1"
android:text="fragment1" />
<Button
android:id="@+id/f2"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="1"
android:text="fragment2" />
</LinearLayout>
<FrameLayout <!-- 注意,這裡是幀佈局不是Fragment --!>
android:id="@+id/content_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/bottom"
android:background="#fff" >
</FrameLayout>
</RelativeLayout>
兩個按鈕組成的佈局作為底欄,上面空白部分為幀佈局:
2、新建兩個用於填充Fragment的佈局檔案,與上面類似。
3、建立兩個Fragment類,與上面類似
4、編寫主Activity程式碼:
public class Activity2 extends FragmentActivity {//注意!這裡繼承的是FragmentActivity
private Button f1, f2;
private Fragment mContent; //這裡是Fragment而不是幀佈局,幀佈局不用宣告
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity2);//載入activity的佈局
f1 = (Button) findViewById(R.id.f1);//例項化兩個按鈕
f2 = (Button) findViewById(R.id.f2);
if (mContent == null) {
mContent = new Fragment3(); //例項化Fragment
//下面是重點!
//Fragment通過FragmentManager來管理
//beginTransaction()返回Fragment事務管理例項
//replace()執行Fragment事務中的替換
//R.id.content_fragment用來裝載Fragment的容器
//mContent用於替換的Fragment的物件
//commit()提交事務,完成操作
getSupportFragmentManager().beginTransaction().replace(
R.id.content_fragment, mContent).commit();
}
f1.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
mContent = new Fragment3();
if (mContent != null) {
getSupportFragmentManager().beginTransaction()
.replace(R.id.content_fragment, mContent).commit();
}
}
});
f2.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
mContent = new Fragment4();
if (mContent != null) {
getSupportFragmentManager().beginTransaction()
.replace(R.id.content_fragment, mContent).commit();
}
}
});
}
}
5、執行除錯
1、側滑選單+Fragment
側滑選單的介紹
市場上很多應用均採取的框架,從螢幕左側劃出選單,點選菜單,右側介面進行相應的切換。安卓5.0以前實現這種效果只能通過別人的開原始碼實現,從5.0安卓開始提供了自帶的側滑選單元件DrawerLayout,該元件在supportv4包下,相容之前的版本。
1、新建工程,與相應的佈局檔案
2、Activity的佈局如下:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<android.support.v4.widget.DrawerLayout
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- 螢幕中的主內容 -->
<FrameLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- The navigation drawer -->
<!-- 左滑選單佈局 -->
<LinearLayout
android:id="@+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start" 表示左邊選單
android:background="#ffffff"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:id="@+id/one"
android:layout_width="240dp"
android:layout_height="55dp"
android:drawableLeft="@drawable/ic_launcher"
android:gravity="center"
android:text="第一個介面"
android:textColor="#353535"
android:textSize="23dp" />
<TextView
android:id="@+id/two"
android:layout_width="240dp"
android:layout_height="55dp"
android:drawableLeft="@drawable/ic_launcher"
android:gravity="center"
android:text="第二個介面"
android:textColor="#353535"
android:textSize="23dp" />
<TextView
android:id="@+id/three"
android:layout_width="240dp"
android:layout_height="55dp"
android:drawableLeft="@drawable/ic_launcher"
android:gravity="center"
android:text="第三個介面"
android:textColor="#353535"
android:textSize="23dp" />
</LinearLayout>
<!-- 增加右邊抽屜顯示 -->
<TextView
android:id="@+id/right_drawer"
android:layout_width="280dp"
android:layout_height="match_parent"
android:layout_gravity="end" 表示右邊選單
android:background="#ffffff"
android:gravity="center"
android:text="@string/right_drawer_info"
android:textColor="#444444"
android:textSize="30sp" >
</TextView>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
3、主Acitity的編寫
public class MainActivity extends FragmentActivity {// 整合的是FragmentActivity
private DrawerLayout mDrawerLayout;// 側滑選單
private LinearLayout mDrawerList;// 側滑選單的佈局
private MenuListener menuListener;// 監聽
private TextView one, two, three;// 側滑選單中的三個TextView
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// 例項化操作
mDrawerList = (LinearLayout) findViewById(R.id.left_drawer);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
one = (TextView) findViewById(R.id.one);
two = (TextView) findViewById(R.id.two);
three = (TextView) findViewById(R.id.three);
menuListener = new MenuListener();
one.setOnClickListener(menuListener);
two.setOnClickListener(menuListener);
three.setOnClickListener(menuListener);
// 設定選單被拉出時的陰影
mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow,
GravityCompat.START);
// 預設顯示第一個Fragment
Fragment fragment = new Fragment1().getNewInstance();
FragmentManager fragmentManager = getSupportFragmentManager();
fragmentManager.beginTransaction()
.replace(R.id.content_frame, fragment).commit();
}
// 主要是三個TextView的監聽事件
private class MenuListener implements View.OnClickListener {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
Fragment fragment = null;
switch (v.getId()) {
case R.id.one:
fragment = new Fragment1().getNewInstance();
break;
case R.id.two:
fragment = new Fragment2();
break;
case R.id.three:
fragment = new Fragment3();
break;
default:
break;
}
FragmentManager fragmentManager = getSupportFragmentManager();
fragmentManager.beginTransaction()
.replace(R.id.content_frame, fragment).commit();
// 點選後關閉側滑選單
mDrawerLayout.closeDrawer(mDrawerList);
}
}
}