您的位置:首页 > 移动开发

仿iPhone《最美应用》app的底部滑动菜单效果

2015-05-12 19:33 357 查看
线上效果图:



上代码:

核心类:CustomLayout .java

public class CustomLayout extends FrameLayout{
private static final String TAG = CustomLayout.class.getSimpleName();
private LinearLayout ll_bottom;
private View rootView;
private List<ImageView> imageViews=new ArrayList<ImageView>();
private List<Point> points=new ArrayList<Point>();
private Context context;
private int singleImageWidth;
private int singleImageHeight;
private int bannerHeight;
private int lastPosition=-1;
private int count;

public CustomLayout(Context context, AttributeSet attrs) {
super(context, attrs);
this.context=context;
rootView=LayoutInflater.from(context).inflate(R.layout.custom_layout,this);
ll_bottom=(LinearLayout) rootView.findViewById(R.id.ll_bottom);
fillImages();
count=imageViews.size();
showImages();
}

@Override
protected void onLayout(boolean changed, int left, int top, int right,int bottom) {
Log.i(TAG, "left="+left+",top="+top+",right="+right+",bottom="+bottom+"--->onLayout()");
bannerHeight=getHeight();
Log.i(TAG, "底部横幅高度:"+bannerHeight);
singleImageWidth=imageViews.get(0).getWidth();
singleImageHeight=imageViews.get(0).getHeight();
Log.i(TAG, "一张图片的宽度:"+singleImageWidth);
Log.i(TAG, "一张图片的高度:"+singleImageHeight);

super.onLayout(changed, left, top, right, bottom);
}

@SuppressLint("ClickableViewAccessibility")
@Override
public boolean onTouchEvent(MotionEvent event) {
float x=event.getX();
int index=(int)(x/singleImageWidth);
if(!checkIndex(imageViews, index)){
return true;
}
int action=event.getAction();
switch(action){
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
if(lastPosition!=index){
up(index);
}
lastPosition=index;
break;
case MotionEvent.ACTION_UP:
down(index);
//只做个简单的toast
Toast.makeText(getContext(),"index:"+index, Toast.LENGTH_SHORT).show();
break;
}
return true;
}

/**
* 上升
* @param index
* @since 2015-5-12下午7:25:42
* @author cuixingwang
*/
private void up(int index){
final int selectImageTop=bannerHeight-singleImageHeight;
ImageView selectimageView=imageViews.get(index);
selectimageView.layout(selectimageView.getLeft(),selectImageTop,selectimageView.getRight(),selectImageTop+singleImageHeight);

for (int i = index-1; i >=0; i--) {
ImageView imageView=imageViews.get(i);
int top=selectImageTop+(index-i)*10;

int duration=150;
anim(imageView,top,duration+=20*i);
imageView.layout(imageView.getLeft(),top,imageView.getRight(),top+singleImageHeight);
}

for (int i = index; i < count; i++) {
ImageView imageView=imageViews.get(i);
int top=selectImageTop+(i-index)*10;
int duration=150;
anim(imageView,top,duration+=20*i);
imageView.layout(imageView.getLeft(),top,imageView.getRight(),top+singleImageHeight);
}
}

/**
* 下降
* @param index
* @since 2015-5-12下午7:25:49
* @author cuixingwang
*/
private void down(int index) {
for (int i = 0; i < count; i++) {
if(i!=index){
ImageView imageView=imageViews.get(i);
int top=bannerHeight-10;
int duration=200;
anim(imageView,top,duration+=20*i);
imageView.layout(imageView.getLeft(),top,imageView.getRight(),top+singleImageHeight);
}
}
}

/**
* 动画
* @param view
* @param height
* @param duration
* @since 2015-5-12下午7:25:56
* @author cuixingwang
*/
@SuppressLint("NewApi")
private void anim(View view,int height,int duration){
ObjectAnimator
.ofFloat(view, "y",height)//
.setDuration(duration)
.start();
}

/**
* 检查是否越界
* @param imageViews
* @param index
* @return
* @since 2015-5-11下午5:04:19
* @author cuixingwang
*/
private boolean checkIndex(List<ImageView> imageViews,int index){
return index<count;
}

private void showImages() {
for (int i = 0; i < count; i++) {
ll_bottom.addView(imageViews.get(i));
}
}

private void addImages(int imageResId) {
ImageView imageView=new ImageView(context);
imageView.setImageResource(imageResId);
imageViews.add(imageView);
}

private void fillImages() {
addImages(R.drawable.a1);
addImages(R.drawable.a2);
addImages(R.drawable.a3);
addImages(R.drawable.a4);
addImages(R.drawable.a5);
addImages(R.drawable.a6);
addImages(R.drawable.a7);
addImages(R.drawable.a8);
}
}


MainActivity.java

public class MainActivity extends Activity {
private static final String TAG = MainActivity.class.getSimpleName();

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


activity_layout.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:layout_gravity="bottom"
tools:context="com.example.iphone.MainActivity" >

<com.example.iphone.CustomLayout
android:layout_gravity="bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>

</LinearLayout>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: