Fragment (b)

TK2323 Mobile Programming

Sem 1 2020/2021

Lam Meng Chun

lammc@ukm.edu.my (G-02-04)
2 Why you need Fragment

▹ Combine several fragments

in a single activity
▹ Reuse the same Fragment
across different activity
▹ Make better use of larger
screen space on tablets
▹ Fixed/Scrolling/Swipe tab
displays
3

MasterBeverageFragment BeverageDetailFragment
Main Activity Detail Activity
4

MasterBeverageFragment, BeverageDetailFragment
Main Activity
 Create Fragment

5
 MasterBeverageFragment
6
 BeverageDetailFragment

7
 Activity
HoldFragment
(Single Pane)

8
9

MainAcivity
10

DetailActivit
y
11

DetailActivit
y
<androidx.constraintlayout.widget.ConstraintLayout . . .

<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline“ . . .

app:layout_constraintGuide_percent="0.5" />

<fragment
android:id="@+id/fragment"
android:name="com.lmc.playfragment.MasterBeverageFragment"
. . ./>

<FrameLayout
android:id="@+id/fragmentContainer“ . . .
</FrameLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
 Communication Between
Fragment (Single Pane)

12
 MasterBeverage DetailActivity

public interface OnBeverageClickListener{

void onBeverageSelected(int img, String name);
13 }
FragmentManager fragmentManager = getSupportFragmentManager();
lvBeverage.setOnItemClickListener…{ if(savedInstanceState == null) {
beverageDetailFragment.setBeverageImg(getIntent().getIntExtra(BUNDLE_IMAGE,
mCallback.onBeverageSelected(beverageImageArray[i], 0));
beverageName);
} beverageDetailFragment.setBeverageName(getIntent().getStringExtra(BUNDLE_NAME));
fragmentManager.beginTransaction()
MainActivity .replace(R.id.fragmentContainer, beverageDetailFragment)
.commit();
public class MainActivity extends AppCompatActivity }
implements
MasterBeverageFragment.OnBeverageClickListener

@Override
public void onBeverageSelected(int imgFromFragment,
String nameFromFragment)
{
beverageImg = imgFromFragment;
beverageName = nameFromFragment;}

Bundle bundle = new Bundle();

bundle.putInt(BUNDLE_IMAGE, beverageImg);
bundle.putString(BUNDLE_NAME, beverageName);

final Intent intent = new Intent(MainActivity.this,

DetailActivity.class);
intent.putExtras(bundle);
startActivity(intent);
 TwoPane

14
15

MasterBeverageFragment, BeverageDetailFragment
Main Activity
16

DetailActivit
y
<androidx.constraintlayout.widget.ConstraintLayout . . .

<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline“ . . .

app:layout_constraintGuide_percent="0.5" />

<fragment
android:id="@+id/fragment"
android:name="com.lmc.playfragment.MasterBeverageFragment"
. . ./>

<FrameLayout
android:id="@+id/fragmentContainer“ . . .
</FrameLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
17 Detect two pane
 Communication Between
Fragment (TwoPane)

18
 MasterBeverage MainActivity

public interface OnBeverageClickListener{

void onBeverageSelected(int img, String name); public class MainActivity extends AppCompatActivity implements
19 }
MasterBeverageFragment.OnBeverageClickListener
lvBeverage.setOnItemClickListener…{ @Override
public void onBeverageSelected(int imgFromFragment, String
mCallback.onBeverageSelected(beverageImageArray[i],
beverageName); nameFromFragment)
} {

beverageImg = imgFromFragment;
beverageName = nameFromFragment;

if (mTwoPane) {
FragmentManager fragmentManager = getSupportFragmentManager();
BeverageDetailFragment beverageDetailFragment = new
BeverageDetailFragment();

beverageDetailFragment.setBeverageImg(beverageImg);
beverageDetailFragment.setBeverageName(beverageName);

fragmentManager.beginTransaction()
.replace(R.id. fragmentContainer , beverageDetailFragment)
.commit();
}