android 顶部横向滑动菜单效果
android 顶部横向滑动菜单效果
专注移动开发 发表于2年前
android 顶部横向滑动菜单效果
  • 发表于 2年前
  • 阅读 71
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 十分钟定制你的第一个小程序>>>   

顶部横向滑动菜单效果

android 

这个是在在别人的基础上改的(基本上没改),我就不重造轮子了。 
 
先是自定义的横向ScollView,用Adapter模式填充数据 

Java代码  收藏代码

  1. import com.example.demo.R;  

  2.   

  3. import android.content.Context;  

  4. import android.database.DataSetObserver;  

  5. import android.util.AttributeSet;  

  6. import android.util.SparseArray;  

  7. import android.view.Gravity;  

  8. import android.view.LayoutInflater;  

  9. import android.view.View;  

  10. import android.view.View.OnClickListener;  

  11. import android.view.animation.AccelerateDecelerateInterpolator;  

  12. import android.view.animation.Animation;  

  13. import android.view.animation.AnimationSet;  

  14. import android.view.animation.ScaleAnimation;  

  15. import android.view.animation.TranslateAnimation;  

  16. import android.widget.BaseAdapter;  

  17. import android.widget.FrameLayout;  

  18. import android.widget.HorizontalScrollView;  

  19. import android.widget.ImageView;  

  20. import android.widget.LinearLayout;  

  21. import android.widget.TextView;  

  22.   

  23. public class NavigationHorizontalScrollView extends HorizontalScrollView implements OnClickListener {  

  24.   

  25.     public NavigationHorizontalScrollView(Context context, AttributeSet attrs, int defStyle) {  

  26.         super(context, attrs, defStyle);  

  27.         init();  

  28.     }  

  29.   

  30.     public NavigationHorizontalScrollView(Context context, AttributeSet attrs) {  

  31.         super(context, attrs);  

  32.         init();  

  33.     }  

  34.   

  35.     public NavigationHorizontalScrollView(Context context) {  

  36.         super(context);  

  37.         init();  

  38.     }  

  39.   

  40.     private FrameLayout mFrameLayout;  

  41.     private BaseAdapter mBaseAdapter;  

  42.     private SparseArray<View> mSparseArray;  

  43.     private int oldPosition;  

  44.     private TextView backView;  

  45.     private ImageView preImage, nextImage;  

  46.   

  47.     @Override  

  48.     protected void onScrollChanged(int l, int t, int oldl, int oldt) {  

  49.         super.onScrollChanged(l, t, oldl, oldt);  

  50.         resetImageView();  

  51.     }  

  52.   

  53.     private void resetImageView() {  

  54.         /* 计算水平方向滚动条的滑块的偏移值。 */  

  55.         int ScrollOffset = computeHorizontalScrollOffset();  

  56.         /* 滚动条长度 */  

  57.         int ScrollExtent = computeHorizontalScrollExtent();  

  58.         /* 滚动条当前位置 */  

  59.         int curScrollLoc = ScrollOffset + ScrollExtent;  

  60.         /* scrollView 的可滚动水平范围是所有子视图的宽度总合。 */  

  61.         int ScrollRange = computeHorizontalScrollRange();  

  62.   

  63.         /* 如果当前位置 在ScrollExtent 和 ScrollRange 之间,左右两边的View都显示 */  

  64.         if (curScrollLoc > ScrollExtent && curScrollLoc < ScrollRange) {  

  65.             if (preImage != null)  

  66.                 preImage.setVisibility(View.VISIBLE);  

  67.             if (nextImage != null)  

  68.                 nextImage.setVisibility(View.VISIBLE);  

  69.             return;  

  70.         }  

  71.         /* 如果滚动到最左边 */  

  72.         if (curScrollLoc == ScrollExtent) {  

  73.             if (preImage != null)  

  74.                 preImage.setVisibility(View.INVISIBLE);  

  75.             return;  

  76.         }  

  77.         /* 如果滚动到最右边 */  

  78.         if (curScrollLoc >= ScrollRange) {  

  79.             if (nextImage != null)  

  80.                 nextImage.setVisibility(View.INVISIBLE);  

  81.             return;  

  82.         }  

  83.   

  84.     }  

  85.   

  86.     private void init() {  

  87.         mFrameLayout = new FrameLayout(getContext());  

  88.         mFrameLayout.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));  

  89.         addView(mFrameLayout);  

  90.         mSparseArray = new SparseArray<View>();  

  91.     }  

  92.   

  93.     private void buildItemView() {  

  94.         if (mBaseAdapter == null)  

  95.             return;  

  96.         LinearLayout linearLayout = new LinearLayout(getContext());  

  97.         for (int i = 0; i < mBaseAdapter.getCount(); i++) {  

  98.             View view = mBaseAdapter.getView(i, mSparseArray.get(i), this);  

  99.             view.setOnClickListener(this);  

  100.             mSparseArray.put(i, view);  

  101.             linearLayout.addView(mSparseArray.get(i));  

  102.         }  

  103.         LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,  

  104.                 LinearLayout.LayoutParams.FILL_PARENT);  

  105.         layoutParams.gravity = Gravity.CENTER_VERTICAL;  

  106.         backView = (TextView) LayoutInflater.from(getContext()).inflate(R.layout.navigation_item, null);  

  107.         backView.setBackgroundResource(R.drawable.bg_view);  

  108.         backView.setPadding(0505);  

  109.         mFrameLayout.addView(backView, layoutParams);  

  110.         mFrameLayout.addView(linearLayout);  

  111.     }  

  112.   

  113.     public void setAdapter(BaseAdapter baseAdapter) {  

  114.         if (baseAdapter == null)  

  115.             return;  

  116.         mBaseAdapter = baseAdapter;  

  117.         mBaseAdapter.registerDataSetObserver(new DataSetObserver() {  

  118.             @Override  

  119.             public void onChanged() {  

  120.                 oldPosition = 0;  

  121.                 buildItemView();  

  122.                 super.onChanged();  

  123.             }  

  124.         });  

  125.         mBaseAdapter.notifyDataSetChanged();  

  126.     }  

  127.   

  128.     @Override  

  129.     public void onClick(View v) {  

  130.         if (v.getId() == preImage.getId()) {  

  131.             fling(-800);  

  132.             return;  

  133.         }  

  134.         if (v.getId() == nextImage.getId()) {  

  135.             fling(800);  

  136.             return;  

  137.         }  

  138.         if (onItemClickListener != null) {  

  139.             int position = mSparseArray.indexOfValue(v);  

  140.             startAnimation(position);  

  141.             oldPosition = position;  

  142.             onItemClickListener.click(position);  

  143.         }  

  144.     }  

  145.   

  146.     private void startAnimation(int position) {  

  147.         AnimationSet animationSet = new AnimationSet(true);  

  148.         animationSet.addAnimation(buildScaleAnimation(oldPosition, position));  

  149.         animationSet.addAnimation(buildTranslateAnimation(oldPosition, position));  

  150.         animationSet.setInterpolator(new AccelerateDecelerateInterpolator());  

  151.         /* 移动后不复原,不返回动画前的状态位置 */  

  152.         animationSet.setFillAfter(true);  

  153.         animationSet.setDuration(500);  

  154.         backView.startAnimation(animationSet);  

  155.         invalidate();  

  156.     }  

  157.   

  158.     private Animation buildScaleAnimation(int oldPosition, int position) {  

  159.         float oldWidth = getItemView(oldPosition).getWidth();  

  160.         float newWidth = getItemView(position).getWidth();  

  161.         float fromX = oldWidth / backView.getWidth();  

  162.         float toX = newWidth / backView.getWidth();  

  163.         ScaleAnimation animation = new ScaleAnimation(fromX, toX, 1f, 1f, Animation.ABSOLUTE, 0.0f, Animation.ABSOLUTE,  

  164.                 0.0f);  

  165.         return animation;  

  166.     }  

  167.   

  168.     private Animation buildTranslateAnimation(int oldPosition, int position) {  

  169.         TranslateAnimation animation = new TranslateAnimation(getItemView(oldPosition).getLeft(), getItemView(position)  

  170.                 .getLeft(), 00);  

  171.         return animation;  

  172.     }  

  173.   

  174.     private View getItemView(int position) {  

  175.         return mSparseArray.get(position);  

  176.     }  

  177.   

  178.     public interface OnItemClickListener {  

  179.         void click(int position);  

  180.     }  

  181.   

  182.     private OnItemClickListener onItemClickListener;  

  183.   

  184.     public void setOnItemClickListener(OnItemClickListener onItemClickListener) {  

  185.         this.onItemClickListener = onItemClickListener;  

  186.     }  

  187.   

  188.     public void setImageView(ImageView preImage, ImageView nextImage) {  

  189.         this.preImage = preImage;  

  190.         this.nextImage = nextImage;  

  191.         if (preImage != null) {  

  192.             preImage.setOnClickListener(this);  

  193.         }  

  194.         if (nextImage != null) {  

  195.             nextImage.setOnClickListener(this);  

  196.         }  

  197.     }  

  198.   

  199. }  



