Android实现网易新闻客户端侧滑菜单(2)_Android

前面已经讲过通过三方开源库SlideMenu来实现这种效果,请参考Android实现网易新闻客户端侧滑菜单(一)

今天通过自定义View来实现这种功能。

代码如下:

SlideMenu.java

package com.jackie.slidemenu.view; 

import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewConfiguration;
import android.view.ViewGroup;
import android.widget.Scroller; 

public class SlideMenu extends ViewGroup { 

 private int mMostRecentX;  // 最后一次x轴的偏移量 

 private final int MENU_SCREEN = 0;  // 菜单界面
 private final int MAIN_SCREEN = 1;  // 主界面
 private int mCurrentScreen = MAIN_SCREEN;  // 当前屏幕显示的是主界面
 private Scroller mScroller; 

 private int touchSlop; 

 public SlideMenu(Context context, AttributeSet attrs) {
  super(context, attrs);
  mScroller = new Scroller(context); 

  touchSlop = ViewConfiguration.get(context).getScaledTouchSlop();
 } 

 /**
  * 测量出所有子布局的宽和高
  */
 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  super.onMeasure(widthMeasureSpec, heightMeasureSpec); 

  measureView(widthMeasureSpec, heightMeasureSpec);
 } 

 /**
  * 测量所有子布局的宽和高
  * @param widthMeasureSpec 父布局也就是ViewGroup的宽度测量规格
  * @param heightMeasureSpec 父布局也就是ViewGroup的高度测量规格
  */
 private void measureView(int widthMeasureSpec, int heightMeasureSpec) {
  // 测量菜单的宽和高
  View menuView = getChildAt(0);
  menuView.measure(menuView.getLayoutParams().width, heightMeasureSpec); 

  // 测量主界面的宽和高
  View mainView = getChildAt(1);
  mainView.measure(widthMeasureSpec, heightMeasureSpec);  // 主界面的宽和高和父控件viewgroup的宽高一样
 } 

 @Override
 protected void onLayout(boolean changed, int l, int t, int r, int b) {
  // 布置菜单的位置
  View menuView = getChildAt(0);
  menuView.layout(-menuView.getMeasuredWidth(), 0, 0, b); 

  // 布置主界面的位置
  View mainView = getChildAt(1);
  mainView.layout(0, 0, r, b);
 } 

 @Override
 public boolean onTouchEvent(MotionEvent event) {
  switch (event.getAction()) {
  case MotionEvent.ACTION_DOWN:
   mMostRecentX = (int) event.getX();
   break;
  case MotionEvent.ACTION_MOVE:
   // 最新的x轴偏移量
   int moveX = (int) event.getX(); 

   // 增量值
   int deltaX = mMostRecentX - moveX; 

   // 把最新的x轴偏移量赋值给成员变量
   mMostRecentX = moveX; 

   // 得到x轴移动后的偏移量
   int newScrollX = getScrollX() + deltaX; 

   if(newScrollX < -getChildAt(0).getWidth()) {  // 当前屏幕x轴的偏移量超过了菜单的左边界
    // 回到菜单的左边界位置
    scrollTo(-getChildAt(0).getWidth(), 0);
   } else if(newScrollX > 0) {  // 超过了主界面的右边界
    // 回到主界面的右边界
    scrollTo(0, 0);
   } else {
    scrollBy(deltaX, 0);
   }
   break;
  case MotionEvent.ACTION_UP:
   int scrollX = getScrollX();  // x轴最新的偏移量 

   int menuXCenter = -getChildAt(0).getWidth() / 2;  // 菜单x轴的中心点 

   if(scrollX > menuXCenter) { // 切换到主界面
    mCurrentScreen = MAIN_SCREEN;
   } else { // 切换到菜单界面
    mCurrentScreen = MENU_SCREEN;
   }
   switchScreen();
   break;
  default:
   break;
  }
  return true;
 } 

 /**
  * 根据mCurrentScreen切换屏幕
  */
 private void switchScreen() {
  int scrollX = getScrollX(); // 当前x轴的偏移量
  int dx = 0; 

  if(mCurrentScreen == MAIN_SCREEN) { // 切换到主界面
//   scrollTo(0, 0);
   dx = 0 - scrollX;
  } else if(mCurrentScreen == MENU_SCREEN) { // 切换到菜单界面
//   scrollTo(-getChildAt(0).getWidth(), 0);
   dx = -getChildAt(0).getWidth() - scrollX;
  } 

  mScroller.startScroll(scrollX, 0, dx, 0, Math.abs(dx) * 5); 

  invalidate();  // invalidate -> drawChild -> child.draw -> computeScroll
 } 

 /**
  * invalidate出发此方法, 更新屏幕的x轴的偏移量
  */
 @Override
 public void computeScroll() {
  if(mScroller.computeScrollOffset()) {  // 判断是否正在模拟数据中, true 正在进行 false 数据模拟完毕
   scrollTo(mScroller.getCurrX(), 0); 

   invalidate();  // 引起computeScroll的调用
  }
 } 

 /**
  * 是否显示菜单
  * @return
  */
 public boolean isShowMenu() {
  return mCurrentScreen == MENU_SCREEN;
 } 

 /**
  * 隐藏菜单
  */
 public void hideMenu() {
  mCurrentScreen = MAIN_SCREEN;
  switchScreen();
 } 

 /**
  * 显示菜单
  */
 public void showMenu() {
  mCurrentScreen = MENU_SCREEN;
  switchScreen();
 } 

 /**
  * 拦截事件的方法
  */
 @Override
 public boolean onInterceptTouchEvent(MotionEvent ev) {
  switch (ev.getAction()) {
  case MotionEvent.ACTION_DOWN:
   mMostRecentX = (int) ev.getX();
   break;
  case MotionEvent.ACTION_MOVE: 

   int diffX = (int) (ev.getX() - mMostRecentX);
   if(Math.abs(diffX) > touchSlop) {
    return true;
   }
   break;
  default:
   break;
  }
  return super.onInterceptTouchEvent(ev);
 } 

} 

