有时有这样一个需求,页面底部有几个图标可以点击,如果一个screenWidth显示不下这些图标,则这一列图标最后一个是more,点击more,可以通过动画展示两列图标
这样来加入layout中:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF" >
<include
android:id="@+id/title"
layout="@layout/title_list" />
<View
android:id="@+id/line"
android:layout_width="fill_parent"
android:layout_height="2dip"
android:layout_below="@id/title"
android:background="@drawable/rc_list_divider" />
<ListView
android:id="@+id/mylist"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/title"
android:background="@null"
android:cacheColorHint="@color/bgColorMain"
android:divider="@null"
android:dividerHeight="0dp"
android:fadeScrollbars="false"
android:visibility="gone" >
</ListView>
<LinearLayout
android:id="@+id/loading_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="@id/line"
android:background="@color/white"
android:gravity="center" >
<ProgressBar
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom" >
<strong> <com.example.view.ExpandableView
android:id="@+id/launcher_expand_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" /></strong>
</RelativeLayout>
</FrameLayout>
代码里这样来写:
private void prepareLauncherView() {
mRootView = LayoutInflater.from(this).inflate(R.layout.activity_main, null);
setContentView(mRootView);
DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
int screenWidth = dm.widthPixels;
int height = dm.heightPixels;
//取出底部几个Button的图标资源
mLauncherDrawables = getResources().obtainTypedArray(R.array.launcher_item_drawables);
mExpandableView = (ExpandableView) findViewById(R.id.launcher_expand_view);
mItemViews = new ArrayList<View>();
for (int i = 0; i < mLauncherDrawables.length(); i++) {
addLauncherItem(i);
}
//点击more的时候响应(执行TransLate动画)
mExpandableView.setOnExpandItemClickListener(this);
int contentHeight = height - getStatusBarHeight();
mExpandableView.setScreenSize(contentHeight, screenWidth);
mExpandableView.addListView(mItemViews);
}
@Override
protected void onStart() {
super.onStart();
mExpandableView.setRestart(true);
}
private int getStatusBarHeight() { <strong>//这个是取statusbar高度的做法</strong>
Class<?> c = null;
Object obj = null;
Field field = null;
int x = 0, sbar = 0;
try {
c = Class.forName("com.android.internal.R$dimen");
obj = c.newInstance();
field = c.getField("status_bar_height");
x = Integer.parseInt(field.get(obj).toString());
sbar = getResources().getDimensionPixelSize(x);
} catch (Exception e1) {
e1.printStackTrace();
}
return sbar;
}
private void addLauncherItem(int i) {
View view = LayoutInflater.from(this).inflate(R.layout.launch_bar_item, null).findViewById(R.id.launcher_content);
view.setBackgroundDrawable(mLauncherDrawables.getDrawable(i));
mItemViews.add(view);
}
@Override
public void onExpandItemClick(View parentView, View view, int position, int maxNum, int line) {
if (!mExpandableView.isInAnimation()) {
if (position != maxNum) {
mExpandableView.excuteAnimation(false);
} else {
mExpandableView.excuteAnimation(true);
}
}
}
关于 ExpandableView这个类:
package com.example.view;
import java.util.List;
import com.example.shoplistdownload.R;
import android.content.Context;
import android.content.res.Configuration;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.view.animation.Animation.AnimationListener;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
public class ExpandableView extends LinearLayout {
private int mScreenWidth;
private int mScreenHeight;
private int mButtonWidth;
private int mButtonHeight;
private LinearLayout mLayoutShow;
private LinearLayout mLayoutHide;
private ExpandItemClickListener onExpandItemClickListener;
private int mMaxNum;
private boolean mIsInAnimation = false;
private boolean mCanMoveToBottom = false;
private View mMoreView;
private int mOldBottom;
private Context mContext;
private int mHeaderHeight;
private double mAverageSize;
private boolean mIsFirstLayout= true;
private LinearLayout.LayoutParams mParams;
private boolean mRestart = false;
private LayoutInflater mInflater;
public static final int LAUNCHER_BAR_LINE_ONE = 0;
public static final int LAUNCHER_BAR_LINE_TWO = 1;
private static final boolean LAUNCHER_HIDE_LAYOUT_TAG = true;
public ExpandableView(Context context, AttributeSet attrs) {
super(context, attrs);
mContext = context;
mInflater = LayoutInflater.from(mContext);
}
public void setScreenSize(int height, int width) {
mScreenHeight = height;
mScreenWidth = width;
initParameter();
initSubView();
}
private void initParameter(){
mButtonWidth = mContext.getResources().getDimensionPixelSize(R.dimen.expand_item_minwidth);
mButtonHeight = mContext.getResources().getDimensionPixelSize(R.dimen.expand_item_minheight);
mHeaderHeight = mContext.getResources().getDimensionPixelSize(R.dimen.header_bar_height);
mMaxNum = mScreenWidth / mButtonWidth;
mAverageSize = ((double) mScreenWidth) / mMaxNum;
this.setOrientation(LinearLayout.VERTICAL);
}
public void addListView(List<View> views) {
setPortraitView(views);
//mLayoutShow为第一列
addView(mLayoutShow);
//mLayoutHide为第二列,第一次展示时会隐藏
addView(mLayoutHide);
}
private void initSubView() {
mMoreView = mInflater.inflate(R.layout.launch_bar_item, null).findViewById(R.id.launcher_content);
mMoreView.setBackgroundResource(R.drawable.btn_launcher_more);
mMoreView.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
mRestart = false;
onExpandItemClickListener.onExpandItemClick(mLayoutShow, v, mMaxNum, mMaxNum, LAUNCHER_BAR_LINE_ONE);
}
});
mLayoutShow = new LinearLayout(mContext);
mLayoutHide = new LinearLayout(mContext);
mLayoutHide.setTag(LAUNCHER_HIDE_LAYOUT_TAG);
mParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, mButtonHeight);
mLayoutShow.setOrientation(LinearLayout.HORIZONTAL);
mLayoutHide.setOrientation(LinearLayout.HORIZONTAL);
mLayoutShow.setBackgroundResource(R.drawable.bg_launcher_port_nor);
mLayoutHide.setBackgroundResource(R.drawable.bg_launcher_port_nor);
mLayoutShow.setLayoutParams(mParams);
mLayoutHide.setLayoutParams(mParams);
}
private void setPortraitView(List<View> views) {
if (views.size() > mMaxNum) {
//将底部Button加入mLayoutShow和mLayoutHide
mLayoutShow = adjustPortraitView(mLayoutShow, 0, mMaxNum - 1, views, true);
mLayoutHide = adjustPortraitView(mLayoutHide, mMaxNum - 1, views.size(), views, false);
} else {
//如果底部图标数比较少,那么mLayoutHide就永远隐藏
mLayoutHide.setVisibility(View.GONE);
mLayoutShow = adjustPortraitView(mLayoutShow, 0, views.size(), views, false);
}
}
private LinearLayout adjustPortraitView(LinearLayout layout, int start, int end, List<View> views, boolean isAddMore) {
for (int i = start; i < end; i++) {
final View view = views.get(i);
view.setLayoutParams(new LayoutParams((int) mAverageSize, LayoutParams.FILL_PARENT));
view.setTag(i);
setClick(layout, view, LAUNCHER_BAR_LINE_ONE);
layout.addView(view);
}
if (isAddMore) {
mMoreView.setLayoutParams(new LayoutParams((int)mAverageSize, LayoutParams.FILL_PARENT));
mLayoutShow.addView(mMoreView);
}
return layout;
}
private void setClick(final LinearLayout layout, final View view, final int line) {
view.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
mRestart = false;
if (onExpandItemClickListener != null) {
onExpandItemClickListener.onExpandItemClick(layout, view, (Integer) view.getTag(), mMaxNum, line);
}
}
});
}
public boolean isInAnimation() {
return mIsInAnimation;
}
public boolean isCanMoveToBottom(){
//这里根据getBottom来判断页面只是展示mLayoutShow或是同时展示mLayoutShow和mLayoutHide
//如果getBottom() < mOldBottom,这个时候就是页面只有mlayoutShow,因为mLayoutShow和mLayoutHide同时存在时显然getBottom比较大
if (mLayoutHide != null && mLayoutHide.getVisibility() == View.VISIBLE) {
int bottom = this.getBottom();
if (bottom > mOldBottom) {
mCanMoveToBottom = false;
} else if(bottom <= mOldBottom) {
mCanMoveToBottom = true;
}
}
return mCanMoveToBottom;
}
public void excuteAnimation(boolean isClickMore) {
if (mLayoutHide != null && mLayoutHide.getVisibility() == View.VISIBLE) {
if (!mIsInAnimation) {
if (isCanMoveToBottom()) {
mIsInAnimation = true;
mMoreView.setSelected(false);
//这个动画是向下的
this.startAnimation(getAnimation(true, 0, 0, 0, mButtonHeight));
mCanMoveToBottom = false;
} else {
if (isClickMore) {
mIsInAnimation = true;
mMoreView.setSelected(true);
//这个动画是向上的
this.startAnimation(getAnimation(false, 0, 0, 0, -mButtonHeight));
mCanMoveToBottom = true;
}
}
}
}
}
private Animation getAnimation(final boolean moToBottom, int fromXDelta, final int toXDelta,
int fromYDelta, final int toYDelta) {
TranslateAnimation animation = new TranslateAnimation(fromXDelta,
toXDelta, fromYDelta, toYDelta);
animation.setDuration(200);
animation.setFillAfter(true);
animation.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationRepeat(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
ExpandableView.this.clearAnimation();
ExpandableView.this.layout(ExpandableView.this.getLeft(),
(ExpandableView.this.getTop() + toYDelta),
ExpandableView.this.getRight(),
(ExpandableView.this.getBottom() + toYDelta));
mIsInAnimation = false;
}
});
return animation;
}
public void setOnExpandItemClickListener(ExpandItemClickListener listener) {
onExpandItemClickListener = listener;
}
public interface ExpandItemClickListener {
void onExpandItemClick(final View parentView, View view, int position, int maxNum, int line);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
super.onLayout(changed, l, t, r, b);
if (mLayoutHide != null && mLayoutHide.getVisibility() == View.VISIBLE) {
if(mIsFirstLayout && this.getWidth() > 0){
mIsFirstLayout = false;
mOldBottom = this.getBottom();
this.layout(this.getLeft(), (this.getTop() + mHeaderHeight), this.getRight(), (this.getBottom() + mHeaderHeight));
}
//如果是第一次显示该view,mLayoutHide是不显示的
if (mRestart && this.getBottom() <= mOldBottom && !mIsFirstLayout) {
this.layout(this.getLeft(), (this.getTop() + mHeaderHeight), this.getRight(), (this.getBottom() + mHeaderHeight));
}
}
}
public void setRestart(boolean restart){
mRestart = restart;
}
}
代码: http://download.csdn.net/download/baidu_nod/7748987