用法: 

Java代码  收藏代码

  1. import java.util.ArrayList;  

  2. import java.util.List;  

  3.   

  4. import android.app.Activity;  

  5. import android.content.Context;  

  6. import android.os.Bundle;  

  7. import android.view.LayoutInflater;  

  8. import android.view.View;  

  9. import android.view.ViewGroup;  

  10. import android.widget.BaseAdapter;  

  11. import android.widget.ImageView;  

  12. import android.widget.TextView;  

  13.   

  14. import com.example.demo.model.Navigation;  

  15. import com.example.demo.widget.NavigationHorizontalScrollView;  

  16.   

  17. public class MainActivity extends Activity{  

  18.           

  19.     private Context context;  

  20.     private List<Navigation> navs = buildNavigation();  

  21.     private NavigationHorizontalScrollView mHorizontalScrollView;  

  22.     private TextView tv;  

  23.     @Override  

  24.     public void onCreate(Bundle savedInstanceState) {  

  25.         super.onCreate(savedInstanceState);  

  26.         setContentView(R.layout.activity_main);  

  27.         context=this;  

  28.         tv=(TextView)findViewById(R.id.tv);  

  29.         tv.setText("You clicked "+navs.get(0).getTitle());  

  30.           

  31.         mHorizontalScrollView=(NavigationHorizontalScrollView)findViewById(R.id.horizontal_scrollview);  

  32.         mHorizontalScrollView.setImageView((ImageView) findViewById(R.id.iv_pre),(ImageView) findViewById(R.id.iv_next));  

  33.                   

  34.         mHorizontalScrollView.setOnItemClickListener(new NavigationHorizontalScrollView.OnItemClickListener() {  

  35.               

  36.             @Override  

  37.             public void click(int position) {  

  38.                 // TODO Auto-generated method stub  

  39.                 tv.setText("You clicked "+navs.get(position).getTitle());  

  40.             }  

  41.         });  

  42.           

  43.         mHorizontalScrollView.setAdapter(new NavigationAdapter());  

  44.           

  45.     }  

  46.   

  47.     private List<Navigation> buildNavigation() {  

  48.         List<Navigation> navigations = new ArrayList<Navigation>();  

  49.         navigations.add(new Navigation(0"url""首页"));  

  50.         navigations.add(new Navigation(1"url""新闻"));  

  51.         navigations.add(new Navigation(2"url""科技"));  

  52.         navigations.add(new Navigation(3"url""设置"));  

  53.         navigations.add(new Navigation(4"url""朋友"));  

  54.         navigations.add(new Navigation(5"url""测试长标题"));  

  55.         navigations.add(new Navigation(7"url""测试"));  

  56.         navigations.add(new Navigation(6"url""我的宝贝"));  

  57.         return navigations;  

  58.     }  

  59.   

  60.       

  61.     class NavigationAdapter extends BaseAdapter {  

  62.   

  63.         @Override  

  64.         public int getCount() {  

  65.             return navs.size();  

  66.         }  

  67.   

  68.         @Override  

  69.         public Object getItem(int position) {  

  70.             return navs.get(position);  

  71.         }  

  72.   

  73.         @Override  

  74.         public long getItemId(int position) {  

  75.             return position;  

  76.         }  

  77.   

  78.         @Override  

  79.         public View getView(int position, View convertView, ViewGroup parent) {  

  80.             if (convertView == null) {  

  81.                 convertView = LayoutInflater.from(context).inflate(R.layout.navigation_item, null);  

  82.             }  

  83.             ((TextView) convertView).setText(navs.get(position).getTitle());  

  84.             return convertView;  

  85.         }  

  86.   

  87.     }  

  88.       

  89. }  