MainActivity.java

package com.jackie.slidemenu; 

import com.jackie.slidemenu.view.SlideMenu; 

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.TextView;
import android.widget.Toast; 

public class MainActivity extends Activity implements OnClickListener { 

 private SlideMenu mSlideMenu; 

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  // 去除标题, 需要在setContentView之前调用
  requestWindowFeature(Window.FEATURE_NO_TITLE);
  setContentView(R.layout.activity_main); 

  mSlideMenu = (SlideMenu) findViewById(R.id.slidemenu);
  findViewById(R.id.iv_slidemenu_main_back).setOnClickListener(this); 

 } 

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.main, menu);
  return true;
 } 

 @Override
 public void onClick(View v) {
  if(mSlideMenu.isShowMenu()) {
   mSlideMenu.hideMenu();
  } else {
   mSlideMenu.showMenu();
  }
 } 

 public void click(View v) {
  TextView tv = (TextView) v;
  Toast.makeText(this, tv.getText(), 0).show();
 }
}

系列文章:

Android实现网易新闻客户端效果

Android实现网易新闻客户端侧滑菜单(1)

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索Android侧滑菜单
ios侧滑菜单实现原理、安卓侧滑菜单实现、android 侧滑菜单实现、qq侧滑菜单 怎么实现、js 侧滑菜单实现源码,以便于您获取更多的相关知识。

时间: 2024-12-02 14:25:03

Android实现网易新闻客户端侧滑菜单(2)_Android的相关文章

Android实现网易新闻客户端侧滑菜单(2)

前面已经讲过通过三方开源库SlideMenu来实现这种效果,请参考Android实现网易新闻客户端侧滑菜单(一) 今天通过自定义View来实现这种功能. 代码如下: SlideMenu.java package com.jackie.slidemenu.view; import android.content.Context; import android.graphics.Canvas; import android.util.AttributeSet; import android.view

Android实现网易新闻客户端侧滑菜单(1)_Android

Android中很多产品(比如360手机助手.网易菜单...)都采用侧滑菜单的展现形式,采用这种展现形式 1.能把更多的展现内容都存放在菜单中 2.设计上也能体现出视觉效果 现在这种交互方式越来越流行了,虽然这种交互方式可以通过自定义组件的方式来实现,但是用三方开源库更简单. SlidingMenu:SlidingMenu的是一种比较新的设置界面或配置界面效果,在主界面左滑或者右滑出现设置界面,能方便的进行各种操作.目前有大量的应用都在使用这一效果. 地址:https://github.com/

