在写商城或者其他类型的项目时，通常会遇到各种选择列表。可能刚开始的时候还多人都是写死布局，因为没有写死布局干不来的事，但是这样太喽了，不如亲手打造一个万能的，不用再写死布局。
一、创建ListDataScreenView继承LinearLayout
public class ListDataScreenView extends LinearLayout {
private Context mContext;
public ListDataScreenView(Context context) {
this(context, null);
}
public ListDataScreenView(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
public ListDataScreenView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mContext = context;
}
二、实例化布局 （组合控件）
private void initLayout() {
// 1. 先创建一个 xml 布局 ，再加载，findViewById
setOrientation(VERTICAL);
// 1.1 创建头部用来存放 Tab
mMenuTabView = new LinearLayout(mContext);
mMenuTabView.setLayoutParams(new LinearLayout.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
addView(mMenuTabView);
// 1.2 创建 FrameLayout 用来存放 = 阴影（View） + 菜单内容布局(FrameLayout)
mMenuMiddleView = new FrameLayout(mContext);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT, 0);
params.weight = 1;
mMenuMiddleView.setLayoutParams(params);
addView(mMenuMiddleView);
// 创建阴影 可以不用设置 LayoutParams 默认就是 MATCH_PARENT ，MATCH_PARENT
mShadowView = new View(mContext);
mShadowView.setBackgroundColor(mShadowColor);
mShadowView.setAlpha(0f);
mShadowView.setOnClickListener(this);
mShadowView.setVisibility(GONE);
mMenuMiddleView.addView(mShadowView);
// 创建菜单用来存放菜单内容
mMenuContainerView = new FrameLayout(mContext);
mMenuContainerView.setBackgroundColor(Color.WHITE);
mMenuMiddleView.addView(mMenuContainerView);
}
三、重写onMeasure
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
Log.e("TAG", "onMeasure");
int height = MeasureSpec.getSize(heightMeasureSpec);
if (mMenuContainerHeight == 0 && height > 0) {
// 内容的高度应该不是全部 应该是整个 View的 75%
mMenuContainerHeight = (int) (height * 75f / 100);
ViewGroup.LayoutParams params = mMenuContainerView.getLayoutParams();
params.height = mMenuContainerHeight;
mMenuContainerView.setLayoutParams(params);
// 进来的时候阴影不显示 ，内容也是不显示的（把它移上去）
mMenuContainerView.setTranslationY(-mMenuContainerHeight);
}
}
四、 设置 Adapter
public void setAdapter(BaseMenuAdapter adapter) {
this.mAdapter = adapter;
// 获取有多少条
int count = mAdapter.getCount();
for (int i = 0; i < count; i++) {
// 获取菜单的Tab
View tabView = mAdapter.getTabView(i, mMenuTabView);
mMenuTabView.addView(tabView);
LinearLayout.LayoutParams params = (LayoutParams) tabView.getLayoutParams();
params.weight = 1;
tabView.setLayoutParams(params);
// 设置tab点击事件
setTabClick(tabView, i);
// 获取菜单的内容
View menuView = mAdapter.getMenuView(i, mMenuContainerView);
menuView.setVisibility(GONE);
mMenuContainerView.addView(menuView);
}
}
五、关闭和打开方法
/**
* 关闭菜单
*/
private void closeMenu() {
if (mAnimatorExecute) {
return;
}
// 关闭动画 位移动画 透明度动画
ObjectAnimator translationAnimator = ObjectAnimator.ofFloat(mMenuContainerView, "translationY", 0, -mMenuContainerHeight);
translationAnimator.setDuration(DURATION_TIME);
translationAnimator.start();
mShadowView.setVisibility(View.VISIBLE);
ObjectAnimator alphaAnimator = ObjectAnimator.ofFloat(mShadowView, "alpha", 1f, 0f);
alphaAnimator.setDuration(DURATION_TIME);
// 要等关闭动画执行完才能去隐藏当前菜单
alphaAnimator.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
View menuView = mMenuContainerView.getChildAt(mCurrentPosition);
menuView.setVisibility(View.GONE);
mCurrentPosition = -1;
mShadowView.setVisibility(GONE);
mAnimatorExecute = false;
}
@Override
public void onAnimationStart(Animator animation) {
mAnimatorExecute = true;
mAdapter.menuClose(mMenuTabView.getChildAt(mCurrentPosition));
}
});
alphaAnimator.start();
}
/**
* 打开菜单
*
* @param position
* @param tabView
*/
private void openMenu(final int position, final View tabView) {
if (mAnimatorExecute) {
return;
}
mShadowView.setVisibility(View.VISIBLE);
// 获取当前位置显示当前菜单，菜单是加到了菜单容器
View menuView = mMenuContainerView.getChildAt(position);
menuView.setVisibility(View.VISIBLE);
// 打开开启动画 位移动画 透明度动画
ObjectAnimator translationAnimator = ObjectAnimator.ofFloat(mMenuContainerView, "translationY", -mMenuContainerHeight, 0);
translationAnimator.setDuration(DURATION_TIME);
translationAnimator.start();
ObjectAnimator alphaAnimator = ObjectAnimator.ofFloat(mShadowView, "alpha", 0f, 1f);
alphaAnimator.setDuration(DURATION_TIME);
alphaAnimator.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
mAnimatorExecute = false;
mCurrentPosition = position;
}
@Override
public void onAnimationStart(Animator animation) {
mAnimatorExecute = true;
// 把当前的 tab 传到外面
mAdapter.menuOpen(tabView);
}
});
alphaAnimator.start();
}
六、 设置tab的点击
private void setTabClick(final View tabView, final int position) {
tabView.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (mCurrentPosition == -1) {
// 没打开
openMenu(position, tabView);
} else {
if (mCurrentPosition == position) {
// 打开了,关闭
closeMenu();
} else {
// 切换一下显示
View currentMenu = mMenuContainerView.getChildAt(mCurrentPosition);
currentMenu.setVisibility(View.GONE);
mAdapter.menuClose(mMenuTabView.getChildAt(mCurrentPosition));
mCurrentPosition = position;
currentMenu = mMenuContainerView.getChildAt(mCurrentPosition);
currentMenu.setVisibility(View.VISIBLE);
mAdapter.menuOpen(mMenuTabView.getChildAt(mCurrentPosition));
}
}
}
});
}
七、创建Adapter
public abstract class BaseMenuAdapter {
// 获取总共有多少条
public abstract int getCount();
// 获取当前的TabView
public abstract View getTabView(int position, ViewGroup parent);
// 获取当前的菜单内容
public abstract View getMenuView(int position,ViewGroup parent);
/**
* 菜单打开
* @param tabView
*/
public void menuOpen(View tabView) {
}
/**
* 菜单关闭
* @param tabView
*/
public void menuClose(View tabView) {
}
}
八、使用
< com.demo.view.ListDataScreenView
android:id="@+id/list_data_view"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
adapter应用
public class ListScreenMenuAdapter extends BaseMenuAdapter{
private Context mContext;
public ListScreenMenuAdapter(Context context){
this.mContext = context;
}
private String[] mItems ={"类型","品牌","价格","更多"};
@Override
public int getCount() {
return mItems.length;
}
@Override
public View getTabView(int position, ViewGroup parent) {
TextView tabView = (TextView) LayoutInflater.from(mContext).inflate(R.layout.ui_list_data_screen_tab,parent,false);
tabView.setText(mItems[position]);
tabView.setTextColor(Color.BLACK);
return tabView;
}
@Override
public View getMenuView(int position, ViewGroup parent) {
// 真正开发过程中，不同的位置显示的布局不一样
TextView menuView = (TextView) LayoutInflater.from(mContext).inflate(R.layout.ui_list_data_screen_menu,parent,false);
menuView.setText(mItems[position]);
return menuView;
}
@Override
public void menuClose(View tabView) {
TextView tabTv = (TextView) tabView;
tabTv.setTextColor(Color.BLACK);
}
@Override
public void menuOpen(View tabView) {
TextView tabTv = (TextView) tabView;
tabTv.setTextColor(Color.RED);
}
}