因为素材的原因,这里都是从网上找的图片,所以所谓的仿微信实际上最后成了下图这货。。。,点击变色也是自己用的windows自带画图的颜料桶填充的空白。。。
直接上主代码:
package com.example.tabandviewpage ; import java.util.ArrayList; import java.util.List; import android.app.Activity; import android.os.Bundle; import android.support.v4.view.PagerAdapter; import android.support.v4.view.ViewPager; import android.support.v4.view.ViewPager.OnPageChangeListener; import android.view.LayoutInflater; import android.view.View; import android.view.View.OnClickListener; import android.view.ViewGroup; import android.view.Window; import android.widget.ImageButton; import android.widget.LinearLayout; public class Main extends Activity implements OnClickListener{ private ViewPager viewpager ; private ImageButton chat_list ,contacts ,friends,aboutme ; private List<View> list ; @Override protected void onCreate(Bundle savedInstanceState) { // TODO Auto-generated method stub super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE) ; setContentView(R.layout.main); list = new ArrayList<View>() ; this.viewpager = (ViewPager) findViewById(R.id.viewpager) ; initView() ; this.chat_list.setOnClickListener(this); this.contacts.setOnClickListener(this); this.friends.setOnClickListener(this); this.aboutme.setOnClickListener(this); this.viewpager.setOnPageChangeListener(new OnPageChangeListener() { @Override public void onPageSelected(int arg0) { // TODO Auto-generated method stub int position = viewpager.getCurrentItem() ; resetImg(); if(position ==0) { chat_list.setImageResource(R.drawable.btn_chat_anxia); } else if(position == 1) { contacts.setImageResource(R.drawable.btn_contacts_anxia); } else if(position == 2) { friends.setImageResource(R.drawable.btn_rest_anxia); } else if(position == 3) { aboutme.setImageResource(R.drawable.btn_aboutme_anxia); } } @Override public void onPageScrolled(int arg0, float arg1, int arg2) { // TODO Auto-generated method stub } @Override public void onPageScrollStateChanged(int arg0) { // TODO Auto-generated method stub } }); } void initView() { // TODO Auto-generated method stub this.chat_list = (ImageButton) findViewById(R.id.chat_list) ; this.contacts = (ImageButton) findViewById(R.id.contacts) ; this.friends = (ImageButton) findViewById(R.id.friends) ; this.aboutme = (ImageButton) findViewById(R.id.aboutme) ; //LinearLayout tab_chat_list = (LinearLayout)findViewById(R.id.chat_list) ; //LinearLayout tab_contacts = (LinearLayout)findViewById(R.id.tab_contacts) ; //LinearLayout tab_friends = (LinearLayout) findViewById(R.id.tab_friends) ; //LinearLayout tab_aboutme = (LinearLayout)findViewById(R.id.tab_aboutme) ; LayoutInflater mf = getLayoutInflater().from(this) ; View tab_01 = mf.inflate(R.layout.tab_chat_list, null) ; View tab_02 =mf.inflate(R.layout.tab_contacts, null) ; View tab_03 = mf.inflate(R.layout.tab_friends, null) ; View tab_04 = mf.inflate(R.layout.tab_aboutme, null) ; this.list.add(tab_01) ; this.list.add(tab_02) ; this.list.add(tab_03) ; this.list.add(tab_04) ; PagerAdapter adapter = new PagerAdapter() { @Override public boolean isViewFromObject(View arg0, Object arg1) { // TODO Auto-generated method stub return arg0 == arg1 ; } @Override public int getCount() { // TODO Auto-generated method stub return list.size() ; } @Override public void destroyItem(ViewGroup container, int position, Object object) { // TODO Auto-generated method stub container.removeView(list.get(position)); } @Override public Object instantiateItem(ViewGroup container, int position) { // TODO Auto-generated method stub View view = list.get(position) ; container.addView(view) ; return view; } }; viewpager.setAdapter(adapter); } @Override public void onClick(View v) { // TODO Auto-generated method stub resetImg() ; switch(v.getId()) { case R.id.chat_list: this.chat_list.setImageResource(R.drawable.btn_chat_anxia); viewpager.setCurrentItem(0); break ; case R.id.contacts: this.contacts.setImageResource(R.drawable.btn_contacts_anxia); viewpager.setCurrentItem(1); break ; case R.id.friends : this.friends.setImageResource(R.drawable.btn_rest_anxia) ; viewpager.setCurrentItem(2); break ; case R.id.aboutme : this.aboutme.setImageResource(R.drawable.btn_aboutme_anxia); viewpager.setCurrentItem(3); break ; } } private void resetImg() { // TODO Auto-generated method stub this.chat_list.setImageResource(R.drawable.btn_chat); this.contacts.setImageResource(R.drawable.btn_contacts); this.friends.setImageResource(R.drawable.btn_rest); this.aboutme.setImageResource(R.drawable.btn_aboutme); } }
主activity布局:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <include layout="@layout/top"/> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1"/> <include layout="@layout/bottom"/> </LinearLayout>
顶部布局
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="45dp" android:background="#303030" android:orientation="vertical" > <TextView android:text="微信" android:textColor="#FFFFFF" android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="20sp"/> </LinearLayout>
底部布局:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:baselineAligned="false" android:background="#FFFFFF" android:layout_height="wrap_content" android:orientation="horizontal" > <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:orientation="vertical"> <ImageButton android:id="@+id/chat_list" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/selector" android:src="@drawable/btn_chat"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="聊天" android:textSize="20sp"/> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:orientation="vertical"> <ImageButton android:id="@+id/contacts" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/selector" android:src="@drawable/btn_contacts"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="联系人" android:textSize="20sp"/> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:orientation="vertical"> <ImageButton android:id="@+id/friends" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/selector" android:src="@drawable/btn_rest"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="朋友圈" android:textSize="15sp"/> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:orientation="vertical"> <ImageButton android:id="@+id/aboutme" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/selector" android:src="@drawable/btn_aboutme"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="个人中心" android:textSize="20sp"/> </LinearLayout> </LinearLayout>