完美逆向百度手机助手5.0底部菜单栏 - Android Tabhost 点击动画



先看看百度手机助手5.0的样子：

发现他是用一个CustomTabHost.java来实现底部TabHost点击效果的，很漂亮，点击Tab的时候文字会上跑，图片会从底部跑出来的一个小动画。

下面我用自己的方法逆袭了他的CustomTabHost，感觉用起来比它的好用，而且简单不少！

本文只给出关键代码，需要工程的自行下载：

package com.wj.ring5577.ui;

import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.widget.TabHost;
import android.widget.TabHost.OnTabChangeListener;

import com.wj.ring5577.R;

public class MainActivity extends FragmentActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        TabHost tabHost = (TabHost) findViewById(R.id.tabhost);
        tabHost.setup(); // Call setup() before adding tabs if loading TabHost
                         // using findViewById().

        final WJTabMenuView mv = (WJTabMenuView) LayoutInflater.from(this)
                .inflate(R.layout.test, null);
        mv.setText("Tag A");
        final WJTabMenuView mv2 = (WJTabMenuView) LayoutInflater.from(this)
                .inflate(R.layout.test, null);
        mv2.setText("Tag B");
        final WJTabMenuView mv3 = (WJTabMenuView) LayoutInflater.from(this)
                .inflate(R.layout.test, null);
        mv3.setText("Tag C");
        final WJTabMenuView mv4 = (WJTabMenuView) LayoutInflater.from(this)
                .inflate(R.layout.test, null);
        mv4.setText("Tag D");

        tabHost.setOnTabChangedListener(new OnTabChangeListener() {
            @Override
            public void onTabChanged(String tabId) {
                mv.unSelected();
                mv2.unSelected();
                mv3.unSelected();
                mv4.unSelected();
                if (tabId.equals("taba")) {
                    mv.selected();
                } else if (tabId.equals("tabb")) {
                    mv2.selected();
                } else if (tabId.equals("tabc")) {
                    mv3.selected();
                } else if (tabId.equals("tabd")) {
                    mv4.selected();
                }
            }
        });

        tabHost.addTab(tabHost.newTabSpec("taba").setIndicator(mv)
                .setContent(R.id.tab1));
        tabHost.addTab(tabHost.newTabSpec("tabb").setIndicator(mv2)
                .setContent(R.id.tab2));
        tabHost.addTab(tabHost.newTabSpec("tabc").setIndicator(mv3)
                .setContent(R.id.tab3));
        tabHost.addTab(tabHost.newTabSpec("tabd").setIndicator(mv4)
                .setContent(R.id.tab4));

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

}

package com.wj.ring5577.ui;

import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.widget.TabHost;
import android.widget.TabHost.OnTabChangeListener;

import com.wj.ring5577.R;

public class MainActivity extends FragmentActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        TabHost tabHost = (TabHost) findViewById(R.id.tabhost);
        tabHost.setup(); // Call setup() before adding tabs if loading TabHost
                         // using findViewById().

        final WJTabMenuView mv = (WJTabMenuView) LayoutInflater.from(this)
                .inflate(R.layout.test, null);
        mv.setText("Tag A");
        final WJTabMenuView mv2 = (WJTabMenuView) LayoutInflater.from(this)
                .inflate(R.layout.test, null);
        mv2.setText("Tag B");
        final WJTabMenuView mv3 = (WJTabMenuView) LayoutInflater.from(this)
                .inflate(R.layout.test, null);
        mv3.setText("Tag C");
        final WJTabMenuView mv4 = (WJTabMenuView) LayoutInflater.from(this)
                .inflate(R.layout.test, null);
        mv4.setText("Tag D");

        tabHost.setOnTabChangedListener(new OnTabChangeListener() {
            @Override
            public void onTabChanged(String tabId) {
                mv.unSelected();
                mv2.unSelected();
                mv3.unSelected();
                mv4.unSelected();
                if (tabId.equals("taba")) {
                    mv.selected();
                } else if (tabId.equals("tabb")) {
                    mv2.selected();
                } else if (tabId.equals("tabc")) {
                    mv3.selected();
                } else if (tabId.equals("tabd")) {
                    mv4.selected();
                }
            }
        });

        tabHost.addTab(tabHost.newTabSpec("taba").setIndicator(mv)
                .setContent(R.id.tab1));
        tabHost.addTab(tabHost.newTabSpec("tabb").setIndicator(mv2)
                .setContent(R.id.tab2));
        tabHost.addTab(tabHost.newTabSpec("tabc").setIndicator(mv3)
                .setContent(R.id.tab3));
        tabHost.addTab(tabHost.newTabSpec("tabd").setIndicator(mv4)
                .setContent(R.id.tab4));

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

}

