Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Android-Fragment的基本用法 #11

Open
jeffrey1995 opened this issue Jul 18, 2016 · 0 comments
Open

Android-Fragment的基本用法 #11

jeffrey1995 opened this issue Jul 18, 2016 · 0 comments

Comments

@jeffrey1995
Copy link
Owner

今天来探讨一下Fragment的基本用法,先来认识一下Fragment:

什么是Fragment?

Android运行在各种各样的设备中,有小屏幕的手机,超大屏的平板甚至电视。针对屏幕尺寸的差距,很多情况下,都是先针对手机开发一套App,然后拷贝一份,修改布局以适应平板神马超级大屏的。难道无法做到一个App可以同时适应手机和平板么,当然了,必须有啊。Fragment的出现就是为了解决这样的问题。你可以把Fragment当成Activity的一个界面的一个组成部分,甚至Activity的界面可以完全有不同的Fragment组成,更帅气的是Fragment拥有自己的生命周期和接收、处理用户的事件,这样就不必在Activity写一堆控件的事件处理的代码了。更为重要的是,你可以动态的添加、替换和移除某个Fragment。

Fragment的生命周期

Fragment依存Activity存在,Activity的生命周期对Fragmentyou直接的影响。
image

下面我来介绍Fragment的一种简单用法——做Tab分页。

场景是这样:我要做一个通过点击底部的Tab标签切换上部分的页面。
构建代码:

1.界面设计:

主界面:

<LinearLayout
    android:id="@+id/main_foot_ll"
    android:layout_width="match_parent"
    android:layout_height="55dp"
    android:layout_alignParentBottom="true"
    android:orientation="horizontal">

    <LinearLayout
        android:id="@+id/forward_ll"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/forward_iv"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:layout_gravity="center"
            android:layout_marginTop="3dp"
            android:background="@drawable/tab_btn_forward" />

        <TextView
            android:id="@+id/forward_tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginTop="3dp"
            android:text="转发"
            android:textSize="16sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/invitation_ll"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/invitation_iv"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:layout_gravity="center"
            android:layout_marginTop="3dp"
            android:background="@drawable/tab_btn_invite" />

        <TextView
            android:id="@+id/invitation_tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginTop="3dp"
            android:text="邀请"
            android:textSize="16sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/mine_ll"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/mine_iv"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:layout_gravity="center"
            android:layout_marginTop="3dp"
            android:background="@drawable/tab_btn_me" />

        <TextView
            android:id="@+id/mine_tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginTop="3dp"
            android:text="我的"
            android:textSize="16sp" />
    </LinearLayout>

</LinearLayout>


<LinearLayout
    android:id="@+id/main_content_ll"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@id/main_foot_ll"
    android:orientation="vertical"></LinearLayout>

image
主页面主要分为两部分,下面三个Tab标签,上边的一个待填充的布局。

三个子界面:
fragment_forward.xml:




image
同理,创建其他两个布局,分别是fragment_invitation.xml和fragment_mine.xml.

2.创建Fragment,与界面关联。

以一个为例,其余两个同理。
public class ForwardFragment extends Fragment {
@nullable
@OverRide
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_forward,null);
return view;
}
}
image
创建好三个Fragment类与其布局文件相关联。

3.在Activity中创建FragmentManager管理Fragment实例。

public class MainActivity extends AppCompatActivity implements View.OnClickListener{
private LinearLayout forward_ll, invitation_ll, mine_ll;
private Fragment currentFragment, forwardFragment, invitationFragment, mineFragment;
private FragmentManager mFragmentManager;
@OverRide
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
getFragment();
findView();
}

/**
 * 实例化Fragment
 */
private void getFragment() {
    forwardFragment = new ForwardFragment();
    invitationFragment = new InvitationFragment();
    mineFragment = new MineFragment();
    mFragmentManager = getFragmentManager();
    if (mFragmentManager.beginTransaction().isEmpty()) {
        mFragmentManager.beginTransaction().add(R.id.main_content_ll, forwardFragment).commit();
    }
    currentFragment = forwardFragment;
}

/**
 * 切换fragment
 * @param from
 * @param to
 */
public void switchContent(Fragment from, Fragment to) {
    FragmentTransaction transaction = mFragmentManager.beginTransaction();
    if (currentFragment != to) {
        currentFragment = to;
        if (!to.isAdded()) {    // 先判断是否被add过
            transaction.hide(from);
            transaction.add(R.id.main_content_ll, to);
            transaction.commit(); // 隐藏当前的fragment,add下一个到Activity中
        } else {
            transaction.hide(from); // 隐藏当前的fragment,显示下一个
            transaction.show(to);
            transaction.commit();
        }
    }
}

private void findView() {
    forward_ll = (LinearLayout) findViewById(R.id.forward_ll);
    invitation_ll = (LinearLayout) findViewById(R.id.invitation_ll);
    mine_ll = (LinearLayout) findViewById(R.id.mine_ll);

    forward_ll.setOnClickListener(this);
    invitation_ll.setOnClickListener(this);
    mine_ll.setOnClickListener(this);
}

@Override
public void onClick(View view) {
    switch (view.getId()) {
        case R.id.forward_ll:
            switchContent(currentFragment,forwardFragment);
            break;
        case R.id.invitation_ll:
            switchContent(currentFragment,invitationFragment);
            break;
        case R.id.mine_ll:
            switchContent(currentFragment,mineFragment);
            break;
    }
}

}
通过getFragment()创建fragment实例,通过FragmentManager对应当前布局与Fragment的关系,并指定当前显示的Fragment。
通过switchContent(Fragment from,Fragment to)来实现Fragment的切换,也就是决定当前显示的Fragment。
这样我们就可以通过点击下边的Tab标签来切换当前的Fragment了。
如果想对Fragment内部的控件进行操作,可以在对应的java文件中做处理,这样起到了很大的解耦作用。

结语:这只是Fragment的一种简单的用法,当然还有很多种用法可以去学习。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant