侧拉+TabLayout

其他 2018-11-22 13:33:10 阅读次数: 0

1.activity_main.xml布局页面包括主页面内容和侧拉页面FrameLayout为侧拉页面占位布局

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/draw"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/bottom_indicator"
        android:layout_alignParentBottom="true"
        app:tabTextColor="@color/colorPrimary"
        app:tabSelectedTextColor="@color/colorAccent"
        app:tabIndicatorColor="@android:color/transparent"
        app:tabIndicatorHeight="1dp"
        >
    </android.support.design.widget.TabLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/v_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/bottom_indicator"
        >
    </android.support.v4.view.ViewPager>
</RelativeLayout>
    <FrameLayout
        android:id="@+id/left_drawer"
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#fff"
        >
    </FrameLayout>

</android.support.v4.widget.DrawerLayout>

2.侧拉页面需要一个fragment布局页面

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <ListView
        android:id="@+id/menus"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        >

    </ListView>
</android.support.constraint.ConstraintLayout>

3.侧拉的fragment页面

package com.example.Fragment;

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ListView;

import com.example.Adaper.LeftMenuAdaper;
import com.example.day12_tablayout01.MainActivity;
import com.example.day12_tablayout01.R;

public class LeftFragment extends Fragment {

    private ListView listView;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.leftfragment,container,false);
    }

    @Override
    public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        //获取资源id
        listView = view.findViewById(R.id.menus);
        //设置适配器
        listView.setAdapter(new LeftMenuAdaper(getActivity()));
        //点击跳转
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                //图片不可以点击
                if(position==0){
                    return;
                }
                ((MainActivity)getActivity()).showPage(position-1);
            }
        });
        super.onViewCreated(view, savedInstanceState);
    }
}

4.MainActivity页面加载侧拉和Tablayout切换fragment

package com.example.day12_tablayout01;

import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Gravity;
import android.view.MenuItem;
import android.widget.ListView;

import com.example.Adaper.MinePageAdaper;
import com.example.Fragment.LeftFragment;

public class MainActivity extends AppCompatActivity {

    private DrawerLayout layout;
    private ActionBarDrawerToggle toggle;
    private ViewPager viewPager;
    private TabLayout tabLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //为空才添加fragment：
        if (savedInstanceState == null) {
            getSupportFragmentManager().beginTransaction()
                    .add(R.id.left_drawer, new LeftFragment())
                    .commit();
            //初始化view
            initView();
        }
    }

    //初始化view
    private void initView() {
        //允许标题栏展示左边icon
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        //获取资源id
        layout = findViewById(R.id.draw);
        //actionbar和drawerlayout中间人
        toggle = new ActionBarDrawerToggle(this, layout, R.string.open_drawer, R.string.close_drawer);
        layout.addDrawerListener(toggle);
        toggle.syncState();
        //获取资源id
        viewPager = findViewById(R.id.v_pager);
        //绑定adaper
        viewPager.setAdapter(new MinePageAdaper(getSupportFragmentManager()));
        //获取资源id
        tabLayout = findViewById(R.id.bottom_indicator);
        tabLayout.setupWithViewPager(viewPager);
    }
     //点击切换
    public void showPage(int position){
        viewPager.setCurrentItem(position);
        layout.closeDrawer(Gravity.START);
    }
    //支持点击
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if(toggle.onOptionsItemSelected(item)){
            return true;
        }
        return super.onOptionsItemSelected(item);
    }


}

5.侧拉页面的适配器 多条目展示侧拉

package com.example.Adaper;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import com.example.day12_tablayout01.R;

public class LeftMenuAdaper extends BaseAdapter {
    private String[] menus = new String[]{
            "首页", "视频", "我的"
    };
    private Context mContext;

    public LeftMenuAdaper(Context mContext) {
        this.mContext = mContext;
    }

    private final int ITEM_COUNT = 2;
    private final int IMAGE_TYPE = 0;
    private final int TEXT_TYPE = 1;
    @Override
    public int getCount() {
        return menus.length + 1;
    }

    @Override
    public int getViewTypeCount() {
        return ITEM_COUNT;
    }

    @Override
    public int getItemViewType(int position) {
        return position==0?IMAGE_TYPE:TEXT_TYPE;
    }

    @Override
    public String getItem(int position) {
        //预防position ==0的情况
        if (position == 0) {
            return null;
        }
        return menus[position - 1];
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder =null;
        if (convertView == null){
            convertView = LayoutInflater.from(mContext).inflate(
                    getItemViewType(position)==IMAGE_TYPE? R.layout.menuimageitem:R.layout.menutextitem
                    ,parent,false);
            holder = new ViewHolder(convertView);
        }
        if(getItemViewType(position) == TEXT_TYPE){
            holder.bind(getItem(position));
        }
        return convertView;
    }
    //创建寄存器
    class ViewHolder{
        ImageView image;
        TextView text;
        //获取资源id
        public ViewHolder(View convertView) {
            image = convertView.findViewById(R.id.image_menus);
            text = convertView.findViewById(R.id.menu_text);
            convertView.setTag(this);
        }
        //赋值
        public void bind(String item) {
            text.setText(item);
        }
    }
}

