笔记:
米多大众app:产品中心效果原型优化
大概效果:listview向上滑动,顶部view做动画,顶部view可以左右滑动
效果:
代码:要滑动到顶部的时候可以左右滑动,那么外层需要是个HorizontalScrollView
开始想要在滑动listview的时候动态改变horizontalscrollview子view的宽度,但是发现这个宽度没法改变,这个宽度是由子view的总宽度决定的,所以之呢过加个辅助view,一个像素的宽度,动态改变这个view的宽度
代码:
package cn.edu.sxu.www.changeheadheight;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AbsListView;
import android.widget.HorizontalScrollView;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ListView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private ListView listview;
private MyAdapter myAdapter;
private List<String> lists;
private View headView;
private ImageView iv_2;
private ImageView iv_3;
private View key_view;
private HorizontalScrollView horizontalScrollView;
private LinearLayout ll_parent;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iv_2= (ImageView) findViewById(R.id.iv_2);
iv_3= (ImageView) findViewById(R.id.iv_3);
headView= LayoutInflater.from(this).inflate(R.layout.head,null);
listview= (ListView) findViewById(R.id.listview);
key_view=findViewById(R.id.key_view);
ll_parent= (LinearLayout) findViewById(R.id.ll_parent);
horizontalScrollView= (HorizontalScrollView) findViewById(R.id.horizontalScrollView);
lists=new ArrayList<>();
for(int i=0;i<20;i++)
{
lists.add(""+i);
}
myAdapter=new MyAdapter(this,lists);
listview.addHeaderView(headView);
listview.setAdapter(myAdapter);
listview.setOnScrollListener(new AbsListView.OnScrollListener() {
@Override
public void onScrollStateChanged(AbsListView view, int scrollState) {
}
@Override
public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
changeHeadHeight(getScrollY());
}
});
}
private void changeHeadHeight(int height)
{
Log.e("abc",height+"aaaaaaa");
if (height > 500) height = 500;
ViewGroup.LayoutParams layoutParams = ll_parent.getLayoutParams();
layoutParams.height = 750-height;
ll_parent.setLayoutParams(layoutParams);
ViewGroup.LayoutParams kayParams = key_view.getLayoutParams();
kayParams.width = 500+2*height;
key_view.setLayoutParams(kayParams);
makeAnimation(height*1.0f/500);
}
private void makeAnimation(float fraction)
{
iv_2.setTranslationY(evaluate(fraction,0,-250));
iv_2.setTranslationX(evaluate(fraction,0,500));
iv_3.setTranslationY(evaluate(fraction,0,-500));
iv_3.setTranslationX(evaluate(fraction,0,1000));
}
/**
* @param fraction 变换因子
* @param startValue 起始值
* @param endValue 结束指
* @return
*/
public Float evaluate(float fraction, Number startValue, Number endValue) {
float startFloat = startValue.floatValue();
return startFloat + fraction * (endValue.floatValue() - startFloat);
}
/**
* 使用与listview的item高度都相同的情况,head无所谓
* @return
*/
public int getScrollY() {
View c = listview.getChildAt(0);
if (c == null) {
return 0;
}
int firstVisiblePosition = listview.getFirstVisiblePosition();
int top = c.getTop();
if(firstVisiblePosition==0)
{
return -top;
}
else
{
//只适合本项目
return iv_2.getHeight()+iv_3.getHeight();
}
}
}
package cn.edu.sxu.www.changeheadheight;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;
import java.util.List;
/**
* Created by ${huozhenpeng} on 17/6/29.
* Company : www.miduo.com
*/
public class MyAdapter extends BaseAdapter {
private Context context;
private List<String> lists;
public MyAdapter(Context context, List<String> lists)
{
this.context=context;
this.lists=lists;
}
@Override
public int getCount() {
return lists.size();
}
@Override
public Object getItem(int position) {
return lists.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
convertView= LayoutInflater.from(context).inflate(R.layout.item,null);
TextView textView= (TextView) convertView.findViewById(R.id.text);
textView.setText(lists.get(position));
return convertView;
}
}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="cn.edu.sxu.www.changeheadheight.MainActivity">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/listview"
>
</ListView>
<HorizontalScrollView
android:scrollbars="none"
android:id="@+id/horizontalScrollView"
android:background="#00aaaa"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:background="#ff0000"
android:layout_width="wrap_content"
android:layout_height="750px"
android:orientation="vertical"
android:id="@+id/ll_parent"
>
<View
android:id="@+id/key_view"
android:layout_width="wrap_content"
android:layout_height="1px"
/>
<ImageView
android:id="@+id/iv_1"
android:background="#ff00ff"
android:layout_width="500px"
android:layout_height="250px"
android:src="@mipmap/ic_launcher"
/>
<ImageView
android:id="@+id/iv_2"
android:background="#00ff00"
android:layout_width="500px"
android:layout_height="250px"
android:src="@mipmap/ic_launcher"
/>
<ImageView
android:id="@+id/iv_3"
android:background="#00ffa0"
android:layout_width="500px"
android:layout_height="250px"
android:src="@mipmap/ic_launcher"
/>
</LinearLayout>
</HorizontalScrollView>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="750px"
android:id="@+id/textview"
android:background="#ffffff"
/>
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="100dp"
android:gravity="center"
/>
</RelativeLayout>
源码地址:点击打开链接