1、首先創建一個類 ?MyHorizontalScrollView?

package com.bjmocang.wanba;import android.content.Context; import android.util.AttributeSet; import android.util.DisplayMetrics; import android.util.TypedValue; import android.view.MotionEvent; import android.view.ViewGroup; import android.view.WindowManager; import android.widget.HorizontalScrollView; import android.widget.LinearLayout;public class MyHorizontalScrollView extends HorizontalScrollView {//滾動條中的水平先行布局private LinearLayout mWrpper;//水平線性布局的左側菜單menuprivate ViewGroup mMenu;//水平先行布局的右側線性布局private ViewGroup mContent;//屏幕的寬private int mScreenWidth;//menu的寬離屏幕右側的距離private int mMenuRightPadding = 50;//menu的寬度private int mMenuWidth;private boolean once;/*** 未使用自定義屬性時調用*/public MyHorizontalScrollView(Context context, AttributeSet attrs) {super(context, attrs);/** 獲取屏幕的寬度* 通過context拿到windowManager，在通過windowManager拿到Metrics,用DisplayMetrics接收* */WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);DisplayMetrics outMetrics = new DisplayMetrics();wm.getDefaultDisplay().getMetrics(outMetrics);mScreenWidth = outMetrics.widthPixels;//把dp轉換成pxmMenuRightPadding = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 50,context.getResources().getDisplayMetrics());}/** 設置子view的寬和高* */@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {// TODO Auto-generated method stubif (!once) {mWrpper = (LinearLayout) getChildAt(0);mMenu = (ViewGroup) mWrpper.getChildAt(0);mContent = (ViewGroup) mWrpper.getChildAt(1);//menu的寬度等于屏幕的寬度減去menu離屏幕右側的邊距mMenuWidth = mMenu.getLayoutParams().width = mScreenWidth - mMenuRightPadding;//右邊的先行布局的寬度直接等于屏幕的寬度mContent.getLayoutParams().width = mScreenWidth;once = true;}super.onMeasure(widthMeasureSpec, heightMeasureSpec);}/** 通過設置偏移量將menu隱藏* */@Overrideprotected void onLayout(boolean changed, int l, int t, int r, int b) {// TODO Auto-generated method stubsuper.onLayout(changed, l, t, r, b);/** 通過scrollTo（x,y）方法設置屏幕的偏移量，x為正* 內容向左移動* */if (changed) {this.scrollTo(mMenuWidth, 0);}}/** 因為HorizontalScrollView自己控制move和down的事件* 所以我們還要判斷一下up.如果當前的x偏移量大于menu寬度的一半* 隱藏menu，否則顯示menu* */@Overridepublic boolean onTouchEvent(MotionEvent ev) {// TODO Auto-generated method stubint action = ev.getAction();switch (action) {case MotionEvent.ACTION_UP:int scrollX = getScrollX();if (scrollX >= mMenuWidth / 2) {this.smoothScrollTo(mMenuWidth, 0);} else {this.smoothScrollTo(0, 0);}return true;}return super.onTouchEvent(ev);}}

2、寫一個布局 ? 命名 ? menu

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="#0ebdf7"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:layout_centerInParent="true"android:orientation="vertical"><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"><ImageViewandroid:id="@+id/image1"android:layout_width="50dp"android:layout_height="50dp"android:layout_marginLeft="20dp"android:src="@mipmap/wanba_icon" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:layout_marginLeft="20dp"android:layout_toRightOf="@id/image1"android:text="第一個Item"android:textColor="#ffffff"android:textSize="20sp" /></RelativeLayout><RelativeLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"><ImageViewandroid:id="@+id/image2"android:layout_width="50dp"android:layout_height="50dp"android:layout_marginLeft="20dp"android:src="@mipmap/wanba_icon" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:layout_marginLeft="20dp"android:layout_toRightOf="@id/image2"android:text="第二個Item"android:textColor="#ffffff"android:textSize="20sp" /></RelativeLayout><RelativeLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"><ImageViewandroid:id="@+id/image3"android:layout_width="50dp"android:layout_height="50dp"android:layout_marginLeft="20dp"android:src="@mipmap/wanba_icon" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:layout_marginLeft="20dp"android:layout_toRightOf="@id/image3"android:text="第三個Item"android:textColor="#ffffff"android:textSize="20sp" /></RelativeLayout><RelativeLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"><ImageViewandroid:id="@+id/image4"android:layout_width="50dp"android:layout_height="50dp"android:layout_marginLeft="20dp"android:src="@mipmap/wanba_icon" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:layout_marginLeft="20dp"android:layout_toRightOf="@id/image4"android:text="第四個Item"android:textColor="#ffffff"android:textSize="20sp" /></RelativeLayout><RelativeLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"><ImageViewandroid:id="@+id/image5"android:layout_width="50dp"android:layout_height="50dp"android:layout_marginLeft="20dp"android:src="@mipmap/wanba_icon" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:layout_marginLeft="20dp"android:layout_toRightOf="@id/image5"android:text="第五個Item"android:textColor="#ffffff"android:textSize="20sp" /></RelativeLayout></LinearLayout></RelativeLayout>

3、MainActivity的布局?

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><com.bjmocang.wanba.MyHorizontalScrollViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:scrollbars="none"><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="match_parent"android:orientation="horizontal"><include layout="@layout/menu" /><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:background="@mipmap/qq" /></LinearLayout></com.bjmocang.wanba.MyHorizontalScrollView></RelativeLayout>

4、MainActivity中不用寫任何東西 這樣就可以實現了

總結

以上是生活随笔為你收集整理的QQ侧边菜单栏实现的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。