素描石膏像,张娴琳,拜托了冰箱第三季嘉宾
在如今的互联网时代，微信已是一个超级app。这篇通过viewpager + fragment实现一个类似于微信的界面，之前有用fragmenttabhost实现过类似界面，viewpager的实现方式相对于fragmenttabhost的方式更简单明了。
viewpager:
viewpager继承自viewgroup,是一个容器类，可以往里添加view.
viewpager的使用很简单，通过setadapter()方法设置一个pageradapter即可，这个pageradapter需要自己写，实现里面的一些方法。本篇要和fragment结合，所以实现的是fragmentpageradapter类，fragmentpageradapter继承自pageradapter.
viewpager通过addonpagechangelistener（）方法可以设置一个viewpager.onpagechangelistener监听，当pager发生变化时就调用相应的方法。
fragment:
fragment有自己的生命周期， 有兴趣的可以自己通过各种方式研究下（自己打log看是最简单的一种方式），这里就不在赘述。和viewpager结合，有几个pager就需要实现几个不同的fragment.
先看一下最后实现的效果图：
布局上分为三部分：
最上面的layout_top.xml,主要就是上面那个标题，就一个textview，中间的viewpager,最下面的layout_bottom.xml包括三个线性布局，每个线性布局包括一个imageview和textview.
activity_main.xml:
<?xml version="1.0" encoding="utf-8"?> <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="com.example.administrator.viewpagerl.mainactivity"> <include layout="@layout/layout_top"></include> <android.support.v4.view.viewpager android:id="@+id/viewpagerlayout" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1"> </android.support.v4.view.viewpager> <include layout="@layout/layout_bottom"></include> </linearlayout>
layout_top.xml
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:paddingtop="3dp" android:paddingbottom="3dp" android:background="@android:color/darker_gray"> <textview android:id="@+id/viewtitle" android:layout_marginleft="20dp" android:layout_margintop="5dp" android:textsize="25sp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </linearlayout>
layout_bottom.xml
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignparentbottom="true" android:paddingtop="3dp" android:paddingbottom="3dp" android:background="@android:color/holo_green_light"> <linearlayout android:id="@+id/firstlinearlayout" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" android:gravity="center_horizontal" android:layout_weight="1"> <imageview android:id="@+id/firstimageview" android:background="@drawable/tab_weixin" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <textview android:id="@+id/firsttextview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="微信" /> </linearlayout> <linearlayout android:id="@+id/secondlinearlayout" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" android:gravity="center_horizontal" android:layout_weight="1"> <imageview android:id="@+id/secondimageview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/tab_setting"/> <textview android:id="@+id/secondtextview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="朋友" /> </linearlayout> <linearlayout android:id="@+id/threelinearlayout" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" android:gravity="center_horizontal" android:layout_weight="1"> <imageview android:id="@+id/threeimageview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/tab_find"/> <textview android:id="@+id/threetextview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="发现" /> </linearlayout> </linearlayout>
上面有提到，viewpager需要实现一个pageradapter，很简单继承fragmentpageradapter,实现里面的getitem()和getcount()方法即可。
viewpagerfragmentadapter .java
我要评论
package com.example.administrator.viewpagerl;
import android.support.v4.app.fragment;
import android.support.v4.app.fragmentmanager;
import android.support.v4.app.fragmentpageradapter;
import android.util.log;
import java.util.arraylist;
import java.util.list;
public class viewpagerfragmentadapter extends fragmentpageradapter {
private list<fragment> mlist = new arraylist<fragment>();
public viewpagerfragmentadapter(fragmentmanager fm , list<fragment> list) {
super(fm);
this.mlist = list;
}
@override
public fragment getitem(int position) {
return mlist.get(position);
}
@override
public int getcount() {
return mlist != null ? mlist.size() : 0;
}
}
viewpager的每个pager都需要一个fragment,fragment会实例化布局，显示在viewpager的每个pager中
chatfragment.java
package com.example.administrator.fragment;
import android.os.bundle;
import android.support.annotation.nullable;
import android.support.v4.app.fragment;
import android.util.log;
import android.view.layoutinflater;
import android.view.view;
import android.view.viewgroup;
import android.widget.textview;
import com.example.administrator.viewpagerl.r;
public class chatfragment extends fragment {
view mview;
@nullable
@override
public view oncreateview(layoutinflater inflater, @nullable viewgroup container, @nullable bundle savedinstancestate) {
if (mview == null) {
mview = inflater.inflate(r.layout.fragment_layout,null);
}
((textview)mview.findviewbyid(r.id.mtextview)).settext("聊天界面");
return mview;
}
}
这里需要三个fragment,因为这里使用的布局很简单，三个布局基本是一致的，friendfragment、findfragment 这里就都不贴出代码了。微信里面的聊天列表，朋友列表都是在fragment里面实例化的布局里有个listview,通过listview的方式实现的，这里只是为了记录viewpager就没有实现那些，有兴趣的可以自己搞搞，其实也不难。
在activity里面只需要给viewpager设置上面那个adapter,设置一个监听知道pager如何变化即可。点击最下面微信、朋友、发现三个按钮，通过viewpager的setcurrentitem()方法就能跳转到对应的pager，除了这些还有就是通过一些简单的逻辑，控制一下界面的改变就行，没有太难的东西。
mainactivity.java
package com.example.administrator.viewpagerl;
import android.support.v4.app.fragment;
import android.support.v4.app.fragmentmanager;
import android.support.v4.view.viewpager;
import android.support.v7.app.appcompatactivity;
import android.os.bundle;
import android.util.log;
import android.view.view;
import android.widget.linearlayout;
import android.widget.textview;
import com.example.administrator.fragment.chatfragment;
import com.example.administrator.fragment.findfragment;
import com.example.administrator.fragment.friendfragment;
import java.util.arraylist;
import java.util.list;
public class mainactivity extends appcompatactivity implements view.onclicklistener {
private static final string tag = "mainactivity.tag";
textview titletextview;
public linearlayout firstlinearlayout;
public linearlayout secondlinearlayout;
public linearlayout threelinearlayout;
viewpager mviewpager;
viewpagerfragmentadapter mviewpagerfragmentadapter;
fragmentmanager mfragmentmanager;
string[] titlename = new string[] {"微信","朋友","发现"};
list<fragment> mfragmentlist = new arraylist<fragment>();
@override
protected void oncreate(bundle savedinstancestate) {
super.oncreate(savedinstancestate);
mfragmentmanager = getsupportfragmentmanager();
setcontentview(r.layout.activity_main);
initfragmetlist();
mviewpagerfragmentadapter = new viewpagerfragmentadapter(mfragmentmanager,mfragmentlist);
initview();
initviewpager();
}
@override
protected void onresume() {
super.onresume();
}
public void initviewpager() {
mviewpager.addonpagechangelistener(new viewpagetonpagerchangedlisenter());
mviewpager.setadapter(mviewpagerfragmentadapter);
mviewpager.setcurrentitem(0);
titletextview.settext(titlename[0]);
updatebottomlinearlayoutselect(true,false,false);
}
public void initfragmetlist() {
fragment chat = new chatfragment();
fragment friend = new friendfragment();
fragment find = new findfragment();
mfragmentlist.add(chat);
mfragmentlist.add(friend);
mfragmentlist.add(find);
}
public void initview() {
titletextview = (textview) findviewbyid(r.id.viewtitle);
mviewpager = (viewpager) findviewbyid(r.id.viewpagerlayout);
firstlinearlayout = (linearlayout) findviewbyid(r.id.firstlinearlayout);
firstlinearlayout.setonclicklistener(this);
secondlinearlayout = (linearlayout) findviewbyid(r.id.secondlinearlayout);
secondlinearlayout.setonclicklistener(this);
threelinearlayout = (linearlayout) findviewbyid(r.id.threelinearlayout);
threelinearlayout.setonclicklistener(this);
}
@override
public void onclick(view v) {
switch (v.getid()) {
case r.id.firstlinearlayout:
mviewpager.setcurrentitem(0);
updatebottomlinearlayoutselect(true,false,false);
break;
case r.id.secondlinearlayout:
mviewpager.setcurrentitem(1);
updatebottomlinearlayoutselect(false,true,false);
break;
case r.id.threelinearlayout:
mviewpager.setcurrentitem(2);
updatebottomlinearlayoutselect(false,false,true);
break;
default:
break;
}
}
private void updatebottomlinearlayoutselect(boolean f, boolean s, boolean t) {
firstlinearlayout.setselected(f);
secondlinearlayout.setselected(s);
threelinearlayout.setselected(t);
}
class viewpagetonpagerchangedlisenter implements viewpager.onpagechangelistener {
@override
public void onpagescrolled(int position, float positionoffset, int positionoffsetpixels) {
// log.d(tag,"onpagescrooled");
}
@override
public void onpageselected(int position) {
log.d(tag,"onpageselected");
boolean[] state = new boolean[titlename.length];
state[position] = true;
titletextview.settext(titlename[position]);
updatebottomlinearlayoutselect(state[0],state[1],state[2]);
}
@override
public void onpagescrollstatechanged(int state) {
log.d(tag,"onpagescrollstatechanged");
}
}
}
以上所述是小编给大家介绍的viewpager 与 fragment相结合实现微信界面实例代码，希望对大家有所帮助
如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复
Android studio开发小型对话机器人app(实例代码)
Android通过Java sdk的方式接入OpenCv的方法
Android 通过cmake的方式接入opencv的方法步骤
Android Studio finish()方法的使用与解决app点击“返回”(直接退出)
Android 进度条 ProgressBar的实现代码(隐藏、出现、加载进度)
网友评论