package com.wj.ring5577.ui;

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.wj.ring5577.R;

/**
 * Tab底部菜单视图
 *
 * @author Harris
 *
 */
public class WJTabMenuView extends LinearLayout {
    private TextView mTextView = null;
    private ImageView mImageView = null;
    private boolean interruptFlag;
    private Context mContext;
    private Animation mAnim_txt;
    private Animation mAnim_img;

    public WJTabMenuView(Context context) {
        super(context);
        mContext = context;
    }

    public WJTabMenuView(Context context, AttributeSet attrs) {
        super(context, attrs);

        LayoutInflater layoutInflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        layoutInflater.inflate(R.layout.wjtabmenulayout, this);
        mTextView = (TextView) findViewById(R.id.wjtabmenu_tv);
        mImageView = (ImageView) findViewById(R.id.wjtabmenu_iv);
        mContext = context;
        mAnim_txt = AnimationUtils.loadAnimation(mContext,
                R.anim.bottommenu_txt_anim);
        mAnim_txt.setAnimationListener(new AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                if (!interruptFlag) {
                    mTextView.setVisibility(View.GONE);
                }
            }
        });

        mAnim_img = AnimationUtils.loadAnimation(mContext,
                R.anim.bottommenu_img_anim);
    }

    public void setText(String title) {
        mTextView.setText(title);
    }

    /**
     * 放弃选择
     */
    public void unSelected() {
        interruptFlag = true;
        clearAnimation();
        mTextView.setVisibility(View.VISIBLE);
    }

    /**
     * 选中
     */
    public void selected() {
        interruptFlag = false;
        mTextView.startAnimation(mAnim_txt);
        mImageView.startAnimation(mAnim_img);
    }
}

package com.wj.ring5577.ui;

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.wj.ring5577.R;

/**
 * Tab底部菜单视图
 * 
 * @author Harris
 * 
 */
public class WJTabMenuView extends LinearLayout {
    private TextView mTextView = null;
    private ImageView mImageView = null;
    private boolean interruptFlag;
    private Context mContext;
    private Animation mAnim_txt;
    private Animation mAnim_img;

    public WJTabMenuView(Context context) {
        super(context);
        mContext = context;
    }

    public WJTabMenuView(Context context, AttributeSet attrs) {
        super(context, attrs);

        LayoutInflater layoutInflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        layoutInflater.inflate(R.layout.wjtabmenulayout, this);
        mTextView = (TextView) findViewById(R.id.wjtabmenu_tv);
        mImageView = (ImageView) findViewById(R.id.wjtabmenu_iv);
        mContext = context;
        mAnim_txt = AnimationUtils.loadAnimation(mContext,
                R.anim.bottommenu_txt_anim);
        mAnim_txt.setAnimationListener(new AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                if (!interruptFlag) {
                    mTextView.setVisibility(View.GONE);
                }
            }
        });

        mAnim_img = AnimationUtils.loadAnimation(mContext,
                R.anim.bottommenu_img_anim);
    }

    public void setText(String title) {
        mTextView.setText(title);
    }

    /**
     * 放弃选择
     */
    public void unSelected() {
        interruptFlag = true;
        clearAnimation();
        mTextView.setVisibility(View.VISIBLE);
    }

    /**
     * 选中
     */
    public void selected() {
        interruptFlag = false;
        mTextView.startAnimation(mAnim_txt);
        mImageView.startAnimation(mAnim_img);
    }
}

试一试 点击下载 。
源码：

http://download.csdn.net/detail/h3c4lenovo/5992279