Skip to content

Commit

Permalink
具有共同头部的 ViewPager,支持与ListView,GridView,ScrollView,WebView,RecyclerVie…
Browse files Browse the repository at this point in the history
…w 嵌套使用。具有连续的滑动事件 和 滑动监听, 支持下拉刷新。
  • Loading branch information
wayDevelop committed Jun 17, 2016
0 parents commit e15837d
Show file tree
Hide file tree
Showing 52 changed files with 2,500 additions and 0 deletions.
10 changes: 10 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
*.iml
.gradle
.idea
/local.properties
/.idea/workspace.xml
/.idea/libraries
.DS_Store
/build
/captures
/screenshots
107 changes: 107 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,107 @@
# HeaderViewPager
###具有共同头部的 ViewPager,支持与ListView,GridView,ScrollView,WebView,RecyclerView 嵌套使用。具有连续的滑动事件 和 滑动监听, 支持下拉刷新。

该项目参考了:[https://github.com/cpoopc/ScrollableLayout](https://github.com/cpoopc/ScrollableLayout) 喜欢原作的可以去使用。相比原项目,代码更简单易懂,扩展性更高,欢迎大家下载体验本项目,如果使用过程中遇到什么问题,欢迎反馈。

## 演示
![image](http://7xss53.com2.z0.glb.clouddn.com/headerviewpager/demo1.png) ![image](http://7xss53.com2.z0.glb.clouddn.com/headerviewpager/demo2.gif) ![image](http://7xss53.com2.z0.glb.clouddn.com/headerviewpager/demo3.gif)
## 1.用法
该项目和我github上其他的view相关的项目已经一起打包上传到jCenter仓库中(源码地址 [https://github.com/jeasonlzy0216/ViewCore](https://github.com/jeasonlzy0216/ViewCore) ),使用的时候可以直接使用compile依赖,用法如下
###该项目中使用到的大部分自定义控件,均来源于上述仓库
```java
compile 'com.lzy.widget:view-core:0.2.1'
```
或者使用
```java
compile project(':header_viewpager')
```

## 2.实现原理
把自定义控件 `HeaderViewPagerLayout``dispatchTouchEvent` 方法进行重写,根据手势方向决定是否分发事件,同时使用 Scroller 滚动内部视图,达到滑动的连续性。 具体详细代码,实例代码中会有详细注释。

## 3.代码参考
### 1.布局解析
* 自定义控件`HeaderViewPagerLayout`作为根布局
* 无论控件具有多少个子`View`,只有第一个子`View`会被自定义控件按头部解析,所以,如果头部有多个`View`,可以使用`ViewGroup`包裹,例如下面实例使用的是`LinearLayout`包裹(头部是一个ViewPager和Indicator指示器),除了第一个`View`会被滑出去外,其余布局均不会被滑出。
* 如果滑动时,想让布局滑动到一定距离后停止么可以在xml布局中加入自定义属性`app:hvp_topOffset="50dp"`,值的大小表示距离顶部多少距离停止滑动
* 在头部滑动的过程中,可以使用`setOnScrollListener`设置滑动监听,动态改变头部据或者其他布局的动画

###例如布局中做如下布局:
```xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<com.lzy.widget.HeaderViewPager
android:id="@+id/scrollableLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:hvp_topOffset="50dp">

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="200dp">

<com.lzy.widget.loop.LoopViewPager
android:id="@+id/pagerHeader"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:lvp_delayTime="2000"
app:lvp_isAutoLoop="true"/>

<com.lzy.widget.tab.CircleIndicator
android:id="@+id/ci"
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_alignParentBottom="true"
android:background="#4000"
app:ci_normalRadiusColor="#FFF"
app:ci_selectedRadiusColor="#FFF"/>
</RelativeLayout>

<com.lzy.widget.tab.PagerSlidingTabStrip
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="@mipmap/bg_menu_normal"
android:textSize="16sp"
app:pstsDividerColor="#00000000"
app:pstsIndicatorColor="#2DA4F0"
app:pstsIndicatorHeight="2dp"
app:pstsShouldExpand="false"
app:pstsTextAllCaps="false"
app:pstsUnderlineHeight="2dp"/>

<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</com.lzy.widget.HeaderViewPager>

<include
android:id="@+id/titleBar"
layout="@layout/include_titlebar"/>
</FrameLayout>
```
### 2.对于自定义控件,需要做如下初始化
```java
scrollableLayout.setCurrentScrollableContainer(fragments.get(0));
viewPager.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
@Override
public void onPageSelected(int position) {
scrollableLayout.setCurrentScrollableContainer(fragments.get(position));
}
});
```
### 3.如果需要对滑动过程进行监听,可以使用如下代码,currentY 表示当前滑过的距离,maxY表示当前可以滑动的最大距离,有了这两个参数,就可以对任意布局,做任何动画了。例如如下代码就是实现 视差动画效果的代码。
```xml
scrollableLayout.setOnScrollListener(new HeaderViewPagerLayout.OnScrollListener() {
@Override
public void onScroll(int currentY, int maxY) {
image.setTranslationY(currentY / 2);
}
});
```
1 change: 1 addition & 0 deletions app/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
/build
28 changes: 28 additions & 0 deletions app/build.gradle
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
apply plugin: 'com.android.application'

android {
compileSdkVersion 23
buildToolsVersion "23.0.2"

defaultConfig {
applicationId "com.lzy.myapplication"
minSdkVersion 11
targetSdkVersion 22
versionCode 1
versionName "1.0"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}

dependencies {
compile fileTree(include: ['*.jar'], dir: 'libs')
compile 'com.android.support:appcompat-v7:23.1.1'

compile 'com.lzy.widget:view-core:0.2.1'
// compile project(':header_viewpager')
}
17 changes: 17 additions & 0 deletions app/proguard-rules.pro
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
# Add project specific ProGuard rules here.
# By default, the flags in this file are appended to flags specified
# in E:\Android\SDK/tools/proguard/proguard-android.txt
# You can edit the include path and order by changing the proguardFiles
# directive in build.gradle.
#
# For more details, see
# http://developer.android.com/guide/developing/tools/proguard.html

# Add any project specific keep options here:

# If your project uses WebView with JS, uncomment the following
# and specify the fully qualified class name to the JavaScript interface
# class:
#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
# public *;
#}
22 changes: 22 additions & 0 deletions app/src/main/AndroidManifest.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<?xml version="1.0" encoding="utf-8"?>
<manifest package="com.lzy.headerviewpager"
xmlns:android="http://schemas.android.com/apk/res/android">

<uses-permission android:name="android.permission.INTERNET"/>

<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>

<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
</application>

</manifest>
47 changes: 47 additions & 0 deletions app/src/main/java/com/lzy/headerviewpager/BaseActivity.java
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
package com.lzy.headerviewpager;

import android.annotation.TargetApi;
import android.os.Build;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.Window;
import android.view.WindowManager;

/**
* ================================================
* 作 者:jeasonlzy(廖子尧)Github地址:https://github.com/jeasonlzy0216
* 版 本:1.0
* 创建日期:2016/5/8
* 描 述:
* 修订历史:
* ================================================
*/
public class BaseActivity extends AppCompatActivity {

protected SystemBarTintManager tintManager;

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
setTranslucentStatus(true);
}
tintManager = new SystemBarTintManager(this);
tintManager.setStatusBarTintEnabled(true);
tintManager.setStatusBarTintResource(android.R.color.transparent); //设置上方状态栏透明
}

@TargetApi(19)
private void setTranslucentStatus(boolean on) {
Window win = getWindow();
WindowManager.LayoutParams winParams = win.getAttributes();
final int bits = WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS;
if (on) {
winParams.flags |= bits;
} else {
winParams.flags &= ~bits;
}
win.setAttributes(winParams);
}
}
Loading

0 comments on commit e15837d

Please sign in to comment.