Android ViewPager+HorizontalScrollView实现标题栏滑动(腾讯新闻)
1) ViewPager提供了左右滑动切换页面的方法,但是它所提供的标题只是无语,估计没有真正的项目会照搬拿过来;并且它只能一页一页滑,我想直接查看最后一页要滑半天;
2) 看了腾讯新闻客户端感觉体验很好,所以就仿着写了,因为只是做个demo供大家交流也是给自己做个笔记,所以功能实现就行demo比较简单;
3) 有兴趣的可以在demo的基础拓展,如果哪里写得不好还望大家多多赐教、一起交流
4) 直接上主要代码,所以注释都写在代码里,最后会给工程包。(PS是在AS环境下生成的)
先放个效果图:
MainActivity.java
- package qi.demo;
- import android.content.Context;
- import android.graphics.Color;
- import android.os.Bundle;
- import android.support.v4.app.Fragment;
- import android.support.v4.app.FragmentActivity;
- import android.support.v4.view.ViewPager;
- import android.view.View;
- import android.widget.HorizontalScrollView;
- import android.widget.LinearLayout;
- import android.widget.TextView;
- import java.util.ArrayList;
- import qi.demo.adapter.MyViewPagerAdapter;
- public class MainActivity extends FragmentActivity implements ViewPager.OnPageChangeListener{
- private MainActivity mActivity;
- private ViewPager viewPager;
- private HorizontalScrollView scrollView;
- private LinearLayout titleLayout;
- private ArrayList<Integer> moveToList; //viewPager滑动时标题栏跟随滑动距离
- private int mTitleMargin; //每个标题间的间隔
- private ArrayList<Fragment> fragmentsList; //viewPager加载类
- private ArrayList<TextView> textViewList; //标题控件集合
- private ArrayList<String> titleList; //标题文字集合
- private TestFragment fragment;
- private MyViewPagerAdapter mAdapter;
- private int currentPos; //现在显示的是第几页
- private String[] strList = new String[]{"物业服务", "教育", "医疗卫生", "劳动保障", "交通出行", "投资服务", "关于左邻右里"};
- private int[] idList = new int[]{, , , , , , };
- @Override
- protected void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.activity_main);
- mActivity = this;
- mTitleMargin = dip2px(this, );
- initView();
- initData();
- }
- private void initView(){
- viewPager = (ViewPager) findViewById(R.id.viewPager);
- viewPager.setOnPageChangeListener(mActivity);
- scrollView = (HorizontalScrollView) findViewById(R.id.scrollView);
- titleLayout = (LinearLayout) findViewById(R.id.titleLayout);
- }
- /**
- * 1)初始化viewPager
- * 2)设置默认的Fragment
- */
- private void initData(){
- fragmentsList = new ArrayList<>();
- titleList = new ArrayList<>();
- textViewList = new ArrayList<>();
- moveToList = new ArrayList<>();
- mAdapter = new MyViewPagerAdapter(getSupportFragmentManager());
- for(int i=; i<strList.length; i++){
- titleList.add(strList[i]);
- fragment = new TestFragment(mActivity, idList[i]);
- fragmentsList.add(fragment);
- addTitleLayout(titleList.get(i), idList[i]);
- }
- mAdapter.setData(fragmentsList);
- viewPager.setAdapter(mAdapter);
- viewPager.setOffscreenPageLimit();
- textViewList.get().setTextColor(Color.rgb(, , ));
- currentPos = ;
- }
- /**
- * 添加标题栏
- * @param title 标题名称
- * @param position 标题索引
- */
- private void addTitleLayout(String title, int position){
- final TextView textView = (TextView) getLayoutInflater().inflate(R.layout.title, null);
- textView.setText(title);
- textView.setTag(position);
- textView.setOnClickListener(new posOnClickListener());
- LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
- params.leftMargin = dip2px(mActivity, mTitleMargin);
- params.rightMargin = dip2px(mActivity, mTitleMargin);
- titleLayout.addView(textView, params);
- textViewList.add(textView);
- int width;
- //如果是第一个标题则不设滑动距离
- if(position==){
- width = ;
- moveToList.add(width);
- }
- //第N个标题的滑动距离是上一个标题的宽度加上标题之间的间隔,这样的话滑动viewPager的时候保证当前标题栏在最左侧
- else{
- int w = View.MeasureSpec.makeMeasureSpec(, View.MeasureSpec.UNSPECIFIED);
- int h = View.MeasureSpec.makeMeasureSpec(, View.MeasureSpec.UNSPECIFIED);
- textViewList.get(position-).measure(w, h);
- width = textViewList.get(position-).getMeasuredWidth() + mTitleMargin*;
- moveToList.add(width+moveToList.get(moveToList.size()-));
- }
- }
- @Override
- public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
- }
- /**
- * 滑动viewPager
- */
- @Override
- public void onPageSelected(int position) {
- textViewList.get(currentPos).setTextColor(Color.rgb(, , )); //将之前的标题栏颜色变回来
- textViewList.get(position).setTextColor(Color.rgb(, , )); //将当前标题栏变色
- currentPos = position; //设置当前索引
- scrollView.scrollTo((int) moveToList.get(position), ); //标题栏跟随viewPager滑动
- }
- @Override
- public void onPageScrollStateChanged(int state) {
- }
- /**
- * 点击标题栏
- */
- class posOnClickListener implements View.OnClickListener{
- @Override
- public void onClick(View view) {
- //点击的是当前标题什么都不做
- if((int)view.getTag()==currentPos){
- return;
- }
- //标题栏变色且设置viewPager
- textViewList.get(currentPos).setTextColor(Color.rgb(, , ));
- currentPos = (int) view.getTag();
- textViewList.get(currentPos).setTextColor(Color.rgb(, , ));
- viewPager.setCurrentItem(currentPos);
- }
- }
- /**
- * 根据手机的分辨率从 dp 的单位 转成为 px(像素)
- */
- public static int dip2px(Context context, float dpValue) {
- final float scale = context.getResources().getDisplayMetrics().density;
- return (int) (dpValue * scale + 0.5f);
- }
- }
MyViewPagerAdapter.java
- public class MyViewPagerAdapter extends FragmentPagerAdapter {
- private ArrayList<Fragment> fragmentList;
- public MyViewPagerAdapter(FragmentManager fm) {
- super(fm);
- }
- public void setData(ArrayList<Fragment> fragmentList){
- this.fragmentList = fragmentList;
- }
- @Override
- public Fragment getItem(int arg0) {
- return fragmentList.get(arg0);
- }
- @Override
- public int getCount() {
- return fragmentList.size();
- }
- }
activity_main.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="match_parent"
- android:orientation="vertical">
- <HorizontalScrollView
- android:id="@+id/scrollView"
- android:layout_width="match_parent"
- android:layout_height="60dp"
- android:scrollbars="none"
- android:background="#FFFFFF">
- <LinearLayout
- android:id="@+id/titleLayout"
- android:layout_width="wrap_content"
- android:layout_height="match_parent"
- android:gravity="center_vertical"
- android:orientation="horizontal"/>
- </HorizontalScrollView>
- <android.support.v4.view.ViewPager
- android:id="@+id/viewPager"
- android:layout_width="match_parent"
- android:layout_height="match_parent">
- <android.support.v4.view.PagerTabStrip
- android:id="@+id/pagerTabStrip"
- android:layout_width="0dp"
- android:layout_height="0dp"/>
- </android.support.v4.view.ViewPager>
- </LinearLayout>
demo下载地址:http://download.csdn.net/detail/qy7941237/9344763
Android ViewPager+HorizontalScrollView实现标题栏滑动(腾讯新闻)的更多相关文章
- android Viewpager HorizontalScrollView 实现分页栏拖拽
源码:http://files.cnblogs.com/android100/ViewPaperDemo.rar首先我们先看一个效果: 前两个是网易的,它做的title不能拖拽,.不过点击动画效果挺 ...
- android记帐本、涂鸦、仿腾讯新闻、仿bilibili、Markdwon便签、资讯APP等源码
Android精选源码 kotlin版仿哔哩哔哩动画Android客户端源码 android实现图片涂鸦效果源码 Android 开源记账本项目源码 android高仿腾讯新闻app源码 androi ...
- Android 自定义 HorizontalScrollView 打造再多图片(控件)也不怕 OOM 的横向滑动效果
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/38140505 自从Gallery被谷歌废弃以后,Google推荐使用ViewPa ...
- Android 用HorizontalScrollView实现ListView的Item滑动删除 ,滑动错乱 冲突
用HorizontalScrollView实现类似微信的滑动删除 测试于:Android2.2+ 对于Android来说按键操作已经在减少,越来越多的手势操作层出不穷,今天介绍一款LIstView的I ...
- Android ViewPager再探:增加滑动指示条
上一篇:<Android ViewPager初探:让页面滑动起来> ViewPager只是左右滑动有些丑,也不知道当前位于第几页面. 可以在上方加入滑动指示条,来确定当前位置. 只需要修改 ...
- Android ViewPager初探:让页面滑动起来
下一篇:<Android ViewPager再探:增加滑动指示条> ViewPager需要用到适配器PagerAAdapter,以下四个函数需要重写: instantiateItem(Vi ...
- android笔记:ViewPager实现界面的滑动
最近在学习ViewPager实现界面的滑动,拜读了郭神的博客文章,并抽取归纳了自己对ViewPager的理解. ViewPager实现界面滑动的步骤如下: 1.在xml布局内加入控件android.s ...
- Android 使用ViewPager实现左右循环滑动图片
ViewPager这个小demo实现的是可以左右循环滑动图片,下面带索引,滑到最后一页在往右滑动就要第一页,第一页往左滑动就到最后一页,先上效果图,用美女图片是我一贯的作风,呵呵 1. 首先看一 ...
- Android viewpager 嵌套 viewpager滑动 点击事件冲突解决方案
为了解决这个问题.可以自定义viewpager,然后在里面监听首饰,自定义点击事件 package com.hpuvoice.view; import android.content.Context; ...
随机推荐
- Map根据value排序ASC DESC
原文:http://blog.csdn.net/k21325/article/details/53259180 需求有点刁钻,写关键词组合匹配标题的时候,遇到关键词像这样 XXX XXX 1222 X ...
- GNS3配置SecureCRT
C:\SecureCRT\SecureCRT.exe /script D:\GNS3\DyRouter.vbs /T /telnet 127.0.0.1 %p "D:\Program Fil ...
- 集成环信时遇到的问题file not found: libEaseMobClientSDK.a
集成环信时遇到的问题 build setting环信SDK集成libEaseMobClientSDKL file not found: libEaseMobClientSDK.a clang: er ...
- 安装eclipse中html/jsp/xml editor插件以及改动html页面的字体
近期在做android项目,用到了jquery mobile 框架以及phonegap,所以就会涉及一些html文件,可是html文件打开的方式是Text Editor ,而且打开之后一些html代码 ...
- cocos2dx塔防游戏逻辑
cocos2dx 塔防游戏逻辑 1.欢迎界面 2.tield制作游戏地图,空块设置cantouch属性为1 3.设置地图锚点,把锚点增加一个锚点容器,给怪物的行走函数传入 该锚点容器參数,让怪物依照锚 ...
- 浅谈MySQL load data local infile细节 -- 从源码层面
相信大伙对mysql的load data local infile并不陌生,今天来巩固一下这里面隐藏的一些细节,对于想自己动手开发一个mysql客户端有哪些点需要注意的呢? 首先,了解一下流程: 3个 ...
- MongoDb 学习教程
MongoDB教程首页 MongoDB 介绍 MongoDB 优点 MongoDB 安装(Window/Linux) MongoDB 数据模型 MongoDB 创建数据库 MongoDB 删除数据库 ...
- 李洪强iOS开发之动态获取UILabel的bounds
李洪强iOS开发之动态获取UILabel的bounds 在使用UILabel存放字符串时,经常需要获取label的长宽数据,本文列出了部分常用的计算方法. 1.获取宽度,获取字符串不折行单行显示时所需 ...
- WWDC笔记:2013 Session 201 Building User Interfaces for iOS 7
Text Dynamic Type Specifies fonts semantically Supports user text sizing Optimized for legibility Su ...
- Dijkstra算法——最短路径(转)
转自:http://www.cnblogs.com/biyeymyhjob/archive/2012/07/31/2615833.html Dijkstra算法 1.定义概览 Dijkstra(迪杰斯 ...