Android Programing Bài 12: Fragment (part 2)

 Tiếp theo chúng ta tạo file activity_top.xml: Trên Android Studio chọn: File/New/Layout resource file...  Thiết kế giao diện trên activity_top.xml... @Nullable @Override public View

 Copy và paste

file andrea.jpg vào thư mục mipmap của project.

 Android Studio sẽ bắt bạn chọn chất lượng ảnh sẽ được tạo ra

Chọn mipmap-mdpi đây là các ảnh với chất lượng trung bình.

 Tiếp theo chúng ta tạo

file activity_top.xml:

Trên Android Studio chọn:

File/New/Layout resource file

 Nhập vào:

File name: activity_top.xml Root element: RelativeLayout Directory name: layout

 Tương tự tạo

file activity_bottom.xml

 Thiết kế giao diện trên activity_top.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout

xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"

android:layout_height="match_parent">

android:layout_height="wrap_content"

android:text="Apply"

android:id="@+id/button_apply"

android:layout_below="@+id/input_bottom_image_text" android:layout_centerHorizontal="true" />

</RelativeLayout>

Thiết kế giao diện trên activity_bottom.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout

xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"

TopFragment java

package org.o7planning.androidfragment;

import android.os.Bundle;

import android.support.annotation.Nullable;import android.support.v4.app.Fragment;import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

public class TopFragment extends Fragment {

@Nullable

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

// Đọc file xml tạo ra đối tượng View

// inflate(@LayoutRes int resource, @Nullable ViewGroup root, booleanattachToRoot)

View view= inflater.inflate(R.layout.activity_top, container, false);

// Đọc file xml tạo ra đối tượng View.

// inflate(@LayoutRes int resource, @Nullable ViewGroup root, booleanattachToRoot)

View view= inflater.inflate(R.layout.activity_bottom, container, false); return view;

}

}

Và bây giờ, bạn cần bố trí các fragment trên giao diện chính của Activity Mởfile activity_main.xml

Chọn TopFragment:

Thay đổi ID cho các fragment.

android:layout_width="match_parent"

android:layout_height="match_parent"

android:paddingBottom="@dimen/activity_vertical_margin"

android:layout_alignParentBottom="true"

android:layout_alignParentLeft="true"

android:layout_alignParentStart="true"

android:layout_alignRight="@+id/top_fragment"

BottomFragment bottomFragment

= (BottomFragment) this.getSupportFragmentManager() findFragmentById(R.id.bottom_fragment);

bottomFragment.showText(topImageText, bottomImageText); }

private EditText inputTopImageText;

private EditText inputBottomImageText;

private MainActivity mainActivity;

// Đọc file xml tạo ra đối tượng View

// inflate(@LayoutRes int resource, @Nullable ViewGroup root, booleanattachToRoot)

View view = inflater.inflate(R.layout.activity_top, container, false);

inputTopImageText = (EditText)

view.findViewById(R.id.input_top_image_text);

inputBottomImageText = (EditText)

view.findViewById(R.id.input_bottom_image_text);

Button applyButton = (Button) view.findViewById(R.id.button_apply);

if (context instanceof MainActivity) {

this.mainActivity = (MainActivity) context;

}

}

private void applyText() {

String topText = this.inputTopImageText.getText().toString();

String bottomText = this.inputBottomImageText.getText().toString();

public class BottomFragment extends Fragment {

private TextView topText;

private TextView bottomText;

// Đọc file xml tạo ra đối tượng View

// inflate(@LayoutRes int resource, @Nullable ViewGroup root, booleanattachToRoot)

View view = inflater.inflate(R.layout.activity_bottom, container, false);

topText = (TextView) view.findViewById(R.id.top_image_text);

bottomText = (TextView) view.findViewById(R.id.bottom_image_text);

return view;

}

public void showText(String topImageText, String bottomImageText) { topText.setText(topImageText);

bottomText.setText(bottomImageText);

}

}

Chạy ứng dụng: