源代码地址 http://download.csdn.net/detail/u013210620/8791687

先看主页面布局activity_main

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#d1d1d1"
android:orientation="vertical" > <RelativeLayout
android:id="@+id/list_layout_visible"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_marginLeft="0dp" >
</RelativeLayout> <!-- tab三选项 --> <LinearLayout
android:id="@+id/mainTab"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:background="@drawable/bottom_bg"
android:orientation="horizontal" > <ImageView
android:id="@+id/iv_tab_communication"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/bottom_sms_p" /> <ImageView
android:id="@+id/iv_tab_contacts"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/bottom_contacts_p" /> <ImageView
android:id="@+id/iv_tab_dail"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/bottom_dial_p" /> <ImageView
android:id="@+id/iv_tab_temp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/bottom_dial_p"
android:visibility="gone" />
</LinearLayout> </RelativeLayout>

再看代码块(有凝视)

package com.example.commonpager;

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.view.LayoutInflater;
import android.view.View;
import android.view.WindowManager;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout; public class MainActivity extends Activity implements OnClickListener {
/** 内容区域 */
private RelativeLayout list_layout_visible;
/** Tab4键 */
private LinearLayout mainTab;
private ImageView iv_tab_communication, iv_tab_contacts, iv_tab_dail,iv_tab_temp;
/** 当前的Tab键 */
private ImageView middleTab;
/**页面载入器*/
private LayoutInflater mLayoutInflater;
/**初始化布局view*/
private View mBaseLayoutView;
private boolean isStartAnimation = true; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
initView();
} private void initView() {
mLayoutInflater = LayoutInflater.from(this);
mBaseLayoutView = mLayoutInflater.inflate(R.layout.activity_main, null);
// 获取
list_layout_visible = (RelativeLayout) mBaseLayoutView
.findViewById(R.id.list_layout_visible);
mainTab = (LinearLayout) mBaseLayoutView.findViewById(R.id.mainTab);
iv_tab_communication = (ImageView) mBaseLayoutView
.findViewById(R.id.iv_tab_communication);
iv_tab_contacts = (ImageView) mBaseLayoutView
.findViewById(R.id.iv_tab_contacts);
iv_tab_dail = (ImageView) mBaseLayoutView
.findViewById(R.id.iv_tab_dail);
iv_tab_temp = (ImageView) mBaseLayoutView
.findViewById(R.id.iv_tab_temp);
/**动态载入布局文件*/
mLayoutInflater.inflate(R.layout.content_contacts, list_layout_visible);
//展现页面
setContentView(mBaseLayoutView);
//设置监听事件
iv_tab_communication.setOnClickListener(this);
iv_tab_contacts.setOnClickListener(this);
iv_tab_dail.setOnClickListener(this);
//初始化当前按键是contact按键
middleTab = iv_tab_contacts;
} @Override
public void onClick(View v) {
switch (v.getId()) {
/***思路同iv_tab_contacts*/
case R.id.iv_tab_communication:
if (middleTab == iv_tab_communication) {
return;
}
list_layout_visible.removeAllViews();
mLayoutInflater.inflate(R.layout.content_msg, list_layout_visible);
startAnimation(iv_tab_communication);
break;
case R.id.iv_tab_contacts:
//初始化点击通讯录按键,不做处理事件,直接返回
if (middleTab == iv_tab_contacts) {
return;
}
//假设载入过之前的消息或者拨号界面。先removeall界面,然后在载入通讯录界面
list_layout_visible.removeAllViews();
mLayoutInflater.inflate(R.layout.content_contacts,
list_layout_visible);
//载入通讯录界面时候。启动动画效果
startAnimation(iv_tab_contacts);
break;
/***思路同iv_tab_contacts*/
case R.id.iv_tab_dail:
if (middleTab == iv_tab_dail) {
return;
}
list_layout_visible.removeAllViews();
mLayoutInflater.inflate(R.layout.content_dail, list_layout_visible);
startAnimation(iv_tab_dail);
break;
default:
break;
}
} private void startAnimation(final ImageView clickTab) {
ImageView otherTab = null;
float otherTab_start, otherTab_end;
float tempTab_start, tempTab_end;
// 消息不在中间,没点击信息
if (iv_tab_communication != clickTab
&& iv_tab_communication != middleTab) {
otherTab = iv_tab_communication;
}
if (iv_tab_contacts != clickTab && iv_tab_contacts != middleTab) {
otherTab = iv_tab_contacts;
}
if (iv_tab_dail != clickTab && iv_tab_dail != middleTab) {
otherTab = iv_tab_dail;
}
setbottomView(); iv_tab_temp.setBackground(null);
iv_tab_temp.setBackground(otherTab.getBackground()); if (otherTab.getX() > middleTab.getX()) {
otherTab_start = clickTab.getX()
- (otherTab.getX() - middleTab.getX());
otherTab_end = clickTab.getX();
tempTab_start = otherTab.getX();
tempTab_end = otherTab.getX()
+ (otherTab.getX() - middleTab.getX());
} else {
otherTab_start = clickTab.getX()
+ (clickTab.getX() - middleTab.getX());
otherTab_end = clickTab.getX();
tempTab_start = otherTab.getX();
tempTab_end = otherTab.getX()
- (clickTab.getX() - middleTab.getX());
} AnimatorSet set = new AnimatorSet();
set.playTogether(ObjectAnimator.ofFloat(clickTab, "x", clickTab.getX(),
middleTab.getX()), ObjectAnimator.ofFloat(middleTab, "x",
middleTab.getX(), otherTab.getX()), ObjectAnimator.ofFloat(
iv_tab_temp, "x", tempTab_start, tempTab_end), ObjectAnimator
.ofFloat(otherTab, "x", otherTab_start, otherTab_end)); set.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator anim) {
} @Override
public void onAnimationStart(Animator anim) {
middleTab = clickTab;
}
});
set.setDuration(1 * 600).start();
} private void setbottomView() { DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int width = metrics.widthPixels;// 屏幕的宽dp
LinearLayout.LayoutParams para;
para = (LinearLayout.LayoutParams) iv_tab_communication
.getLayoutParams();
para.width = width / 3;
para.weight = 0;
iv_tab_communication.setLayoutParams(para); para = (LinearLayout.LayoutParams) iv_tab_contacts.getLayoutParams();
para.width = width / 3;
para.weight = 0;
iv_tab_contacts.setLayoutParams(para); para = (LinearLayout.LayoutParams) iv_tab_dail.getLayoutParams();
para.width = width / 3;
para.weight = 0;
iv_tab_dail.setLayoutParams(para); para = (LinearLayout.LayoutParams) iv_tab_temp.getLayoutParams();
para.width = width / 3;
para.weight = 0;
iv_tab_temp.setVisibility(View.VISIBLE); } }