Android实现网易新闻客户端侧滑菜单(1)

Android中很多产品(比如360手机助手.网易菜单...)都采用侧滑菜单的展现形式,采用这种展现形式 1.能把更多的展现内容都存放在菜单中 2.设计上也能体现出视觉效果 现在这种交互方式越来越流行了,虽然这种交互方式可以通过自定义组件的方式来实现,但是用三方开源库更简单. SlidingMenu:SlidingMenu的是一种比较新的设置界面或配置界面效果,在主界面左滑或者右滑出现设置界面,能方便的进行各种操作.目前有大量的应用都在使用这一效果. 地址:https://github.com/

Android实现网易新闻客户端首页效果_Android

关于实现网易新闻客户端的界面,以前写过很多博客,请参考: Android实现网易新闻客户端效果 Android实现网易新闻客户端侧滑菜单(一) Android实现网易新闻客户端侧滑菜单(二) 今天用ViewPager + FragmentAdapter + ViewPagerIndicator来实现. ViewPagerIndicator是一款分页指标小部件兼容ViewPager,封装上做得非常不错,目前已为众多知名应用所使用.具体API的使用,大家可以下载官方demo示例研究研究就知道啦! 下

Android实现网易新闻客户端首页效果

关于实现网易新闻客户端的界面,以前写过很多博客,请参考: Android实现网易新闻客户端效果 Android实现网易新闻客户端侧滑菜单(一) Android实现网易新闻客户端侧滑菜单(二) 今天用ViewPager + FragmentAdapter + ViewPagerIndicator来实现. ViewPagerIndicator是一款分页指标小部件兼容ViewPager,封装上做得非常不错,目前已为众多知名应用所使用.具体API的使用,大家可以下载官方demo示例研究研究就知道啦! 下

Android SlidingMenu 仿网易新闻客户端布局

前面两篇文章中的SlidingMenu都出现在左侧,今天来模仿一下网易新闻客户端左右两边都有SlidingMenu的效果,以下是网易新闻客户端效果:               不扯闲话了,直接进入正题吧   frame_content.xml   [html] view plaincopy   <?xml version="1.0" encoding="utf-8"?>   <FrameLayout xmlns:android="htt

模仿android网易新闻客户端左右动画效果

http://www.cnblogs.com/and_he/archive/2012/03/31/2426248.html 一.摘要 偶然在一个论坛上面看到有人模拟网易新闻客户端首页顶部那个组件效果,一时兴起,也来自己动手完整地模拟一个,包括顶部的特效组件和底部的类似于TabHost的组件.下面就动手一步一步地Coding...二.效果截图 三.底部类似TabHost组件切换效果的实现为了便于大家亲自动手实践,这里的讲解顺序就按照开发的顺序来讲,所以先做这个底部的"TabHost",然

网易新闻客户端3.0版iOS、Android平台正式上线

网易科技讯 12月3日消息,网易新闻客户端3.0版在"2012网易移动媒体高峰论坛"第一次对外亮相,今日3.0版正式在ios和android平台同步上线,目前,用户已可在各大应用商店下载使用.3.0版与之前的版本相比,在产品设计上有了较大的更新和改进,带来了全新的新闻"易"体验,这将大幅提升用户的移动资讯阅读质量.对此,网易门户移动中心产品负责人表示,网易新闻V3.0版本在设计上忠于系统原生的交互方式,在此基础上进行大范围优化,以符合iOS.android平台阅读类

艾瑞:网易新闻客户端用户使用时长排名第一

据艾瑞最新数据显示,2014年3月,iOS和Android全平台移动新闻资讯类应用,用户日均使用时间已超6亿分钟, 同比增长两倍.其中,网易新闻客户端.搜狐新闻客户端. 腾讯新闻客户端的用户使用时长分别排在前三名.数据来源:艾瑞艾瑞数据特别指出,在2014年Q1的iOS平台统计中,三大门户产品市场格局稳定:网易新闻客户端多项指标领先,搜狐新闻客户端.腾讯新闻客户端位列其后.其中,网易新闻客户端的日均覆盖人数占比最高达35%,日均总使用次数占比达30%,均与第二名拉开10%的差距.数据来源:艾瑞数