欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android仿微信左右滑動點(diǎn)擊切換頁面和圖標(biāo)

 更新時間：2019年05月27日 10:53:15   作者：Vivinia_Vivinia  
這篇文章主要為大家詳細(xì)介紹了Android仿微信左右滑動點(diǎn)擊切換頁面和圖標(biāo)，具有一定的參考價值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了Android仿微信左右滑動點(diǎn)擊切換頁面和圖標(biāo)的具體代碼，供大家參考，具體內(nèi)容如下

目標(biāo)效果：

使用鼠標(biāo)滑動屏幕或者點(diǎn)擊下邊的小圖標(biāo)，可以更改頁面和圖標(biāo)，因?yàn)闆]有那么多素材所以只用了兩張圖片區(qū)分。

1.layout文件夾下新建top.xml頁面，作為頂部標(biāo)題。

top.xml頁面：

<?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:gravity="center"
  android:background="#000000"
  android:orientation="vertical" >
 
  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="微信"
    android:textColor="#ffffff"
    android:textSize="20sp"
    android:layout_gravity="center"
    android:textStyle="bold" />
 
</LinearLayout>

2.新建bottom.xml頁面，作為底部導(dǎo)航。

bottom.xml頁面：

<?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="55dp"
  android:background="#000000"
  android:orientation="horizontal" >
 
  <!-- ImageButton沒加android:clickable="false"時，點(diǎn)擊下方的ImageBuutton不會改變頁面，點(diǎn)擊TextView才會改變頁面，這是因?yàn)槊總€tab是一個LinearLayout，每個LinearLayout都有一個ImageButton，當(dāng)點(diǎn)擊ImageButton位置時，點(diǎn)擊事件首先會到LinearLayout上，LinearLayout會去判斷，發(fā)現(xiàn)內(nèi)部有一個ImageButton可以解決點(diǎn)擊事件，所以就把點(diǎn)擊事件交給ImageButton，而ImageButton又沒有寫點(diǎn)擊事件，所以點(diǎn)擊事件就失效了。-->
 
  <LinearLayout
    android:id="@+id/tab_weixin"
    android:layout_width="0dp"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:gravity="center"
    android:orientation="vertical" >
 
    <ImageButton
      android:id="@+id/tab_weixin_img"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="#000000"
      android:clickable="false"
      android:src="@drawable/search" />
 
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="微信"
      android:textColor="#ffffff" />
  </LinearLayout>
 
  <LinearLayout
    android:id="@+id/tab_friend"
    android:layout_width="0dp"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:gravity="center"
    android:orientation="vertical" >
 
    <ImageButton
      android:id="@+id/tab_friend_img"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="#000000"
      android:clickable="false"
      android:src="@drawable/study" />
 
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="朋友"
      android:textColor="#ffffff" />
  </LinearLayout>
 
  <LinearLayout
    android:id="@+id/tab_tongxunlu"
    android:layout_width="0dp"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:gravity="center"
    android:orientation="vertical" >
 
    <ImageButton
      android:id="@+id/tab_tongxunlu_img"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="#000000"
      android:clickable="false"
      android:src="@drawable/study" />
 
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="通訊錄"
      android:textColor="#ffffff" />
  </LinearLayout>
 
  <LinearLayout
    android:id="@+id/tab_set"
    android:layout_width="0dp"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:gravity="center"
    android:orientation="vertical" >
 
    <ImageButton
      android:id="@+id/tab_set_img"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="#000000"
      android:clickable="false"
      android:src="@drawable/study" />
 
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="設(shè)置"
      android:textColor="#ffffff" />
  </LinearLayout>
 
</LinearLayout>

這里注意ImageButton的clickable屬性，如果不設(shè)置false，那么鼠標(biāo)點(diǎn)擊不起作用，只有點(diǎn)擊下邊的TextView才會跳轉(zhuǎn)頁面。

3.新建tab01.xml頁面，復(fù)制三個，只更改顯示文本，作為切換頁面。

tab01.xml頁面：

<?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" >
  
  <TextView 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:text="Weixin Tab"
    android:textSize="30sp"
    android:textStyle="bold"
    android:gravity="center"/>
</LinearLayout>

4.activity_main.xml頁面導(dǎo)入頂部和底部xml文件，并放置ViewPager。

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">
 
  <include layout="@layout/top"/>
  
  <android.support.v4.view.ViewPager
    android:id="@+id/id_viewpager"
    android:layout_weight="1"
    android:layout_width="fill_parent"
    android:layout_height="0dp">
    
  </android.support.v4.view.ViewPager>
  <include layout="@layout/bottom"/>
</LinearLayout>

5.因?yàn)閂iewPager是在jar包里，添加該控件需要寫出路徑，當(dāng)記不住的時候，按下Ctrl+Shift+t，彈出框里輸入“ViewPager”并選擇，顯示的頁面中就包含該控件的路徑。

6.新建pageAdapter.java，繼承PageAdapter，實(shí)現(xiàn)四個方法。

pageAdapter.java頁面：

package com.example.adapter;
 
import java.util.List;
 
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
 
public class pageAdapter extends PagerAdapter {
 private List<View> mViews;
 
 public pageAdapter(List<View> mViews) {
 this.mViews = mViews;
 }
 
 /**
 * 重寫四個方法 boolean isViewFromObject(View arg0, Object arg1) int getCount()
 * void destroyItem(ViewGroup container, int position,Object object) Object
 * instantiateItem(ViewGroup container, int position)
 */
 
