ViewPager+ListView（简单实现）
为了方便采用ListView作为演示，此次内导航填充的是头条小标题框的内部列表，效果如下
实现： 刚开始理解起来比较艰难，对于添加一个listView控件并不麻烦，版本问题始终还是一个值得吐槽的诟病。
步骤：
- 创建一个Array类，继承Fragment，具体代码如下
package com.example.delete_demo;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AlertDialog;
import androidx.fragment.app.Fragment;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import java.util.ArrayList;
public class Array extends Fragment {
/// 存放传回的信息
String[] news;
/// 存放列表数据
ArrayList<String> datas = new ArrayList<>();
// 存放的详细数据，作为后面的弹出信息
public String[] info = {"111","222","333","444"};
public static Array get_list(String []s)
{
/*
实际由于要返回一个fragment所以才多绕一步，创建该函数，由于列表的创建，搭配适配器，
连接监听器都需要依靠onCreate和onCreateView方法,创建完成后又需要把实例化碎片传回，但onCreate和onCreateView方法
返回值都不是一个实例化对象，所以需要该方法作为一个媒介。
*/
/// 回传数据到下方
Bundle bundle = new Bundle();
bundle.putStringArray("news",s);
/// 直接创建实例对象，目的是自动调用下方的函数，添加列表项并且设置监听
Array fragment = new Array();
/// 数据传递到下方
fragment.setArguments(bundle);
return fragment;
}
public Array(){}
@Override
public void onCreate(Bundle savedInstanceState) {
// System.out.println("3");
super.onCreate(savedInstanceState);
try {
// 接收来自上方的信息
Bundle bundle = getArguments();
news = bundle.getStringArray("news");
} catch (java.lang.NullPointerException e) {
// 没有接收到显示报错
System.out.println("TestFragment getArg error!");
}
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.activity_list, container, false);
ListView l = (ListView) view.findViewById(android.R.id.list);
for (int i = 0; i < 100; i++) {
datas.add(news[i%4]);
}
ArrayAdapter <String> adapter = new ArrayAdapter<String>(getContext(),
android.R.layout.simple_list_item_1,datas);
l.setAdapter(adapter);
l.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
// Toast.makeText(getContext(),info[position%4],
// Toast.LENGTH_LONG).show();
new AlertDialog.Builder(getContext())
.setTitle("详细内容")
.setMessage(info[position%4])
.setPositiveButton("确定", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
}
}).show();
};
});
return view;
}
}
2.创建一个新的布局文件，作为列表碎片，我这里是activity_list.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
tools:context=".Array">
<ListView
android:id="@android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
- 在获取碎片的方法之中添加我们的列表碎片
public Fragment getItem(int idx) {
if (idx==1)
{
return Array.get_list(news);
}
// Log.e("NewsPageFragmentAdapter","getItem"+idx);
String newsCategoryTitle = channelList[idx];
/// 获取当前的item，并色绘制对应的文本信息
// System.out.println("6");
return NewsChannelFragment.newInstance(newsCategoryTitle);
}
注意点： activity_list.xml之中由于版本问题，官方给出的id是android:id="@android:id/list"
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
tools:context=".Array">
<ListView
android:id="@android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
另外为了防止点击事件被父容器所拦截，需要自己重写onInterceptTouchEvent方法。
// 自定义跳过拦截
private float xDistance, yDistance, xLast, yLast;
private int mMaxHeight;
public boolean onInterceptTouchEvent(MotionEvent ev) {
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
xDistance = yDistance = 0f;
xLast = ev.getX();
yLast = ev.getY();
break;
case MotionEvent.ACTION_MOVE:
final float curX = ev.getX();
final float curY = ev.getY();
xDistance += Math.abs(curX - xLast);
yDistance += Math.abs(curY - yLast);
xLast = curX;
yLast = curY;
if (xDistance > yDistance && xDistance > 10) {
return true;
}
}
return onInterceptTouchEvent(ev);
}
完整代码
框架图
主界面 MainActivity.java
package com.example.delete_demo;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentTransaction;
import android.os.Bundle;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.ImageButton;
import android.widget.LinearLayout;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private List<Fragment> myFragment;
private LinearLayout Home;
private LinearLayout Explore;
private LinearLayout Statistic;
private LinearLayout Settings;
private FrameLayout frameLayout;
//四个Tab对应的ImageButton
private ImageButton ImgHome;
private ImageButton ImgExplore;
private ImageButton ImgStatistic;
private ImageButton ImgSettings;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initFragment();
init();
init_listener();
initFirstRun(0);
}
public void init() {
frameLayout = (FrameLayout)findViewById(R.id.frag1);
Home = (LinearLayout) findViewById(R.id.lay1);
Explore = (LinearLayout) findViewById(R.id.lay2);
Statistic = (LinearLayout) findViewById(R.id.lay3);
Settings = (LinearLayout) findViewById(R.id.lay4);
ImgHome = (ImageButton) findViewById(R.id.btn1);
ImgExplore = (ImageButton) findViewById(R.id.btn2);
ImgStatistic = (ImageButton) findViewById(R.id.btn3);
ImgSettings = (ImageButton) findViewById(R.id.btn4);
}
public void init_listener() {
Home.setOnClickListener(mylistener);
Explore.setOnClickListener(mylistener);
Statistic.setOnClickListener(mylistener);
Settings.setOnClickListener(mylistener);
ImgHome.setOnClickListener(mylistener);
ImgExplore.setOnClickListener(mylistener);
ImgStatistic.setOnClickListener(mylistener);
ImgSettings.setOnClickListener(mylistener);
}
View.OnClickListener mylistener = new View.OnClickListener() {
@Override
public void onClick(View view) {
resetImgs();
System.out.println("6");
// System.out.println("1");
switch (view.getId()) {
case R.id.lay1:
select(0);
break;
case R.id.lay2:
select(1);
break;
case R.id.lay3:
select(2);
break;
case R.id.lay4:
select(3);
break;
case R.id.btn1:
select(0);
break;
case R.id.btn2:
select(1);
break;
case R.id.btn3:
select(2);
break;
case R.id.btn4:
select(3);
break;
}
}
};
public void resetImgs() {
ImgHome.setImageResource(R.drawable.ic_baseline_home_24);
ImgExplore.setImageResource(R.drawable.ic_baseline_explore_24);
ImgStatistic.setImageResource(R.drawable.ic_baseline_call_to_action_24);
ImgSettings.setImageResource(R.drawable.ic_baseline_settings_24);
System.out.println("5");
}
public void select(int id) {
switch (id) {
case 0:
ImgHome.setImageResource(R.drawable.ic_baseline_home_click_24);
break;
case 1:
ImgExplore.setImageResource(R.drawable.ic_baseline_explore_click_24);
break;
case 2:
ImgStatistic.setImageResource(R.drawable.ic_baseline_call_to_action_click_24);
break;
case 3:
ImgSettings.setImageResource(R.drawable.ic_baseline_settings_click_24);
break;
}
set_view(id);
System.out.println("4");
// System.out.println(122);
}
public void initFragment() {
myFragment = new ArrayList<>();
myFragment.add(new HomeFragment());
myFragment.add(new ExploreFragment());
myFragment.add(new StatisticsFragment());
myFragment.add(new SettingsFragment());
System.out.println("3");
}
public void set_view(int i) {
FragmentManager f = getSupportFragmentManager();
FragmentTransaction tran = f.beginTransaction();
tran.replace(R.id.frag1, myFragment.get(i));
tran.commit();
System.out.println("1");
}
private void initFirstRun(int i) {
resetImgs(); //重置所有Tab
select(i); //显示第i个碎片
System.out.println("2");
}
}
主界面布局 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<FrameLayout
android:id="@+id/frag1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</FrameLayout>
<include layout="@layout/activity_button"/>
</LinearLayout>
导航栏 1 HomeFragment.java
package com.example.delete_demo;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
import android.widget.ListView;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.ListFragment;
import androidx.viewpager.widget.ViewPager;
/*
viewpager是一个允许使用者自由滑动的页面布局管理器
PagerAdapter重写的方法基类，需要重构四个方法
由于底部导航采用的是Fragment直接实现，内部导航采用viewPager，考虑到实际的使用体验
上下两段均可滑动实际可能造成端口冲突。
*/
public class HomeFragment extends Fragment implements ViewPager.OnPageChangeListener{
private static final String ARG_CHANNEL_LIST = "channel_list";
// 实例化视图对象
private View view = null;
// radiogroup容器存放图标
private RadioGroup rgChannel = null;
// viewpager对象
private ViewPager viewPager;
private HorizontalScrollView hvChannel = null;
/// 内部导航的栏目列表
// private String[] channelList = {"关注", "头条", "视频", "长沙", "要闻", "新时代", "娱乐","关注", "头条", "视频", "长沙", "要闻", "新时代", "娱乐"}; //栏目列表
// 内部导航改写为从String.xml之中读取
String[] channelList;
// 重构的adapter
private NewsPageFragmentAdapter adapter;
// 获取滑动宽和高
private float xDistance, yDistance, xLast, yLast;
private int mMaxHeight;
public HomeFragment() {
// Required empty public constructor
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// System.out.println("8");
if (view == null) {
/// 如果当前的页面为空，直接创建该碎片直接放入布局之中，避免重复创建
view = inflater.inflate(R.layout.activity_home_fragment, container, false);
///获取当前显示内导航内部页面
channelList = getResources().getStringArray(R.array.file);
viewPager = (ViewPager) view.findViewById(R.id.vpNewsList);
// 初始化页面
initViewPager();
// 获取内部导航
rgChannel = (RadioGroup) view.findViewById(R.id.rgChannel);
// 内部导航条
hvChannel = (HorizontalScrollView) view.findViewById(R.id.hvChannel);
// 初始化内导航标签
initTab(inflater);
rgChannel.setOnCheckedChangeListener( //单选按钮的监听事件响应
new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
/// 设置当前项目
System.out.println("9");
/// 点击按钮切换到当前的页面
viewPager.setCurrentItem(checkedId);
/// 点击子导航跳转子页面
}
});
}
return view;
}
private void initViewPager() {
// System.out.println("10");
/// 初始化Viewpager
FragmentManager fragmentManager = super.getActivity().getSupportFragmentManager();
/// 加载adapter，参数一为fragment管理器，和栏目列表的list，
adapter = new NewsPageFragmentAdapter(fragmentManager, channelList);
viewPager.setAdapter(adapter);
///获取空的fragment
viewPager.setOffscreenPageLimit(2);
// 往后自动创建的页面个数的限制 例如当前处在第三页，系统会提前创建好第五页
//viewPager.setCurrentItem(0);
/// 添加以下三个方法作为viewpager页面的监听
viewPager.addOnPageChangeListener(this);
}
// 自定义跳过拦截
public boolean onInterceptTouchEvent(MotionEvent ev) {
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
xDistance = yDistance = 0f;
xLast = ev.getX();
yLast = ev.getY();
break;
case MotionEvent.ACTION_MOVE:
final float curX = ev.getX();
final float curY = ev.getY();
xDistance += Math.abs(curX - xLast);
yDistance += Math.abs(curY - yLast);
xLast = curX;
yLast = curY;
if (xDistance > yDistance && xDistance > 10) {
return true;
}
}
return onInterceptTouchEvent(ev);
}
//// 当页面滑动
@Override
public void onPageScrolled(int i, float v, int i1) { ;
}
@Override
//某个碎片被选中时的动作，对应的内导航标签将要滑动到屏幕中央，并且有下划线显示
public void onPageSelected(int i) {
setTab(i); //后面再实现，控制导航栏保持一致
// 手滑，导航栏需要跟着变化
}
@Override
public void onPageScrollStateChanged(int i) {
}
private void initTab(LayoutInflater inflater) {
// System.out.println("11");
for (int i = 0; i < channelList.length; i++) {//以下添加单选按钮的实例到内导航
RadioButton rb = (RadioButton) inflater.inflate(R.layout.tab_rb, null);
rb.setId(i);
rb.setText(channelList[i]);
RadioGroup.LayoutParams params = new
RadioGroup.LayoutParams(RadioGroup.LayoutParams.WRAP_CONTENT,
RadioGroup.LayoutParams.WRAP_CONTENT);
rgChannel.addView(rb, params);
}
/// 创建所有默认的选项···············
rgChannel.check(0); //第一个选项
}
/// 9 7 6 2 1 3 4 12
private void setTab(int idx) {
// System.out.println("12");
/// 查看是第几个被点击了
RadioButton rb = (RadioButton) rgChannel.getChildAt(idx);
/// 当前被选中，切换颜色
rb.setChecked(true);
int left = rb.getLeft();
int width = rb.getMeasuredWidth();
DisplayMetrics metrics = new DisplayMetrics();
super.getActivity().getWindowManager().getDefaultDisplay().getMetrics(metrics);
int screenWidth = metrics.widthPixels;
/// 定位选中位置，滑动条进行滑动
int len = left + width / 2 - screenWidth / 2;
hvChannel.smoothScrollTo(len, 0);
}
}
activity_home_fragment.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"
tools:context=".HomeFragment">
<!-- TODO: Update blank fragment layout -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- 导航标签，包含一个单选按钮组-->
<HorizontalScrollView
android:id="@+id/hvChannel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="@+id/ivShowChannel"
android:scrollbars="none">
<RadioGroup
android:id="@+id/rgChannel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"></RadioGroup>
</HorizontalScrollView>
<!-- 任意数量不能显示时的缩略符号 -->
<ImageView
android:id="@+id/ivShowChannel"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentRight="true"
android:scaleType="fitXY"
android:src="@drawable/d" />
</RelativeLayout>
<androidx.viewpager.widget.ViewPager
android:id="@+id/vpNewsList"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="@drawable/d"
android:layout_weight="1"/>
</LinearLayout>
Home子导航需要自定义适配器NewsPageFragmentAdapter.java
package com.example.delete_demo;
import android.os.Bundle;
import android.util.Log;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentStatePagerAdapter;
import java.util.ArrayList;
import java.util.HashMap;
public class NewsPageFragmentAdapter extends FragmentStatePagerAdapter {
private String[] channelList;
private String[] news = {"拜登重申不支持“台独","十九届六中全会公报发布","中美元首举行视频会晤","俄方回应卫星碎片危及国际空间站"};
private FragmentManager fm;
public NewsPageFragmentAdapter(FragmentManager fm, String[] channelList) {
super(fm);
this.channelList = channelList;
this.fm=fm;
System.out.println("5");
}
/// 下方的两个方法必须实现
@Override
/// 虚函数，函数的目的就是为了生成新的Fragment对象
public Fragment getItem(int idx) {
if (idx==1)
{
//如果是头条的页面，采用列表碎片，否则直接用文本替换的简单碎片
return Array.get_list(news);
}
String newsCategoryTitle = channelList[idx];
/// 获取当前的item，并色绘制对应的文本信息
System.out.println("6");
return NewsChannelFragment.newInstance(newsCategoryTitle);
}
@Override
// 返回要做展示的页面数量
public int getCount() {
System.out.println("7");return channelList.length;
}
}
普通碎片，只有中间的文本 NewsChannelFragment.java
package com.example.delete_demo;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import androidx.fragment.app.Fragment;
/// 获取对应的文本，并将内部的碎片的文本内容换成接收到的文本信息。
public class NewsChannelFragment extends Fragment {
private static final String ARG_CATEGORY_TITLE = "category_title";
private String newsCategoryTitle = "Default";
private TextView mTitleField;
public static NewsChannelFragment newInstance(String newsCategoryTitle) {
Bundle args = new Bundle();
args.putString(ARG_CATEGORY_TITLE, newsCategoryTitle);
/// 传递参数给下方的Oncreat方法
NewsChannelFragment fragment = new NewsChannelFragment();
fragment.setArguments(args);
System.out.println("1");
return fragment;
}
public NewsChannelFragment() {
System.out.println("2");
// Required empty public constructor
}
@Override
public void onCreate(Bundle savedInstanceState) {
System.out.println("3");
super.onCreate(savedInstanceState);
try {
// 获取对应的数据项
newsCategoryTitle = (String) getArguments().getString(ARG_CATEGORY_TITLE);
} catch (java.lang.NullPointerException e) {
System.out.println("TestFragment getArg error!");
}
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
System.out.println("4");
// Inflate the layout for this fragment
View view = inflater.inflate(R.layout.activity_news_channel_fragment, container, false);
/// 加载对应的碎片文件，将内部的文本替换成对应的文本
mTitleField = (TextView) view.findViewById(R.id.newsCategoryTitle);
// 进行对应的碎片的文本设定
mTitleField.setText(newsCategoryTitle);
// Log.e("NewsChannelFragment", "createView" + newsCategoryTitle);
return view;
}
}
ListView的列表碎片 Array.java
package com.example.delete_demo;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AlertDialog;
import androidx.fragment.app.Fragment;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import java.util.ArrayList;
public class Array extends Fragment {
/// 存放传回的信息
String[] news;
/// 存放列表数据
ArrayList<String> datas = new ArrayList<>();
// 存放的详细数据，作为后面的弹出信息
public String[] info = {"111","222","333","444"};
public static Array get_list(String []s)
{
/*
实际由于要返回一个fragment所以才多绕一步，创建该函数，由于列表的创建，搭配适配器，
连接监听器都需要依靠onCreate和onCreateView方法,创建完成后又需要把碎片传回，但onCreate和onCreateView方法
返回值都不是一个实例化对象，所以需要该方法作为一个媒介。
*/
/// 回传数据到下方
Bundle bundle = new Bundle();
bundle.putStringArray("news",s);
/// 直接创建实例对象，目的是自动调用下方的函数，添加列表项并且设置监听
Array fragment = new Array();
/// 数据传递到下方
fragment.setArguments(bundle);
return fragment;
}
public Array(){}
@Override
public void onCreate(Bundle savedInstanceState) {
// System.out.println("3");
super.onCreate(savedInstanceState);
try {
// 接收来自上方的信息
Bundle bundle = getArguments();
news = bundle.getStringArray("news");
} catch (java.lang.NullPointerException e) {
// 没有接收到显示报错
System.out.println("TestFragment getArg error!");
}
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.activity_list, container, false);
ListView l = (ListView) view.findViewById(android.R.id.list);
for (int i = 0; i < 100; i++) {
datas.add(news[i%4]);
}
ArrayAdapter <String> adapter = new ArrayAdapter<String>(getContext(),
android.R.layout.simple_list_item_1,datas);
l.setAdapter(adapter);
l.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
// Toast.makeText(getContext(),info[position%4],
// Toast.LENGTH_LONG).show();
new AlertDialog.Builder(getContext())
.setTitle("详细内容")
.setMessage(info[position%4])
.setPositiveButton("确定", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
}
}).show();
};
});
return view;
}
}
activity_list.xml 用来存放列表视图
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
tools:context=".Array">
<ListView
android:id="@android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
activity_news_channel_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
tools:context=".NewsChannelFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:id="@+id/newsCategoryTitle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="30sp"
android:text="hello" />
</FrameLayout>
导航栏2 ExploreFragment.java
package com.example.delete_demo;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import androidx.fragment.app.Fragment;
public class ExploreFragment extends Fragment {
public ExploreFragment() { }
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.activity_explore_fragment,container,false);
return v;
}
}
activity_explore_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
tools:context=".ExploreFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="20sp"
android:textColor="@color/white"
android:background="@drawable/c"
android:text="该页面用于设置皮肤" />
</FrameLayout>
导航栏3 StatisticsFragment.java
package com.example.delete_demo;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import androidx.fragment.app.Fragment;
public class StatisticsFragment extends Fragment {
public StatisticsFragment() { }
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.activity_statistics_fragment,container,false);
return v;
}
}
activity_statistics_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
tools:context=".StatisticsFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="20sp"
android:textColor="@color/white"
android:background="@drawable/b"
android:text="该页面用于设置应用时长统计" />
</FrameLayout>
导航栏4 SettingsFragment .java
package com.example.delete_demo;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import androidx.fragment.app.Fragment;
public class SettingsFragment extends Fragment {
public SettingsFragment() { }
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.activity_settings_fragment,container,false);
return v;
}
}
activity_settings_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
tools:context=".SettingsFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="20sp"
android:textColor="@color/white"
android:background="@drawable/a"
android:text="该页面用于开发设置" />
</FrameLayout>
底部导航栏布局 activity_button.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@color/x"
android:orientation="horizontal">
<LinearLayout
android:id="@+id/lay1"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_marginLeft="20dp"
android:orientation="vertical"
android:layout_height="match_parent">
<ImageButton
android:id="@+id/btn1"
android:layout_width="59dp"
android:layout_height="36dp"
android:layout_weight="5"
/>
<TextView
android:layout_width="61dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Home" />
</LinearLayout>
<LinearLayout
android:id="@+id/lay2"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_marginLeft="20dp"
android:orientation="vertical"
android:layout_height="match_parent">
<ImageButton
android:id="@+id/btn2"
android:layout_width="59dp"
android:layout_height="36dp"
android:layout_weight="5"
/>
<TextView
android:layout_width="61dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Explore" />
</LinearLayout>
<LinearLayout
android:id="@+id/lay3"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_marginLeft="20dp"
android:orientation="vertical"
android:layout_height="match_parent">
<ImageButton
android:id="@+id/btn3"
android:layout_width="59dp"
android:layout_height="36dp"
android:layout_weight="5"
/>
<TextView
android:layout_width="61dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Statistics" />
</LinearLayout>
<LinearLayout
android:id="@+id/lay4"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_marginLeft="20dp"
android:orientation="vertical"
android:layout_height="match_parent">
<ImageButton
android:id="@+id/btn4"
android:layout_width="59dp"
android:layout_height="36dp"
android:layout_weight="5"
/>
<TextView
android:layout_width="61dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Settings" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Home主页内导航遮挡块 tab_rb.xml
<?xml version="1.0" encoding="utf-8"?>
<RadioButton xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text=""
android:background="@drawable/tab_selector"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:button="@null"
/>
内导航点击变色selector块 tab_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_checked="true" >
<layer-list >
<item >
<shape android:shape="rectangle">
<stroke android:width="5dp" android:color="#ff0000"/>
</shape>
</item>
<item android:bottom="5dp" >
<shape android:shape="rectangle" >
<solid android:color="#fff"/>
</shape>
</item>
</layer-list>
</item>
<item android:state_selected="true" >
<layer-list >
<item >
<shape android:shape="rectangle">
<stroke android:width="5dp" android:color="#ff0000"/>
</shape>
</item>
<item android:bottom="5dp" >
<shape android:shape="rectangle" >
<solid android:color="#fff"/>
</shape>
</item>
</layer-list>
</item>
<item >
<shape >
<solid android:color="#ffF"/>
</shape>
</item>
</selector>
Strings.xml
<resources>
<string name="app_name">delete_demo</string>
<string-array name="file">
<item>关注</item>
<item>头条</item>
<item>视频</item>
<item>长沙</item>
<item>要闻</item>
<item>新时代</item>
<item>娱乐</item>
<item>关注</item>
<item>头条</item>
<item>视频</item>
<item>长沙</item>
<item>要闻</item>
<item>新时代</item>
<item>娱乐</item>
</string-array>
</resources>
参考
齐芒行，川锋明！
浙公网安备 33010602011771号