編輯:關於android開發
先看看效果圖
實現方法繼承自ViewGroup需要我們自己來測量,布局,實現滑動的效果,處理滑動沖突,
自定義ViewGroup的一般思路是重寫onMeasure方法,在onMeasure方法中調用measureChild來測量子View,然後調用setMeasuredDimension來測量自己的大小。然後重寫onLayout方法,在onLayout中調用子View的layout方法來確定子View的位置,下面我們先來做好這兩件工作
初始時候我們的Content應該是顯示在屏幕中的,而Menu應該是顯示在屏幕外的。當Menu打開時,應該是這種樣子的<喎?http://www.Bkjia.com/kf/ware/vc/" target="_blank" class="keylink">vcD4NCjxwPjxpbWcgYWx0PQ=="這裡寫圖片描述" src="http://www.bkjia.com/uploads/allimg/160414/0426255018-2.png" title="\" />
mMenuRightPadding是Menu距屏幕右側的一個距離,因為我們Menu打開後,Content還是會留一部分,而不是完全隱藏的
public class MySlidingMenu extends ViewGroup {
public MySlidingMenu(Context context) {
this(context, null, 0);
}
public MySlidingMenu(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public MySlidingMenu(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
DisplayMetrics metrics = new DisplayMetrics();
WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
wm.getDefaultDisplay().getMetrics(metrics);
//獲取屏幕的寬和高
mScreenWidth = metrics.widthPixels;
mScreenHeight = metrics.heightPixels;
//設置Menu距離屏幕右側的距離,convertToDp是將代碼中的100轉換成100dp
mMenuRightPadding = convertToDp(context,100);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//拿到Menu,Menu是第0個孩子
mMenu = (ViewGroup) getChildAt(0);
//拿到Content,Content是第1個孩子
mContent = (ViewGroup) getChildAt(1);
//設置Menu的寬為屏幕的寬度減去Menu距離屏幕右側的距離
mMenuWidth = mMenu.getLayoutParams().width = mScreenWidth - mMenuRightPadding;
//設置Content的寬為屏幕的寬度
mContentWidth = mContent.getLayoutParams().width = mScreenWidth;
//測量Menu
measureChild(mMenu,widthMeasureSpec,heightMeasureSpec);
//測量Content
measureChild(mContent, widthMeasureSpec, heightMeasureSpec);
//測量自己,自己的寬度為Menu寬度加上Content寬度,高度為屏幕高度
setMeasuredDimension(mMenuWidth + mContentWidth, mScreenHeight);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
//擺放Menu的位置,根據上面圖可以確定上下左右的坐標
mMenu.layout(-mMenuWidth, 0, 0, mScreenHeight);
//擺放Content的位置
mContent.layout(0, 0, mScreenWidth, mScreenHeight);
}
/**
* 將傳進來的數轉化為dp
*/
private int convertToDp(Context context , int num){
return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,num,context.getResources().getDisplayMetrics());
}
}
目前我們的側滑菜單中的兩個子View的位置應該是這個樣子
接下來我們編寫xml布局文件
left_menu.xml 左側菜單的布局文件,是一個ListView
其中ListView的Item布局為left_menu_item.xml
我們再來編寫內容區域的布局文件 content.xml 其中有一個header,header中有一個ImageView,這個ImageView是menu的開關,我們點擊他的時候可以自動開關menu,然後header下面也是一個istview
<code class=" hljs xml"><!--{cke_protected}{C}%3C!%2D%2D%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%2D%2D%3E--> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <linearlayout android:layout_width="match_parent" android:layout_height="65dp" android:background="#000000" android:gravity="center_vertical" android:orientation="horizontal"> <imageview android:id="@+id/menu_toggle" android:layout_width="40dp" android:layout_height="40dp" android:src="@drawable/toggle" android:paddingleft="10dp"> </imageview></linearlayout> <listview android:id="@+id/content_listview" android:layout_width="match_parent" android:layout_height="wrap_content" android:dividerheight="0dp" android:divider="@null" android:scrollbars="none"> </listview></linearlayout></code>
content的item的布局文件為 content_item.xml
<code class=" hljs xml"><!--{cke_protected}{C}%3C!%2D%2D%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%2D%2D%3E--> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:gravity="center_vertical" android:background="#ffffff" android:layout_height="match_parent"> <imageview android:id="@+id/content_imageview" android:layout_width="80dp" android:layout_height="80dp" android:src="@drawable/content_1" android:layout_margin="20dp"> <textview android:id="@+id/content_textview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Content - 1" android:textcolor="#000000" android:textsize="20sp"> </textview></imageview></linearlayout></code>
在activity_main.xml中,我們將menu和content添加到我們的slidingMenu中
<code class=" hljs avrasm"><relativelayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#aaaaaa"> <com.example.user.slidingmenu.myslidingmenu android:id="@+id/slidingmenu" android:layout_width="wrap_content" android:layout_height="match_parent"> <include android:id="@+id/menu" layout="@layout/left_menu"> <include android:id="@+id/content" layout="@layout/content"> </include></include></com.example.user.slidingmenu.myslidingmenu> </relativelayout></code>
現在應該是這種效果
左側菜單是隱藏在屏幕左側外部的,但是現在還不能滑動,如果想要實現滑動功能,我們可以使用View的scrollTo和scrollBy方法,這兩個方法的區別是scrollTo是直接將view移動到指定的位置,scrollBy是相對於當前的位置移動一個偏移量,所以我們應該重寫onTouchEvent方法,用來計算出當前手指的一個偏移量,然後使用scrollBy方法一點一點的移動,就形成了一個可以跟隨手指移動的view的動畫效果了
在寫代碼之前,我們先掃清一下障礙,我們先來弄清楚這些坐標是怎麼回事
好了,把這些坐標弄清楚後,我們就簡單多了,下面直接看onTouchEvent方法
@Override
public boolean onTouchEvent(MotionEvent event) {
int action = event.getAction();
switch (action){
case MotionEvent.ACTION_DOWN:
mLastX = (int) event.getX();
mLastY = (int) event.getY();
break;
case MotionEvent.ACTION_MOVE:
int currentX = (int) event.getX();
int currentY = (int) event.getY();
//拿到x方向的偏移量
int dx = currentX - mLastX;
if (dx < 0){//向左滑動
//邊界控制,如果Menu已經完全顯示,再滑動的話
//Menu左側就會出現白邊了,進行邊界控制
if (getScrollX() + Math.abs(dx) >= 0) {
//直接移動到(0,0)位置,不會出現白邊
scrollTo(0, 0);
} else {//Menu沒有完全顯示呢
//其實這裡dx還是-dx,大家不用刻意去記
//大家可以先使用dx,然後運行一下,發現
//移動的方向是相反的,那麼果斷這裡加個負號就可以了
scrollBy(-dx, 0);
}
}else{//向右滑動
//邊界控制,如果Content已經完全顯示,再滑動的話
//Content右側就會出現白邊了,進行邊界控制
if (getScrollX() - dx <= -mMenuWidth) {
//直接移動到(-mMenuWidth,0)位置,不會出現白邊
scrollTo(-mMenuWidth, 0);
} else {//Content沒有完全顯示呢
//根據手指移動
scrollBy(-dx, 0);
}
}
mLastX = currentX;
mLastY = currentY;
break;
}
return true;
}
現在我們的SlidingMenu依然是不能夠水平滑動的,但是listview可以豎直滑動,原因是我們的SlidingMenu默認是不攔截事件的,那麼事件會傳遞給他的子View去執行,也就是說傳遞給了Content的ListView去執行了,所以listview是可以滑動的,為了簡單,我們先重寫onInterceptTouchEvent方法,我們返回true,讓SlidingMenu攔截事件,我們的SlidingMenu就能夠滑動了,但是ListView是不能滑動的,等下我們會進行滑動沖突的處理,現在先實現SlidingMenu的功能
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
return true;
}
我們在構造方法中初始化一個Scroller
public MySlidingMenu(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
...
mScroller = new Scroller(context);
...
}
然後重寫computeScroll方法,這個方法是保證Scroller自動滑動的必須方法,這是一個模板方法,到哪裡都這麼些就好了
@Override
public void computeScroll() {
if (mScroller.computeScrollOffset()){
scrollTo(mScroller.getCurrX(), mScroller.getCurrY());
invalidate();
}
}
接著我們在onTouchEvent的ACTION_UP中進行判斷,判斷當前menu打開了多少
case MotionEvent.ACTION_UP:
if (getScrollX() < -mMenuWidth / 2){//打開Menu
//調用startScroll方法,第一個參數是起始X坐標,第二個參數
//是起始Y坐標,第三個參數是X方向偏移量,第四個參數是Y方向偏移量
mScroller.startScroll(getScrollX(), 0, -mMenuWidth - getScrollX(), 0, 300);
//設置一個已經打開的標識,當實現點擊開關自動打開關閉功能時會用到
isOpen = true;
//一定不要忘了調用這個方法重繪,否則沒有動畫效果
invalidate();
}else{//關閉Menu
//同上
mScroller.startScroll(getScrollX(), 0, -getScrollX(), 0, 300);
isOpen = false;
invalidate();
}
break;
關於startScroll中的startX和startY好判斷,那麼dx和dy怎麼計算呢?其實也非常簡單,比如我們startX坐標為30,我們想移動到-100,那麼startX+dx = -100 –> dx = -100 - startX –> dx = -130
好了現在我們就可以實現松開手指後自動滑動的動畫效果了
現在我們還需要點擊content中左上角的一個三角,如果當前menu沒有打開,則自動打開,如果已經打開,則自動關閉的功能,自動滑動的效果我們要借助Scroller.startScroll方法
/**
* 點擊開關,開閉Menu,如果當前menu已經打開,則關閉,如果當前menu已經關閉,則打開
*/
public void toggleMenu(){
if (isOpen){
closeMenu();
}else{
openMenu();
}
}
/**
* 關閉menu
*/
private void closeMenu() {
//也是使用startScroll方法,dx和dy的計算方法一樣
mScroller.startScroll(getScrollX(),0,-getScrollX(),0,500);
invalidate();
isOpen = false;
}
/**
* 打開menu
*/
private void openMenu() {
mScroller.startScroll(getScrollX(),0,-mMenuWidth-getScrollX(),0,500);
invalidate();
isOpen = true;
}
處理滑動沖突
由於我們的menu和content是listview,listview是支持豎直滑動的,而我們的slidingMenu是支持水平滑動的,因此會出現滑動的沖突。剛才我們直接在onInterceptTouchEvent中返回了true,因此SlidingMenu就會攔截所有的事件,而ListView接收不到任何的事件,因此ListView不能滑動了,我們要解決這個滑動沖突很簡單,只需要判斷當前是水平滑動還是豎直滑動,如果是水平滑動的話則讓SlidingMenu攔截事件,如果是豎直滑動的話就不攔截事件,把事件交給子View的ListView去執行
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
boolean intercept = false;
int x = (int) ev.getX();
int y = (int) ev.getY();
switch (ev.getAction()){
case MotionEvent.ACTION_DOWN:
intercept = false;
break;
case MotionEvent.ACTION_MOVE:
int deltaX = (int) ev.getX() - mLastXIntercept;
int deltaY = (int) ev.getY() - mLastYIntercept;
if (Math.abs(deltaX) > Math.abs(deltaY)){//橫向滑動
intercept = true;
}else{//縱向滑動
intercept = false;
}
break;
case MotionEvent.ACTION_UP:
intercept = false;
break;
}
mLastX = x;
mLastY = y;
mLastXIntercept = x;
mLastYIntercept = y;
return intercept;
}
現在就可以了,
android發送郵件 一個項目的需求,之前一篇博客寫過如何生成excel,生成後的excel要發送給用戶(指定郵箱)。奇葩的後台說這個發送也不好實現,要客戶端來做。
Android IPC機制(五)用Socket實現跨進程聊天程序 1.Socket簡介 Socket也稱作“套接字“,是在應用層和傳輸層之間的
Java入門(二)——果然斷更的都是要受懲罰的。。。,java受懲罰斷更了一個多月,閱讀量立馬從100+跌落至10-,雖說不是很看重這個,畢竟只是當這個是自己的學習筆記,
Android之控件使用,android控件 Android系統為我們提供了大量的控件,例如:開關控件、單選按鈕、多選按鈕、單選菜單等等,那麼這些控件如何使用呢?本篇我