 // 從當(dāng)前container中刪除指定位置的view
 @Override
 public void destroyItem(ViewGroup container, int position, Object object) {
 container.removeView(mViews.get(position));
 }
 
 // 初始化view
 @Override
 public Object instantiateItem(ViewGroup container, int position) {
 View view = mViews.get(position);
 container.addView(view);
 return view;
 }
 
 @Override
 public boolean isViewFromObject(View arg0, Object arg1) {
 return arg0 == arg1;
 }
 
 // 返回要滑動的view個數(shù)
 @Override
 public int getCount() {
 return mViews.size();
 }
 
}

7.MainActivity.java頁面編寫點(diǎn)擊和滑動事件。

MainActivity.java頁面：

package com.example.studytab;
 
import java.util.ArrayList;
import java.util.List;
 
import com.example.adapter.pageAdapter;
 
import android.os.Bundle;
import android.app.Activity;
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.Menu;
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 MainActivity extends Activity implements OnClickListener {
 
 private ViewPager mViewPager;
 private List<View> mViews = new ArrayList<View>();
 private pageAdapter mAdapter = new pageAdapter(mViews);
 
 // Tab
 private LinearLayout mTabWeixin, mTabFriend, mTabTongxunlu, mTabSet;
 private ImageButton mWeixinImg, mFriendImg, mTongxunluImg, mSetImg;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 requestWindowFeature(Window.FEATURE_NO_TITLE);// 去掉標(biāo)題
 setContentView(R.layout.activity_main);
 
 initView();
 
 initEvents();
 }
 
 //View的滑動事件
 private void initEvents() {
 mTabWeixin.setOnClickListener(this);
 mTabFriend.setOnClickListener(this);
 mTabTongxunlu.setOnClickListener(this);
 mTabSet.setOnClickListener(this);
 
 //滑動切換頁面
 mViewPager.setOnPageChangeListener(new OnPageChangeListener() {
 
  @Override
  public void onPageSelected(int arg0) {
  resetImg();  //將圖片全部默認(rèn)為不選中
  int currentItem = mViewPager.getCurrentItem();
  switch (currentItem) {
  case 0:
   mWeixinImg.setImageResource(R.drawable.search);
   break;
  case 1:
   mFriendImg.setImageResource(R.drawable.search);
   break;
  case 2:
   mTongxunluImg.setImageResource(R.drawable.search);
   break;
  case 3:
   mSetImg.setImageResource(R.drawable.search);
   break;
 
  default:
   break;
  }
  }
 
  @Override
  public void onPageScrolled(int arg0, float arg1, int arg2) {
 
  }
 
  @Override
  public void onPageScrollStateChanged(int arg0) {
 
  }
 });
 }
 
 //實(shí)例化控件
 private void initView() {
 mViewPager = (ViewPager) findViewById(R.id.id_viewpager);
 // Tab
 mTabWeixin = (LinearLayout) findViewById(R.id.tab_weixin);
 mTabFriend = (LinearLayout) findViewById(R.id.tab_friend);
 mTabTongxunlu = (LinearLayout) findViewById(R.id.tab_tongxunlu);
 mTabSet = (LinearLayout) findViewById(R.id.tab_set);
 // img
 mWeixinImg = (ImageButton) findViewById(R.id.tab_weixin_img);
 mFriendImg = (ImageButton) findViewById(R.id.tab_friend_img);
 mTongxunluImg = (ImageButton) findViewById(R.id.tab_tongxunlu_img);
 mSetImg = (ImageButton) findViewById(R.id.tab_set_img);
 
 LayoutInflater mInflater = LayoutInflater.from(this);
 View tab01 = mInflater.inflate(R.layout.tab01, null);
 View tab02 = mInflater.inflate(R.layout.tab02, null);
 View tab03 = mInflater.inflate(R.layout.tab03, null);
 View tab04 = mInflater.inflate(R.layout.tab04, null);
 
 mViews.add(tab01);
 mViews.add(tab02);
 mViews.add(tab03);
 mViews.add(tab04);
 
 mViewPager.setAdapter(mAdapter);
 }
 
 //ImageButton的點(diǎn)擊事件
 @Override
 public void onClick(View view) {
 resetImg();
 switch (view.getId()) {
 case R.id.tab_weixin:
  mViewPager.setCurrentItem(0);// 跳到第一個頁面
  mWeixinImg.setImageResource(R.drawable.search); // 圖片變?yōu)檫x中
  break;
 case R.id.tab_friend:
  mViewPager.setCurrentItem(1);
  mFriendImg.setImageResource(R.drawable.search);
  break;
 case R.id.tab_tongxunlu:
  mViewPager.setCurrentItem(2);
  mTongxunluImg.setImageResource(R.drawable.search);
  break;
 case R.id.tab_set:
  mViewPager.setCurrentItem(3);
  mSetImg.setImageResource(R.drawable.search);
  break;
 
 default:
  break;
 }
 }
 
 // 將所有的圖片切換為未選中
 private void resetImg() {
 mWeixinImg.setImageResource(R.drawable.study);
 mFriendImg.setImageResource(R.drawable.study);
 mTongxunluImg.setImageResource(R.drawable.study);
 mSetImg.setImageResource(R.drawable.study);
 }
 
}

8.運(yùn)行就可以顯示目標(biāo)效果了。

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論