然后是3个Tab键相应的測试页面

content_contacts.xml

<?

xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tv_tip_no_record"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="14dp"
android:shadowDx="0"
android:shadowDy="2"
android:shadowRadius="2"
android:text="contact!!!"
android:textColor="#888"
android:textSize="20dp"
android:typeface="sans" />

content_msg.xml

<?xml version="1.0" encoding="utf-8"?

>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" > <TextView
android:id="@+id/tv_tip_no_record"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="14dp"
android:shadowDx="0"
android:shadowDy="2"
android:shadowRadius="2"
android:text="msg!!!"
android:textColor="#888"
android:textSize="20dp"
android:typeface="sans" /> </RelativeLayout>

content_dail.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" > <TextView
android:id="@+id/tv_tip_no_record"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="14dp"
android:shadowDx="0"
android:shadowDy="2"
android:shadowRadius="2"
android:text="msg!!!"
android:textColor="#888"
android:textSize="20dp"
android:typeface="sans" /> </RelativeLayout>

实现页面切换(动画效果实现,不用ViewPager)的更多相关文章

  1. react实现页面切换动画效果

    一.前情概要 注:(我使用的路由是react-router4)     如下图所示,我们需要在页面切换时有一个过渡效果,这样就不会使页面切换显得生硬,用户体验大大提升:     but the 问题是 ...

  2. Windows Phone使用sliverlight toolkit实现页面切换动画效果

    使用应用时,好多app在页面切换的时候都有一个动画效果,感觉很炫,也大大增加了用户体验,怎么实现呢? 界面的切换,可以用Windows Phone Toolkit中的TransitionService ...

  3. 超炫的 CSS3 页面切换动画效果

    在线演示      源码下载

  4. 基于vue2.0打造移动商城页面实践 vue实现商城购物车功能 基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果

    基于vue2.0打造移动商城页面实践 地址:https://www.jianshu.com/p/2129bc4d40e9 vue实现商城购物车功能 地址:http://www.jb51.net/art ...

  5. (原)android中的动画(三)之动画监听&页面切换动画

    1.动画也可以设置监听事件,例如在动画结束时需要执行某操作 把要执行的代码写在onAnimationEnd()回调方法中即可: anim.setAnimationListener(new Animat ...

  6. iOS页面切换动画实现方式。

    iOS页面切换动画实现方式. 1.使用UIView animateWithDuration:animations:completion方法 Java代码 [UIView animateWithDura ...

  7. Activity 切换动画和页面切换动画

    public class MainActivity extends Activity { private ViewFlipper viewFlipper; private float startX; ...

  8. Angular 全局页面切换动画 me-pageloading

    最近看了Codrops的一篇文章, 里面讲到了一个页面切换的效果, 详情点击此处. 看了这个效果感觉很赞, 觉得这个效果可以用在angular的页面切换中, 所以将这个效果移植到angular中, 做 ...

  9. 简单实现图片间的切换动画 主要用到ViewPager

    简单实现图片间的切换动画 主要用到ViewPagerViewPager是android扩展包v4包中的类,这个类可以让用户左右切换当前的view.ViewPager类需要一个PagerAdapter适 ...

  10. QtQuick多页面切换、多页面切换动画、多个qml文件数据交互

    一.QtQuick多页面切换方法 (1)“隐藏法” 前一个视图visible设为false或者透明度opacity设为0,相当于“隐藏”了,实际还存在: 要显示的视图visible设为true或者透明 ...

随机推荐

  1. 零基础学习 Python 之字符串

    初识字符串 维基百科对于字符串的定义式:字符串是由零个或者多个字符组成的有限串行.你之前学会敲的第一行 print 代码里的 "Hello World",就是一个字符串.字符串的本 ...

  2. Selenium - WebDriver: Waits

    These days most of the web apps are using AJAX techniques. When a page is loaded to browser, the ele ...

  3. ansible Failed to connect to the host via ssh: no such identity: /root/.ssh/id_rsa.bak

    中控机和远端主机配置完密钥后,在中控台上通过ansible检测联通性 ansible -i inventory.cfg all -m ping 10.1.1.1 | UNREACHABLE! => ...

  4. unity中的main方法

    由于方法命名的原因,无意之间把一个方法命名为了Main,然后把这个方放到了Start方法中去执行,结果运行后发现这个方法竟然执行了两次 情况如下图: -------------- 检查代码,发现脚本并 ...

  5. Ubuntu下建立Pycharm快捷方式

    修改 Exec, Icon 路径,将文件保存 pycharm.desktop,拖到unity侧边栏 [Desktop Entry]Categories=Development;Comment[zh_C ...

  6. BZOJ 1087:[SCOI2005]互不侵犯King(状压DP)

    [SCOI2005]互不侵犯King [题目描述] 在N×N的棋盘里面放K个国王,使他们互不攻击,共有多少种摆放方案.国王能攻击到它上下左右,以及左上左下右上右下八个方向上附近的各一个格子,共8个格子 ...

  7. HDU——2089 不要62

    不要62 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...

  8. BZOJ 3224 普通平衡树(Treap模板题)

    3224: Tyvj 1728 普通平衡树 Time Limit: 10 Sec  Memory Limit: 128 MB Submit: 14301  Solved: 6208 [Submit][ ...

  9. POJ 3683 Priest John's Busiest Day(2-SAT+方案输出)

    Priest John's Busiest Day Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 10010   Accep ...

  10. BZOJ3997 [TJOI2015]组合数学 【Dilworth定理】

    题目 给出一个网格图,其中某些格子有财宝,每次从左上角出发,只能向下或右走.问至少走多少次才能将财宝捡完.此对此问题变形,假设每个格子中有好多财宝,而每一次经过一个格子至多只能捡走一块财宝,至少走多少 ...