6.侧拉多条目展示的两个布局一个布局为头像一个为条目

6.1头像布局
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <ImageView
        android:id="@+id/image_menus"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:src="@mipmap/ic_launcher"
        />
</android.support.constraint.ConstraintLayout>
6.2.条目布局
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/menu_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="20dp"
        />
</android.support.constraint.ConstraintLayout>

7.Tablayout切换fragment的适配器

package com.example.Adaper;

import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import com.example.Fragment.HomeFragment;
import com.example.Fragment.MineFragment;
import com.example.Fragment.VideoFragment;

public class MinePageAdaper extends FragmentPagerAdapter {
    private String[] menus = new String[]{
            "首页", "视频", "我的"
    };
    public MinePageAdaper(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int i) {
        switch (i){
            case 0:
                return new HomeFragment();
            case 1:
                return new VideoFragment();
            case 2:
                return new MineFragment();
                default:
                    return new Fragment();
        }
    }

    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return menus[position];
    }

    @Override
    public int getCount() {
        return menus.length;
    }
}

8.fragment嵌套fragment 实现tablayout切换fragment fragment页面

package com.example.Fragment;

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.example.Adaper.HomeAdaper;
import com.example.day12_tablayout01.R;

public class HomeFragment extends Fragment {

    private TabLayout tabLayout;
    private ViewPager viewPager;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.home_fragment,container,false);
    }

    @Override
    public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        tabLayout = view.findViewById(R.id.top_indicator);
        viewPager = view.findViewById(R.id.v_viewpage);
        //设置适配器
        ////////////////////////////
        viewPager.setAdapter(new HomeAdaper(getChildFragmentManager()));
        tabLayout.setupWithViewPager(viewPager);
        super.onViewCreated(view, savedInstanceState);
    }
}

9.fragment嵌套fragment 布局页面``

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <android.support.design.widget.TabLayout
        android:id="@+id/top_indicator"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:tabMode="scrollable"
        >
    </android.support.design.widget.TabLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/v_viewpage"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/top_indicator"
        app:layout_constraintBottom_toBottomOf="parent"
        >
    </android.support.v4.view.ViewPager>
</android.support.constraint.ConstraintLayout>

10.fragment嵌套fragment 实现tablayout切换fragment 适配器页面

package com.example.Adaper;

import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import com.example.Fragment.BeijingFragment;
import com.example.Fragment.HoutFragment;
import com.example.Fragment.RecoFragment;
import com.example.Fragment.RecreationFragment;
import com.example.Fragment.SmallFragment;
import com.example.Fragment.VidFragment;

public class HomeAdaper extends FragmentPagerAdapter {
    private String[] pageNames = new String[]{
            "推荐","小视频","视频","热点","北京","娱乐"
    };
    public HomeAdaper(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int i) {
        switch (i){
            case 0:
                return new RecoFragment();
            case 1:
                return new SmallFragment();
            case 2:
                return new VidFragment();
            case 3:
                return new HoutFragment();
            case 4:
                return new BeijingFragment();
            case 5:
                return new RecreationFragment();
                default:
                    return new Fragment();
        }

    }

    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return pageNames[position];
    }

    @Override
    public int getCount() {
        return pageNames.length;
    }
}

猜你喜欢

转载自blog.csdn.net/guoxinyu1207/article/details/84000339
今日推荐
中国码农的“35岁魔咒”
蘭雅 CorelDRAW 插件 2024.5.1 国际劳动节版，免费下载
Arc Browser for Windows 1.0 正式 GA
90后程序员开发视频搬运软件、不到一年获利超 700 万，结局很刑！
《美国对全球网络空间安全与发展的威胁和破坏》报告发布
周排行
[编程题]学英语
[codeforces 1288A] Deadline 约数+模
Python的web开发
Docker在Centos 7上的部署
python编码
解决Ubuntu16.04 fatal error: json/json.h: No such file or directory
mysql并发插入
rest接口如何适应jsonp的方案
linux 终端上网设置
高数——等号两边同时求导、积分的解释
每日归档
更多
2024-05-04(7)
2024-05-03(19)
2024-05-02(0)
2024-05-01(4)
2024-04-30(1)
2024-04-29(40)
2024-04-28(0)
2024-04-27(56)
2024-04-26(39)
2024-04-25(22)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022