布局: 

Xml代码  收藏代码

  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  

  2.     android:layout_width="match_parent"  

  3.     android:layout_height="match_parent"  

  4.     android:orientation="vertical" >  

  5.   

  6.     <LinearLayout  

  7.     android:layout_width="match_parent"  

  8.     android:layout_height="wrap_content"  

  9.     android:orientation="horizontal"  

  10.     >  

  11.   

  12.     <ImageView  

  13.         android:id="@+id/iv_pre"  

  14.         android:layout_width="30dip"  

  15.         android:layout_height="30dip"  

  16.         android:layout_gravity="center_vertical"  

  17.         android:src="@drawable/ic_pre" />  

  18.   

  19.     <com.example.demo.widget.NavigationHorizontalScrollView  

  20.         android:id="@+id/horizontal_scrollview"  

  21.         android:layout_width="wrap_content"  

  22.         android:layout_height="wrap_content"  

  23.         android:layout_gravity="center_vertical"  

  24.         android:layout_weight="1"  

  25.         android:paddingBottom="2dip"  

  26.         android:paddingTop="2dip"  

  27.         android:scrollbars="none" />  

  28.   

  29.     <ImageView  

  30.         android:id="@+id/iv_next"  

  31.         android:layout_width="30dip"  

  32.         android:layout_height="30dip"  

  33.         android:layout_gravity="center_vertical"  

  34.         android:src="@drawable/ic_next" />  

  35.   

  36.     </LinearLayout>  

  37.     <FrameLayout  

  38.         android:layout_width="fill_parent"  

  39.         android:layout_height="fill_parent" >  

  40.         <TextView   

  41.             android:id="@+id/tv"  

  42.             android:layout_width="wrap_content"  

  43.             android:layout_height="wrap_content"  

  44.             android:textColor="@android:color/black"  

  45.             android:textSize="24sp"  

  46.             android:layout_gravity="center"  

  47.             />  

  48.     </FrameLayout>  

  49.   

  50. </LinearLayout>  



具体看附件


共有 人打赏支持
粉丝 2
博文 44
码字总数 3767
×
专注移动开发
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: