【练习】ViewPager标签滑动
效果图：
布局：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v4.view.PagerTabStrip
android:id="@+id/pagerTab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></android.support.v4.view.PagerTabStrip>
</android.support.v4.view.ViewPager>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/fragment_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
java代码
public class MainActivity extends AppCompatActivity {
private ViewPager viewPager;
private PagerTabStrip pagerTab;
private List<String> titles; //标签
private List<Fragment> fragments;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化页面
initView();
//初始化标题数组
initTitle();
//初始化fragments
initFragment();
FragmentAdapter adapter = new FragmentAdapter(getSupportFragmentManager());
viewPager.setAdapter(adapter);
}
private void initView() {
viewPager = (ViewPager) findViewById(R.id.viewpager);
pagerTab = (PagerTabStrip) findViewById(R.id.pagerTab);
pagerTab.setBackgroundColor(Color.GREEN);
pagerTab.setTabIndicatorColor(Color.RED);
pagerTab.setDrawFullUnderline(true);
}
private void initTitle() {
titles = new ArrayList<String>();
for(int i = 0;i<10;i++){
titles.add("第"+i+"个标签");
}
}
private void initFragment() {
fragments = new ArrayList<Fragment>();
for(int i = 0;i<titles.size();i++){
MyFragment myFragment = new MyFragment();
Bundle bundle = new Bundle();
bundle.putString("content","第"+i+"个fragment");
myFragment.setArguments(bundle);
fragments.add(myFragment);
}
}
class FragmentAdapter extends FragmentPagerAdapter{
public FragmentAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}
@Override
public int getCount() {
return fragments.size();
}
@Override
public CharSequence getPageTitle(int position) {
return titles.get(position);
}
}
}
public class MyFragment extends Fragment {
private String content;
private TextView fragment_textview;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Bundle bundle = getArguments();
content = bundle.getString("content","没有内容");
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.myfragment,container,false);
fragment_textview = (TextView) view.findViewById(R.id.fragment_textview);
return view;
}
@Override
public void onActivityCreated( Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
fragment_textview.setText(content);
}
}
*接下来不用PagerTabStrip实现
第一步：实现基本的上下布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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">
<HorizontalScrollView
android:id="@+id/scrollView"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#3edccf"
android:scrollbars="none">
<LinearLayout
android:id="@+id/layout_top"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="@+id/layout_tab"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:orientation="horizontal">
<TextView
android:id="@+id/tab1"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="标签1"
android:textSize="30dp"
android:paddingRight="10dp"
android:gravity="center"/>
<TextView
android:id="@+id/tab2"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="标签2"
android:textSize="30dp"
android:paddingRight="10dp"
android:gravity="center"/>
<TextView
android:id="@+id/tab3"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="标签3"
android:textSize="30dp"
android:paddingRight="10dp"
android:gravity="center"/>
<TextView
android:id="@+id/tab4"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="标签4"
android:textSize="30dp"
android:paddingRight="10dp"
android:gravity="center"/>
<TextView
android:id="@+id/tab5"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="标签5"
android:textSize="30dp"
android:paddingRight="10dp"
android:gravity="center"/>
<TextView
android:id="@+id/tab6"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="标签6"
android:textSize="30dp"
android:paddingRight="10dp"
android:gravity="center"/>
<TextView
android:id="@+id/tab7"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="标签7"
android:textSize="30dp"
android:paddingRight="10dp"
android:gravity="center"/>
<TextView
android:id="@+id/tab8"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="标签8"
android:textSize="30dp"
android:paddingRight="10dp"
android:gravity="center"/>
</LinearLayout>
<LinearLayout
android:id="@+id/layout_scroll"
android:layout_width="wrap_content"
android:layout_height="10dp"
android:orientation="horizontal">
<TextView
android:id="@+id/scroll_line"
android:layout_width="100dp"
android:layout_height="10dp"
android:background="#bf24c4"/>
</LinearLayout>
</LinearLayout>
</HorizontalScrollView>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/scrollView"/>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/fragment_content"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
public class MainActivity extends AppCompatActivity {
private HorizontalScrollView scrollView;
private LinearLayout layout_top,layout_tab,layout_scroll;
private TextView scroll_line;
private ViewPager viewPager;
private List<Fragment> fragments;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化页面
initView();
//初始化fragments
initFragments();
MyAdapter adapter = new MyAdapter(getSupportFragmentManager());
viewPager.setAdapter(adapter);
}
private void initView() {
scrollView = (HorizontalScrollView) findViewById(R.id.scrollView);
layout_top = (LinearLayout) findViewById(R.id.layout_top);
layout_tab = (LinearLayout) findViewById(R.id.layout_tab);
layout_scroll = (LinearLayout) findViewById(R.id.layout_scroll);
scroll_line = (TextView) findViewById(R.id.scroll_line);
viewPager = (ViewPager) findViewById(R.id.viewpager);
}
private void initFragments() {
fragments = new ArrayList<Fragment>();
for(int i = 0;i<layout_tab.getChildCount();i++){
MyFrgment fragment = new MyFrgment();
Bundle bundle = new Bundle();
bundle.putString("content","第"+(i+1)+"个fragment");
fragment.setArguments(bundle);
fragments.add(fragment);
}
}
class MyAdapter extends FragmentPagerAdapter{
public MyAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}
@Override
public int getCount() {
return fragments.size();
}
}
}
public class MyFrgment extends Fragment {
private TextView fragment_textview;
private String content;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Bundle bundle = getArguments();
content = bundle.getString("content","没有内容");
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.myfragment,container,false);
fragment_textview = (TextView) view.findViewById(R.id.fragment_content);
return view;
}
@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
fragment_textview.setText(content);
}
}
第二步：实现滑动下面控制上面
优化MainActivity类
public class MainActivity extends AppCompatActivity {
private HorizontalScrollView scrollView;
private LinearLayout layout_top,layout_tab,layout_scroll;
private TextView scroll_line;
private ViewPager viewPager;
private List<Fragment> fragments;
private int scroll_line_width;
private LinearLayout.LayoutParams params;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化页面
initView();
//初始化fragments
initFragments();
MyAdapter adapter = new MyAdapter(getSupportFragmentManager());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
int left = (int) (scroll_line_width*(position+positionOffset));
params.leftMargin = left;
scroll_line.setLayoutParams(params);
}
@Override
public void onPageSelected(int position) {
int out_left = position*scroll_line_width +scroll_line_width/2 - getResources().getDisplayMetrics().widthPixels/2;
scrollView.smoothScrollTo(out_left,0);
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
private void initView() {
scrollView = (HorizontalScrollView) findViewById(R.id.scrollView);
layout_top = (LinearLayout) findViewById(R.id.layout_top);
layout_tab = (LinearLayout) findViewById(R.id.layout_tab);
layout_scroll = (LinearLayout) findViewById(R.id.layout_scroll);
scroll_line = (TextView) findViewById(R.id.scroll_line);
viewPager = (ViewPager) findViewById(R.id.viewpager);
params = (LinearLayout.LayoutParams) scroll_line.getLayoutParams();
scroll_line_width = params.width;
}
private void initFragments() {
fragments = new ArrayList<Fragment>();
for(int i = 0;i<layout_tab.getChildCount();i++){
MyFrgment fragment = new MyFrgment();
Bundle bundle = new Bundle();
bundle.putString("content","第"+(i+1)+"个fragment");
fragment.setArguments(bundle);
fragments.add(fragment);
}
}
class MyAdapter extends FragmentPagerAdapter{
public MyAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}
@Override
public int getCount() {
return fragments.size();
}
}
}
第三步：增加标签点击监听控制页面滑动
在MainActivity类中增加方法initTabControl()
private void initTabControl() {
for(int i = 0;i<layout_tab.getChildCount();i++){
TextView tab = (TextView) layout_tab.getChildAt(i);
tab.setTag(i);
tab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
viewPager.setCurrentItem((Integer) v.getTag(),true);
}
});
}
}
【练习】ViewPager标签滑动的更多相关文章
- TabLayoutViewPagerDemo【TabLayout+ViewPager可滑动】
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 使用TabLayout搭配ViewPager实现可滑动的顶部选项卡效果. 效果图 代码分析 1.演示常规的设置. 2.通过自定义Vi ...
- 去掉SrollView、GrdiView、ListView、ViewPager等滑动到边缘的光晕效果
当我们使用SrollView.GrdiView.ListView.ViewPager带有滑动功能的组件时,滑动到边缘时总会出现类光晕效果.这是用于提示用户已经滑动到了组件的边缘,不能再滑动了,但有时候 ...
- ViewPager相互嵌套，导致子ViewPager无法滑动，且子ViewPager中的view无法被点击
场景:当使用ViewPager进行嵌套的时候,子viewPager是无法进行嵌套的,因此我们要重写ViewPager类,并重写里层viewPager类中的onTouchEvent方法,调用其父 ...
- ViewPager禁止滑动以及它与内层滑动控件水平方向上事件冲突的解决方法
一.上图 二.场景描写叙述 最近在做项目的时候.遇到一个怪异的需求,描写叙述例如以下: 1.ViewPager中嵌套3个View,当从View1滑动到View2时禁止ViewPager的滑动事件. 2 ...
- viewpager处理（一）：让viewpager不能滑动
1.实现原理: 自定义viewpager,重写onTouchEvent方法,什么触摸事件都不响应即可让viewpager不能滑动. 2.代码如下 public class NoScrollViewPa ...
- ViewPager实现滑动翻页效果
实现ViewPager的滑动翻页效果可以使用ViewPager的setPageTransformer方法,如下: import android.content.Context; import andr ...
- ViewPager无限滑动
2016-6-19 前言 View轮播效果在app中很常见,一想到左右滑动的效果就很容易想到使用ViewPager来实现.对于像我们常说的banner这样的效果,具备无限滑动的功能是可以用ViewPa ...
- Android中ViewPager实现滑动条及与Fragment结合的实例教程
ViewPager类主要被用来实现可滑动的视图功能,这里我们就来共同学习Android中ViewPager实现滑动条及与Fragment结合的实例教程,需要的朋友可以参考下 自主实现滑动指示条先上一个 ...
- Android解决下拉刷新控件SwipeRefreshLayout和ViewPager的滑动冲突
直接说明下我自己项目中的情况,如图: 外部嵌套任何一种refresh下拉控件之后,上方的viewpager左右滑动事件都受到影响,滑动不流畅,稍微有点向下的趋势就会触发刷新. 起初以为可能跟不同下拉控 ...
随机推荐
- linux下syscall函数，SYS_gettid，SYS_tgkill
出处:http://blog.chinaunix.net/uid-28458801-id-4630215.html linux下syscall函数,SYS_gettid,SYS_tgkill ...
- android TP驱动移植调试笔记（转）
1. 添加I2C 设备 TP 一般采用的是I2C 作为数据和命令接口,所以TP 驱动也可以归类为I2C 驱动.TP驱动的主要逻辑不在这里,但是了解了Linux 的I2C 体系架构,就可以对整个驱动流程 ...
- 老项目的#iPhone6与iPhone6Plus适配#iOS8无法开启定位问题和#解决方案#
本文永久地址为 http://www.cnblogs.com/ChenYilong/p/4020359.html,转载请注明出处. iOS8的定位和推送的访问都发生了变化, 下面是iOS7和iOS8申 ...
- Help Me with the Game(imitate)
Help Me with the Game Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 3630 Accepted: ...
- Crashing Robots（imitate）
Crashing Robots Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 8124 Accepted: 3528 D ...
- Hadoop之伪分布环境搭建
搭建伪分布环境 上传hadoop2.7.0编译后的包并解压到/zzy目录下 mkdir /zzy 解压 tar -zxvf hadoop.2.7.0.tar.gz -C /zzy 配置hado ...
- java笔记--反射进阶之总结与详解
一.反射进阶之动态设置类的私有域 "封装"是Java的三大特性之一,为了能更好保证其封装性,我们往往需要将域设置成私有的, 然后通过提供相对应的set和get方法来操作这个域.但是 ...
- C#装箱和拆箱（值类型和引用类型之间的转换）
面向对象编程中,封箱指把非对象类型的数值或数据,包装成对象类型反之,拆箱指把对象类型拆成非对象的数值或数据. 例子:定义一个Circle 类 class Circle { double radius; ...
- MySql 插入数据中文乱码
在数据库连接URL后加上characterEncoding=UTF-8 driver=com.mysql.jdbc.Driver url=jdbc:mysql://localhost:3306/ssm ...
- Object-c 控制语句
控制语句: 分支语句 if-else 有控制机制 switch 循环语句 while do-while for 跳转语句 break,continue,goto