android防谷歌滑动效果,Android实现顶部导航栏可点击可滑动效果(仿微信仿豆瓣网)...

使用ViewPager,PagerSlidingTabStrip,SwipeRefreshLayout打造一款可以点击可以侧滑的顶部导航栏。

cca42b4e589e1c4589342ba05802d774.gif

先简单介绍一下所用的两个个开源库。

PagerSlidingTabStrip

用法:

1.向app Module中的build.gradle中添加依赖

dependencies {

compile 'com.astuetz:pagerslidingtabstrip:1.0.1'

}

2.把PagerSlidingTabStrip这个控件添加到你的布局中,它通常会放在ViewPager的上面

android:id="@+id/tabs"

android:layout_width="match_parent"

android:layout_height="48dip" />

3.在你的onCreate()方法中(或者是在Fragment里面的onCreateView()方法中),把PagerSlidingTabStrip跟ViewPager绑定在一起

// Initialize the ViewPager and set an adapter

ViewPager pager = (ViewPager) findViewById(R.id.pager);

pager.setAdapter(new TestAdapter(getSupportFragmentManager()));

// Bind the tabs to the ViewPager

PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) findViewById(R.id.tabs);

tabs.setViewPager(pager);

4.如果你要设置PagerChange监听的话

// continued from above

tabs.setOnPageChangeListener(mPageChangeListener);

至于它里面的其他很多方法我在这里就不多讲了,需要了解的同学可以去看下Github。

SwipeRefreshLayout

SwipeRefreshLayout是谷歌官方出的一款下拉刷新的控件,只支持下拉刷新,并不支持上拉加载,当然,Github里面也有人基于这个控件写了上拉加载的开源框架,嘻嘻,下一篇给你们介绍。

用法:

1.在xml文件中添加Android.support.v4.widget.SwipeRefreshLayout

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/refresh_layout"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/lv"

android:layout_width="match_parent"

android:layout_height="match_parent" />

2.下拉时若需要出发事件,需实现SwipeRefreshLayout.OnRefreshListener,重写onRefresh()方法。

仿豆瓣实现滑动效果

首先我们先看到MainActivity.class

package com.example.dragonhaw.doubandemo;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentPagerAdapter;

import android.support.v4.view.ViewPager;

import android.support.v7.app.AppCompatActivity;

import android.view.Window;

import com.astuetz.PagerSlidingTabStrip;

import com.example.dragonhaw.doubandemo.fragment.PagerFragment;

import com.example.dragonhaw.doubandemo.fragment.RefreshFragment;

/**

* Created by dragonhaw at 9/13/2016

*/

public class MainActivity extends AppCompatActivity {

/**

* Page的数量

*/

private static final int PAGER_NUM = 4;

/**

* PagerSlidingTabStrip的对象

*/

private PagerSlidingTabStrip pagerSlidingTabStrip;

/**

* ViewPager的对象

*/

private ViewPager viewPager;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

//隐藏ActionBar,此方法必须写在setContentView的前面,因为必须在contentView未加载之前将其去掉

requestWindowFeature(Window.FEATURE_NO_TITLE);

setContentView(R.layout.activity_main);

initView();

}

/**

* 初始化View

*/

private void initView() {

pagerSlidingTabStrip = (PagerSlidingTabStrip) findViewById(R.id.pager_tabs);

viewPager = (ViewPager) findViewById(R.id.pager);

//设置ViewPager每次预加载3个pager,也就是除当前pager外另外加载了三个pager,默认为1

viewPager.setOffscreenPageLimit(3);

viewPager.setAdapter(new MyFragmentPagerAdapter(getSupportFragmentManager()));

pagerSlidingTabStrip.setViewPager(viewPager);

}

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {

private String[] Titles = new String[]{

"豆瓣", "发现", "讨论", "我的"

};

public MyFragmentPagerAdapter(FragmentManager fm) {

super(fm);

}

/**

* 回调此方法得到Title内容

*/

@Override

public CharSequence getPageTitle(int position) {

return Titles[position];

}

/**

* 回调此方法得到Fragment,这里使用Bundle是为了给PagerFragment里面的TextView传入数据

*/

@Override

public Fragment getItem(int position) {

Bundle bundle = new Bundle();

Fragment pagerFragment;

if (position == 0) {

pagerFragment = new RefreshFragment();

} else {

pagerFragment = new PagerFragment();

}

bundle.putInt("pager_num", position);

pagerFragment.setArguments(bundle);

return pagerFragment;

}

/**

* 回调此方法得到Pager的个数

*/

@Override

public int getCount() {

return PAGER_NUM;

}

}

}

