ViewPager+Fragment实现滑动显示,且Fragment里面又放Fragment+viewPager
思路:新建一个Activity,且这个Activity要继承FragementActivity,在Activity的布局文件中放入了一个viewPager,为了效果好看,还做了个导航,使得ViewPager和导航栏能够实现联动。代码里面有解释,我就不详细介绍了!!
在往ViewPager放Fragment的时候,用到的适配器应该是FragmentPagerAdapter
导航栏的制作我是用了一个ImageView+TextView,若这时使用Imageview(或TextView)实现点击事件的话,到你点击不到ImageView(或TextView)的话,不会产生联动效果,所以我用一个LinearLayout去把ImageView和TextView包含起来,并使用LinearLayout相应点击事件,并设置ImageView和TextView不能被点击.
MainActivity.java
package com.example.administrator.viewpagerfagmentdemo; import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout; import java.util.ArrayList;
import java.util.List; public class MainActivity extends FragmentActivity implements View.OnClickListener { private ViewPager myViewPager; //声明ViewPager
private FragmentPagerAdapter myFragmentPagerAdapter; //Fragment适配器
private List<Fragment> myContionter; //存放的容器
// 声明一下四个Fragment
private FirstFragment myFirstFragment;
private SecondFragment mySecondtFragment;
private ThirdFragment myThirdFragment;
private FourFragment myFourFragment;
// 声明四个ImageView
private ImageView down_first_image;
private ImageView down_second_image;
private ImageView down_third_image;
private ImageView down_four_image; private LinearLayout first;
private LinearLayout second;
private LinearLayout third;
private LinearLayout four; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); initView(); //初始化各种View initEvents(); //初始化监听事件 } //初始化我们需要用到的View
public void initView(){
myViewPager = (ViewPager) findViewById(R.id.viewPager); down_first_image = (ImageView) findViewById(R.id.down_music);
down_second_image = (ImageView) findViewById(R.id.down_icon);
down_third_image = (ImageView) findViewById(R.id.down_people);
down_four_image = (ImageView) findViewById(R.id.down_shoot); first = (LinearLayout) findViewById(R.id.first);
second = (LinearLayout) findViewById(R.id.second);
third = (LinearLayout) findViewById(R.id.third);
four = (LinearLayout) findViewById(R.id.four); //初始化Fragment
myFirstFragment = new FirstFragment();
mySecondtFragment = new SecondFragment();
myThirdFragment = new ThirdFragment();
myFourFragment = new FourFragment();
//初始化容器
myContionter = new ArrayList<>();
myContionter.add(myFirstFragment);
myContionter.add(mySecondtFragment);
myContionter.add(myThirdFragment);
myContionter.add(myFourFragment);
//初始化 适配器
myFragmentPagerAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) { @Override
public Fragment getItem(int i) {
return myContionter.get(i);
} @Override
public int getCount() {
return myContionter.size();
}
};
myViewPager.setAdapter(myFragmentPagerAdapter);
//设置监听器,没什么服用价值,就直接匿名内部类了
myViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int i, float v, int i2) { }
//当 界面 切换 的时候
@Override
public void onPageSelected(int position) {
initImageViewBackGround(); //图片先置为暗色
switch (position){
case :
down_first_image.setBackgroundResource(R.drawable.shake_icon_music_pressed);
break;
case :
down_second_image.setBackgroundResource(R.drawable.notification_icon);
break;
case :
down_third_image.setBackgroundResource(R.drawable.shake_icon_people_pressed);
break;
case :
down_four_image.setBackgroundResource(R.drawable.sns_shoot_location_pressed);
break;
}
} @Override
public void onPageScrollStateChanged(int i) { }
}); //这俩 得对应起来
myViewPager.setCurrentItem();
down_first_image.setBackgroundResource(R.drawable.shake_icon_music_pressed);
}
//初始化 监听事件
private void initEvents() {
// down_first_image.setOnClickListener(this);
// down_second_image.setOnClickListener(this);
// down_third_image.setOnClickListener(this);
// down_four_image.setOnClickListener(this); first.setOnClickListener(this);
second.setOnClickListener(this);
third.setOnClickListener(this);
four.setOnClickListener(this);
} //监听事件的方法
@Override
public void onClick(View v) {
initImageViewBackGround(); //先设置图片为亮色
switch (v.getId()){
case R.id.first:
myViewPager.setCurrentItem();
down_first_image.setBackgroundResource(R.drawable.shake_icon_music_pressed);
break;
case R.id.second:
myViewPager.setCurrentItem();
down_second_image.setBackgroundResource(R.drawable.notification_icon);
break;
case R.id.third:
myViewPager.setCurrentItem();
down_third_image.setBackgroundResource(R.drawable.shake_icon_people_pressed);
break;
case R.id.four:
myViewPager.setCurrentItem();
down_four_image.setBackgroundResource(R.drawable.sns_shoot_location_pressed);
break; }
} //初始化图片都为暗色
private void initImageViewBackGround(){ down_first_image.setBackgroundResource(R.drawable.shake_icon_music_normal);
down_second_image.setBackgroundResource(R.drawable.notification_icon_gray);
down_third_image.setBackgroundResource(R.drawable.shake_icon_people_normal);
down_four_image.setBackgroundResource(R.drawable.sns_shoot_location_normal);
}
}
activity_main.xml
<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=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:gravity="center"
android:background="@color/title_background">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="@color/title_text_color"
android:text="微信"/>
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1">
</android.support.v4.view.ViewPager> <LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@drawable/abc_list_selector_disabled_holo_light"
android:orientation="horizontal">
<LinearLayout
android:id="@+id/first"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:gravity="center">
<ImageView
android:id="@+id/down_music"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="2"
android:clickable="false"
android:background="@drawable/shake_icon_music_normal"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:textColor="#000"
android:layout_weight="1"
android:clickable="false"
android:text="音乐"/>
</LinearLayout>
<LinearLayout
android:id="@+id/second"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:gravity="center">
<ImageView
android:id="@+id/down_icon"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="2"
android:clickable="false"
android:background="@drawable/notification_icon_gray"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:textColor="#000"
android:layout_weight="1"
android:clickable="false"
android:text="哈哈"/>
</LinearLayout>
<LinearLayout
android:id="@+id/third"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:gravity="center">
<ImageView
android:id="@+id/down_people"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="2"
android:clickable="false"
android:background="@drawable/shake_icon_people_normal"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:textColor="#000"
android:layout_weight="1"
android:clickable="false"
android:text="好友"/>
</LinearLayout>
<LinearLayout
android:id="@+id/four"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:id="@+id/down_shoot"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="2"
android:clickable="false"
android:background="@drawable/sns_shoot_location_normal"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:textColor="#000"
android:layout_weight="1"
android:clickable="false"
android:text="啦啦"/>
</LinearLayout>
</LinearLayout> </LinearLayout>
建立四个Fragment,这四个Fragment都是一样,在这里我就贴出一个代码,并且我还在这个Frament中又放了ViewPager,在这个viewPager中我又放了Fragment,那么这是你在设置Fragment里面viewPager的适配器的时候,需要用到FragmentPagerAdapter,那么这里穿进去的参数应该是getChildFragmentManager(),否则会报错。
Fragment.java
package com.example.administrator.viewpagerfagmentdemo; import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup; import java.util.ArrayList;
import java.util.List; /**
* Created by Administrator on 2015/9/2.
*/
public class FirstFragment extends Fragment { private ViewPager myViewPager;
private List<View> myContiontar ; //viewPager的数据源
private PagerAdapter myPagerAdapter; //有了数据源,必然要有适配器
private FragmentPagerAdapter fragmentPagerAdapter;
private List<Fragment> list;
private View view; //Fragment的布局 private Lunboa lunboa;
private Lunbob lunbob;
private Lunboc lunboc;
private Lunbod lunbod; @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { view = inflater.inflate(R.layout.first_fragment,null);
initViews(); //初始化各种View
return view;
} //初始化各种View
private void initViews(){
// 先将xml文件 换成 view
myViewPager = (ViewPager) view.findViewById(R.id.first_fragment_viewpager);
//建立五个view 去获得四个ImageView
View view1 = LayoutInflater.from(getActivity().getApplicationContext()).inflate(R.layout.lunbo_image1,null);
View view2 = LayoutInflater.from(getActivity().getApplicationContext()).inflate(R.layout.lunbo_image2,null);
View view3 = LayoutInflater.from(getActivity().getApplicationContext()).inflate(R.layout.lunbo_image3,null);
View view4 = LayoutInflater.from(getActivity().getApplicationContext()).inflate(R.layout.lunbo_image4,null);
View view5 = LayoutInflater.from(getActivity().getApplicationContext()).inflate(R.layout.lunbo_image5,null);
//加入到容器里面
myContiontar = new ArrayList<>();
myContiontar.add(view1);
myContiontar.add(view2);
myContiontar.add(view3);
myContiontar.add(view4);
myContiontar.add(view5); lunboa = new Lunboa();
lunbob = new Lunbob();
lunboc = new Lunboc();
lunbod = new Lunbod(); list = new ArrayList<>();
list.add(lunboa);
list.add(lunbob);
list.add(lunboc);
list.add(lunbod);
//fragmentPagerAdapter
fragmentPagerAdapter = new FragmentPagerAdapter(getFragmentManager()) {
@Override
public Fragment getItem(int i) {
return list.get(i);
}
@Override
public int getCount() {
return list.size();
}
}; //初始化 适配器
myPagerAdapter = new PagerAdapter() {
//返回显示多少项
@Override
public int getCount() {
return myContiontar.size();
} @Override
public boolean isViewFromObject(View view, Object o) {
return view == o;
}
//滑动切换时,移除当前组件
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(myContiontar.get(position));
}
//每次滑动时生成的组件
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(myContiontar.get(position));
return myContiontar.get(position);
}
};
//设置适配器
myViewPager.setAdapter(myPagerAdapter);
//设置fragment适配器
// myViewPager.setAdapter(fragmentPagerAdapter);
}
}
布局文件fragment.xml也很简单,不多说了,我就直接上代码了。
<?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"> <FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"
android:gravity="center|bottom">
<android.support.v4.view.ViewPager
android:id="@+id/first_fragment_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center|bottom">
<ImageView
android:id="@+id/first_fragment_down_image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/wallet_coin_purse_guide_purse_dot_normal"/>
<ImageView
android:id="@+id/first_fragment_down_image2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/wallet_coin_purse_guide_purse_dot_normal"/>
<ImageView
android:id="@+id/first_fragment_down_image3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/wallet_coin_purse_guide_purse_dot_normal"/>
<ImageView
android:id="@+id/first_fragment_down_image4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/wallet_coin_purse_guide_purse_dot_normal"/>
<ImageView
android:id="@+id/first_fragment_down_image5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/wallet_coin_purse_guide_purse_dot_normal"/>
</LinearLayout> </FrameLayout>
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2.5"
android:background="@color/fitst_fragment_image_color"/>
</LinearLayout>
效果图:
ViewPager+Fragment实现滑动显示,且Fragment里面又放Fragment+viewPager的更多相关文章
- fragment中嵌套viewpager,vierpager中有多个fragment,不显示 .
fragment中嵌套viewpager,vierpager中有多个fragment,不显示 ... 现在好多应用流行一种布局.底部几个工具栏选项,上面也有类似tab的选项. 底部用RadioGrou ...
- 兔子--Fragment与ViewPager要切换滑动效果
效果图: 文件夹结构: 代码分析: MainActivity.java package com.example.myfragment; /** * @author Arthur Lee * @time ...
- Android Studio 使用ViewPager + Fragment实现滑动菜单Tab效果 --简易版
描述: 之前有做过一个记账本APP,拿来练手的,做的很简单,是用Eclipse开发的: 最近想把这个APP重新完善一下,添加了一些新的功能,并选用Android Studio来开发: APP已经完善了 ...
- Android Viewpager+Fragment实现滑动标签页
ViewPager 结合Fragment实现一个Activity里包含多个可滑动的标签页,每个标签页可以有独立的布局及响应. 主页布局 <?xml version="1.0" ...
- Android:Fragment+ViewPager实现Tab滑动
public class FragAdapter extends FragmentPagerAdapter { private List<Fragment> fragments ; pub ...
- Fragment利用ViewPager实现左右滑动--第三方开源--SlidingTabLayout和SlidingTabStrip实现
MainActivity: package com.zzw.fragmentteb; import java.util.ArrayList; import android.graphics.Color ...
- Android Fragment 隐藏或显示时调用的生命周期方法
Fragment使用方式大体分两种: 大家要注意不同的Fragment使用方法,Fragment隐藏和显示调用的生命周期方法是不同的,以下是Fragment显示隐藏调用的方法: //判断是否展示—与V ...
- 创建多个Fragment可滑动界面
创建新项目,选择Tabbed Activity 默认就有2个Fragment,这里我们删除相关代码. 在切换时 FragmentPagerAdapter onDestroyView onCreateV ...
- 【Android Developers Training】 70. 使用ViewPager实现屏幕滑动
注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...
随机推荐
- 是否连接VPN
//需要导入ifadds头文件 //是否连接VPN - (BOOL)isVPNConnected{ struct ifaddrs *interfaces = NULL; struct ...
- UVa10603 倒水 Fill-状态空间搜索
https://vjudge.net/problem/UVA-10603 There are three jugs with a volume of a, b and c liters. (a, b, ...
- centos atomic host第一次启动
centos atomic host安装完成会,第一次启动时会调用cloud-init等服务.这是个什么东东? cloud-init用于在创建虚拟机时通过元数据服务对虚拟机基本配置,包括常见的主机名, ...
- Qt中QObject中的parent参数
今天写了一个小程序,验证了带参的构造函数中参数parent的作用. 在MainWindow中声明一个QDialog类型的指针,在MainWindow中对它进行初始化.我采用了两种初始化方式,一种是带参 ...
- boost: tcp client sample
#include <boost/asio.hpp> #include <iostream> using namespace std; using namespace boost ...
- windows上修改路由表
1.查看电脑中的路由的命令: route print 2.修改“metric”,值越小权限越高: route add 0.0.0.0 mask 0.0.0.0 192.168.1.1 metric 5 ...
- Ninject依赖注入——构造函数的注入
1.Ninject简介 Ninject是基于.Net平台的依赖注入框架,它能够将应用程序分离成一个个高内聚.低耦合(loosely-coupled, highly-cohesive)的模块,然后以一种 ...
- JS正则表达式使用方法及示例
1.定义正则表达式: a.普通方式:var reg=/表达式/附加参数 附件参数: g:代表可以进行全局匹配.i:代表不区分大小写匹配.m:代表可以进行多行匹配. 上面三个参数,可以任意组合,代表复合 ...
- Uva 1588 Kickdown
这道题思路并不难想,在做题过程中主要遇到的困难有: 因为没有仔细的考虑边界情况,没有分析全面,导致因=没有取到而得不出正确结果,浪费的大量时间. 今后在做这类题目时,一定要先进行一个比较全面的分析+模 ...
- win7防火墙打不开(无法启动windows firewall服务)
点击windows 7控制面板中防火墙的“推荐配置”没有反应:打开“服务”,无法启动windows firewall,并报错. 可能很多的win7用户都碰到过这样的一种情况,那就是win7的防火墙打 ...