zoukankan      html  css  js  c++  java
  • Fragment创建添加切换和对应底部导航(二)

    目标:可以滑动Fragment来导航。

    原来是通过FragmentManager添加Fragment后,show和hide来显示和隐藏Fragment。

    这里使用Viewpager和FragmentPagerAdapter来实现。

    把activity_main.xml中的FrameLayout改成ViewPager

        <android.support.v4.view.ViewPager
            android:id="@+id/viewPager"
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp">
            
        </android.support.v4.view.ViewPager>

    全部activity_main.xml文件代码

    <?xml version="1.0" encoding="utf-8"?>
    <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">
    
        <android.support.v4.view.ViewPager
            android:id="@+id/viewPager"
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp">
            
        </android.support.v4.view.ViewPager>
    
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="55dp">
    
            <View
                android:layout_width="wrap_content"
                android:layout_height="1dp"
                android:background="?android:listDivider"
                />
            <LinearLayout
                android:layout_width="match_parent"
                android:orientation="horizontal"
                android:background="@android:color/white"
                android:layout_height="54dp">
    
                <LinearLayout
                    android:id="@+id/ll_home"
                    android:layout_width="0dp"
                    android:padding="4dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:orientation="vertical">
    
                    <ImageView
                        android:id="@+id/iv_home"
                        android:layout_width="28dp"
                        android:layout_height="28dp"
                        android:src="@drawable/bid02"
                        tools:ignore="ContentDescription" />
    
                    <TextView
                        android:id="@+id/tv_home"
                        android:textColor="@color/home_back_unselected"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="首页"
                        android:layout_marginTop="2dp"
                        android:textSize="14sp"/>
                </LinearLayout>
                <LinearLayout
                    android:id="@+id/ll_invest"
                    android:layout_width="0dp"
                    android:padding="4dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:orientation="vertical">
    
                    <ImageView
                        android:id="@+id/iv_invest"
                        android:layout_width="28dp"
                        android:layout_height="28dp"
                        android:src="@drawable/bid04" />
    
                    <TextView
                        android:id="@+id/tv_invest"
                        android:textColor="@color/home_back_unselected"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="二页"
                        android:layout_marginTop="2dp"
                        android:textSize="14sp"/>
                </LinearLayout>
                <LinearLayout
                    android:id="@+id/ll_me"
                    android:layout_width="0dp"
                    android:padding="4dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:orientation="vertical">
    
                    <ImageView
                        android:id="@+id/iv_me"
                        android:layout_width="28dp"
                        android:layout_height="28dp"
                        android:src="@drawable/bid06" />
    
                    <TextView
                        android:id="@+id/tv_me"
                        android:textColor="@color/home_back_unselected"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="三页"
                        android:layout_marginTop="2dp"
                        android:textSize="14sp"/>
                </LinearLayout>-
                <LinearLayout
                    android:id="@+id/ll_more"
                    android:layout_width="0dp"
                    android:padding="4dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:orientation="vertical">
    
                    <ImageView
                        android:id="@+id/iv_more"
                        android:layout_width="28dp"
                        android:layout_height="28dp"
                        android:src="@drawable/bid08" />
    
                    <TextView
                        android:id="@+id/tv_more"
                        android:textColor="@color/home_back_unselected"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="四页"
                        android:layout_marginTop="2dp"
                        android:textSize="14sp"/>
                </LinearLayout>
    
            </LinearLayout>
            </LinearLayout>
    </LinearLayout>
    View Code

    在MainActivity中,获取ViewPager对象

    @BindView(R.id.viewPager)
    ViewPager viewPager;

    InitFragments函数去掉FragmentManager添加的代码,使用适配器。

        private void InitFragments() {
            fragments.clear();
    
            if (fragmentA == null) {
                fragmentA = new FragmentA();
            }
            if (fragmentB == null) {
                fragmentB = new FragmentB();
            }
            if (fragmentC == null) {
                fragmentC = new FragmentC();
            }
            if (fragmentD == null) {
                fragmentD = new FragmentD();
            }
            fragments.add(fragmentA);
            fragments.add(fragmentB);
            fragments.add(fragmentC);
            fragments.add(fragmentD);
    
            TabPageAdapter adapter = new TabPageAdapter(getSupportFragmentManager(), fragments);
            viewPager.setAdapter(adapter);
            //滑动响应接口实现
            viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
                @Override
                public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
    
                }
    
                @Override
                public void onPageSelected(int position) {
                    selectNavigation(position);
                }
    
                @Override
                public void onPageScrollStateChanged(int state) {
    
                }
            });
        }

    适配器类的代码

        class TabPageAdapter extends FragmentPagerAdapter {
            private List<Fragment> fragments;
            public TabPageAdapter(FragmentManager fm,List<Fragment> fragments) {
                super(fm);
                this.fragments=fragments;
            }
    
            @Override
            public Fragment getItem(int position) {
                return fragments.get(position);
            }
    
            @Override
            public int getCount() {
                return fragments.size();
            }
    
            @Override
            public void destroyItem(ViewGroup container, int position, Object object) {
                super.destroyItem(container, position, object);
            }
        }

    selectNavigaton也需要对切换Fragment,原来显示和隐藏Fragment,现在不适用了,改成

    viewPager.setCurrentItem(page,true);

    MainActivity全部代码

    package com.utopia.testfragment;
    
    import android.os.Bundle;
    import android.support.v4.app.Fragment;
    import android.support.v4.app.FragmentActivity;
    import android.support.v4.app.FragmentManager;
    import android.support.v4.app.FragmentPagerAdapter;
    import android.support.v4.view.ViewPager;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ImageView;
    import android.widget.LinearLayout;
    import android.widget.TextView;
    
    import java.util.ArrayList;
    import java.util.List;
    
    import butterknife.BindView;
    import butterknife.ButterKnife;
    import butterknife.OnClick;
    
    public class MainActivity extends FragmentActivity {
    
    
        FragmentA fragmentA;
        FragmentB fragmentB;
        FragmentC fragmentC;
        FragmentD fragmentD;
        List<Fragment> fragments = new ArrayList<Fragment>();
    
        @BindView(R.id.iv_home)
        ImageView ivHome;
        @BindView(R.id.tv_home)
        TextView tvHome;
        @BindView(R.id.ll_home)
        LinearLayout llHome;
        @BindView(R.id.iv_invest)
        ImageView ivInvest;
        @BindView(R.id.tv_invest)
        TextView tvInvest;
        @BindView(R.id.ll_invest)
        LinearLayout llInvest;
        @BindView(R.id.iv_me)
        ImageView ivMe;
        @BindView(R.id.tv_me)
        TextView tvMe;
        @BindView(R.id.ll_me)
        LinearLayout llMe;
        @BindView(R.id.iv_more)
        ImageView ivMore;
        @BindView(R.id.tv_more)
        TextView tvMore;
        @BindView(R.id.ll_more)
        LinearLayout llMore;
        @BindView(R.id.viewPager)
        ViewPager viewPager;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            ButterKnife.bind(this);
            InitFragments();
            System.out.println("init DONE....................");
            selectNavigation(0);
    
    
        }
    
        @OnClick({R.id.ll_home, R.id.ll_invest, R.id.ll_me, R.id.ll_more})
        public void changeTab(View view) {
            switch (view.getId()) {
                case R.id.ll_home:
                    selectNavigation(0);
                    break;
                case R.id.ll_invest:
                    selectNavigation(1);
                    break;
                case R.id.ll_me:
                    selectNavigation(2);
                    break;
                case R.id.ll_more:
                    selectNavigation(3);
                    break;
            }
        }
    
        /***
         * 初始化:创建Fragment,添加到FrameLayout 中(R.id.content),并且添加到链表fragmetns中
         *
         */
        private void InitFragments() {
            fragments.clear();
    
            if (fragmentA == null) {
                fragmentA = new FragmentA();
            }
            if (fragmentB == null) {
                fragmentB = new FragmentB();
            }
            if (fragmentC == null) {
                fragmentC = new FragmentC();
            }
            if (fragmentD == null) {
                fragmentD = new FragmentD();
            }
            fragments.add(fragmentA);
            fragments.add(fragmentB);
            fragments.add(fragmentC);
            fragments.add(fragmentD);
    //        for (Fragment frag : fragments) {
    //            if (!frag.isAdded()) {
    //                getSupportFragmentManager().beginTransaction().add(R.id.content, frag).commit();
    //            }
    //        }
            TabPageAdapter adapter = new TabPageAdapter(getSupportFragmentManager(), fragments);
            viewPager.setAdapter(adapter);
            //滑动响应接口实现
            viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
                @Override
                public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
    
                }
    
                @Override
                public void onPageSelected(int position) {
                    selectNavigation(position);
                }
    
                @Override
                public void onPageScrollStateChanged(int state) {
    
                }
            });
        }
    
        private void showFragment(int frag) {
            //首先隐藏所有Fragments
            for (Fragment f : fragments) {
                getSupportFragmentManager().beginTransaction().hide(f).commit();
            }
            //获取当前 序号的fragment
            Fragment current_frag = fragments.get(frag);
            if (current_frag != null) {
                getSupportFragmentManager().beginTransaction().show(current_frag).commit();
    
            }
    
        }
    
        class TabPageAdapter extends FragmentPagerAdapter {
            private List<Fragment> fragments;
            public TabPageAdapter(FragmentManager fm,List<Fragment> fragments) {
                super(fm);
                this.fragments=fragments;
            }
    
            @Override
            public Fragment getItem(int position) {
                return fragments.get(position);
            }
    
            @Override
            public int getCount() {
                return fragments.size();
            }
    
            @Override
            public void destroyItem(ViewGroup container, int position, Object object) {
                super.destroyItem(container, position, object);
            }
        }
    
        private void selectNavigation(int page) {
            //相关图片,字体变成灰色
            ivHome.setImageResource(R.drawable.bid02);
            ivInvest.setImageResource(R.drawable.bid04);
            ivMe.setImageResource(R.drawable.bid06);
            ivMore.setImageResource(R.drawable.bid08);
            tvHome.setTextColor(getResources().getColor(R.color.home_back_unselected));
            tvInvest.setTextColor(getResources().getColor(R.color.home_back_unselected));
            tvMe.setTextColor(getResources().getColor(R.color.home_back_unselected));
            tvMore.setTextColor(getResources().getColor(R.color.home_back_unselected));
    
    
            switch (page) {
                case 0:
                    ivHome.setImageResource(R.drawable.bid01);
                    tvHome.setTextColor(getResources().getColor(R.color.home_back_selected_green));
                    break;
                case 1:
                    ivInvest.setImageResource(R.drawable.bid03);
                    tvInvest.setTextColor(getResources().getColor(R.color.home_back_selected_green));
                    break;
                case 2:
                    ivMe.setImageResource(R.drawable.bid05);
                    tvMe.setTextColor(getResources().getColor(R.color.home_back_selected_green));
                    break;
                case 3:
                    ivMore.setImageResource(R.drawable.bid07);
                    tvMore.setTextColor(getResources().getColor(R.color.home_back_selected_green));
                    break;
            }
    
            // 选择导航的时候,同时选择Fragment
            //showFragment(page);
            viewPager.setCurrentItem(page,true);
        }
    
    
    }
    MainActivity代码
  • 相关阅读:
    jQuery选择器ID、CLASS、标签获取对象值、属性、设置css样式
    shell脚本,awk取奇数行与偶数行方法。
    shell脚本,awk取中间列的方法。
    shell脚本,每5个字符之间插入"|",行末不插入“|”。
    shell脚本,tee小工具的用法。
    shell脚本,逻辑结构题练习。
    shell脚本,实现奇数行等于偶数行。
    shell脚本,编程题练习。
    shell脚本,用awk实现替换文件里面的内容。
    shell脚本,awk替换{}里面的内容
  • 原文地址:https://www.cnblogs.com/legion/p/10025533.html
Copyright © 2011-2022 走看看