整个MainActivity应该没什么好说的吧,难理解的地方我都注释了。然后我们写Fragment,在这里我们写两个Fragment,第一个Fragment也就是首页,要实现ListView跟下拉刷新的那个Fragment,RefreshFragment.class代码如下:

package com.example.dragonhaw.doubandemo.fragment;

import android.os.Bundle;

import android.os.Handler;

import android.support.v4.app.Fragment;

import android.support.v4.widget.SwipeRefreshLayout;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.ArrayAdapter;

import android.widget.ListView;

import com.example.dragonhaw.doubandemo.R;

import java.util.ArrayList;

import java.util.List;

/**

* Created by dragonhaw on 2016/9/13.

*/

public class RefreshFragment extends Fragment implements SwipeRefreshLayout.OnRefreshListener{

private SwipeRefreshLayout swipeRefreshLayout;

private ListView listView;

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

View view =inflater.inflate(R.layout.fragment_refresh, container, false);

swipeRefreshLayout = (SwipeRefreshLayout) view.findViewById(R.id.refresh_layout);

swipeRefreshLayout.setOnRefreshListener(this);

//为下拉刷新的设置四种颜色

swipeRefreshLayout.setColorSchemeResources(

android.R.color.holo_blue_light,

android.R.color.holo_green_light,

android.R.color.holo_green_light,

android.R.color.holo_orange_light

);

listView = (ListView) view.findViewById(R.id.lv);

listView.setAdapter(new ArrayAdapter(getActivity(), android.R.layout.simple_list_item_1,getData()));

return view;

}

@Override

public void onRefresh() {

swipeRefreshLayout.setRefreshing(true);

new Handler().postDelayed(new Runnable() {

@Override

public void run() {

swipeRefreshLayout.setRefreshing(false);

}

}, 3000);

}

public List getData() {

List data = new ArrayList<>();

for (int i = 0; i < 30; i++) {

data.add("数据" + i);

}

return data;

}

}

SwipeRefreshLayout的setColorSchemeResources()方法,是给下拉刷新的那个圆圈设置颜色,最多可以设置四种颜色,这个框架在Android5.0之前是一个横线的颜色变化,很一般,一点都不好看,但是在Android5.0后就变为了一个圆圈的变化,很多APP都用的它,比如说斗鱼tv等。

另外,在onRefresh()方法中,我们设置了三秒钟刷新完成,即setRefreshing()中状态从true变为false。

再接下来我们又建一个Fragment,PagerFragment.class代码如下:

package com.example.dragonhaw.doubandemo.fragment;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

import com.example.dragonhaw.doubandemo.R;

/**

* Created by dragonhaw on 2016/9/13.

*/

public class PagerFragment extends Fragment {

private TextView textView;

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

View view = inflater.inflate(R.layout.fragment_pager, container, false);

textView = (TextView) view.findViewById(R.id.text);

Bundle bundle = getArguments();

int pager = bundle.getInt("pager_num");

textView.setText("" + pager);

return view;

}

}

MainActivity的布局文件:

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">

android:id="@+id/pager_tabs"

android:layout_width="match_parent"

android:layout_height="48dp"

android:background="#ff2d2d2d"

android:textColor="#ff8f8f8f"

android:textSize="18sp"

app:pstsIndicatorColor="#ff00cd79"

app:pstsIndicatorHeight="4dp"

app:pstsShouldExpand="true" />

android:id="@+id/pager"

android:layout_width="match_parent"

android:layout_height="match_parent" />

PagerFragment的布局文件如下:

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/text"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text=""

android:textSize="50sp"

android:gravity="center"

/>

RefreshFragment的布局文件如下:

xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/refresh_layout"

android:layout_width="match_parent"

android:layout_height="match_parent"

>

android:id="@+id/lv"

android:layout_width="match_parent"

android:layout_height="match_parent" />

以上所述是小编给大家介绍的Android实现顶部导航栏可点击可滑动效果(仿微信仿豆瓣网),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值