Tìm hiểu về Fragment trong Android

Mình đã chú thích rất rõ ràng trong code. Cũng không quá khó hiểu đúng không. Sau khi hoàn thành, các bạn tiến hành chạy project và xem kết quả.

Ở bài trước mình đã giới thiệu cho các bạn biết về Tabhost. Ở bài này mình sẽ tiếp tục giới thiệu cho các bạn 1 khái niệm mới nữa đó là trong .1. Giới thiệu về trong .

Fragment có thể được hiểu như các “mảnh ghép” của giao diện ứng dụng – là một phần của Activity. Mỗi Activity có thể chứa một hoặc nhiều “mảnh ghép” này trong giao diện của mình và mỗi “mảnh ghép” lại có thể được chèn vào nhiều Activity khác nhau. Điều này cho phép giảm thiểu tối đa sự trùng lặp về mã nguồn trong việc tạo giao diện ứng dụng thích nghi được với nhiều loại kích cỡ và hướng màn hình. Các ứng dụng viết cho các phiên bản hệ điều hành thấp hơn cũng có thể sử dụng Fragment bằng cách sử dụng “thư viện hỗ trợ” của Android (Android Support Library). Thư viện này cung cấp các tính năng của các API mới cho các ứng dụng viết cho API mức thấp hơn, trong đó Android Support Library v4 cho phép các ứng dụng viết cho API 4 (Android 1.6) trở lên sử dụng được Fragment và nhiều tính năng khác của các API mức cao hơn.

2. Ví dụ

sau đây mình sẽ hướng dẫn các bạn làm 1 demo về fragment như sau. Khi các bạn click vào button nào thì nó sẽ gọi ra fragment tương ứng để hiển thị lên màn hình

B1. Tạo 1 project mới có tên FragmentDemo với cấu trúc như sau.

68B2. Các bạn thiết kế màn chính với 2 button là fragment1 và fragment2 như sau.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<LinearLayout 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:orientation=”vertical”
    tools:context=”.MainActivity”>
    <TextView
        android:textColor=”#DD00″
        android:layout_marginTop=”20dp”
        android:textSize=”25sp”
        android:layout_gravity=”center”
        android:text=”Demo Fragment”
        android:layout_width=”wrap_content”
        android:layout_height=”wrap_content” />
    <LinearLayout
        android:layout_marginTop=”15dp”
        android:gravity=”center”
        android:id=”@+id/lnButton”
        android:orientation=”horizontal”
        android:layout_width=”fill_parent”
        android:layout_height=”50dp”>
        <Button
            android:id=”@+id/btnFragment1″
            android:background=”#15cc31″
            android:text=”Fragment1″
            android:layout_width=”100dp”
            android:layout_height=”fill_parent” />
        <Button
            android:id=”@+id/btnFragment2″
            android:background=”#DD00″
            android:layout_marginLeft=”25dp”
            android:text=”Fragment2″
            android:layout_width=”100dp”
            android:layout_height=”fill_parent” />
    </LinearLayout>
    <FrameLayout
        android:layout_marginTop=”15dp”
        android:id=”@+id/fmContent”
        android:layout_width=”fill_parent”
        android:layout_height=”fill_parent”></FrameLayout>
</LinearLayout>

Xem thêm: Tài liệu tu hoc lap trinh android ở nhà Cơ Bản

B3. Các bạn tạo 2 fragment. 1 fragment có tên là GreenFragment và 1 fragment có tên là RedFragment. Các bạn tạo fragment theo cách như sau. 70sau đó các bạn đặt tên như mình đã nói ở trên. Chú ý bỏ chọn 2 phần Include như trong hình,  và sau đó nhấn Finish để hoàn tất.71tiếp tục các bạn tạo RedFragment tương tự như trên. Sau khi đã tạo xong, bạn tiến hành thiết kế layout cho 2 fragment 1 cách bình thường và tùy ý các bạn. Ở trên mình chỉ để mỗi 1 fragment 1 màu khác nhau cho dễ phân biệt.

B4. Các bạn tiến hành sửa code trong main như sau.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
package devpro.com.fragmentdemo;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
public class MainActivity extends FragmentActivity implements View.OnClickListener {
    Button btnFragment1, btnFragment2;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // khởi tạo 2 button
        btnFragment1 = (Button) findViewById(R.id.btnFragment1);
        btnFragment2 = (Button) findViewById(R.id.btnFragment2);
        // Gọi hàm này để khi chạy lần đầu tiên màn hình sẽ hiển thị GreenFragment có màu xanh
        callFragment(new GreenFragment());
        // Bắt sự kiện click cho 2 button
        btnFragment1.setOnClickListener(this);
        btnFragment2.setOnClickListener(this);
    }
    // Hàm gọi Fragment để khi click vào thì sẽ gọi Fragment tương ứng.
    // Hàm này có tham số truyền vào 1 Fragment
    public void callFragment(Fragment fragment) {
        FragmentManager manager = getSupportFragmentManager();
        FragmentTransaction transaction = manager.beginTransaction();
    //Khi được goi, fragment truyền vào sẽ thay thế vào vị trí FrameLayout trong Activity chính
        transaction.replace(R.id.fmContent, fragment);
        transaction.commit();
    }
    // Hàm sự kiện onClick cho 2 button
    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.btnFragment1:
                callFragment(new GreenFragment());
                break;
            case R.id.btnFragment2:
                callFragment(new RedFragment());
                break;
        }
    }
}

Mình đã chú thích rất rõ ràng trong code. Cũng không quá khó hiểu đúng không. Sau khi hoàn thành, các bạn tiến hành chạy project và xem kết quả.

Trên đây mình đã giới thiệu và hướng dẫn các bạn hiểu hơn về . Ở những phần tiếp theo mình sẽ hướng dẫn các bạn về ViewPager. Các bạn chú ý theo dõi và chúc các bạn thành công.

Cùng Danh Mục:

Liên Quan Khác

Leave a Reply

Your email address will not be published. Required fields are marked *