logo资料库

ViewPager 与 Fragment相结合实现微信界面实例代码.pdf

第1页 / 共5页
第2页 / 共5页
第3页 / 共5页
第4页 / 共5页
第5页 / 共5页
资料共5页,全文预览结束
ViewPager 与与 Fragment相结合实现微信界面实例代码 相结合实现微信界面实例代码 在如今的互联网时代,微信已是一个超级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:
android:layout_height="match_parent" android:layout_weight="1"> layout_top.xml layout_bottom.xml
android:layout_weight="1">   上面有提到,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 mList = new ArrayList(); public ViewPagerFragmentAdapter(FragmentManager fm , List 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 mFragmentList = new ArrayList(); @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相结合实现微信界面实例代码,希望对大家有所帮助,如果大家有任何 疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对软件开发网网站的支持! 您可能感兴趣的文章:ViewPager+RadioGroup仿微信主界面Android UI设计与开发之ViewPager仿微信引导界面以及动画效果 您可能感兴趣的文章 使用ViewPage+Fragment仿微信界面
分享到:
收藏