先创建一个包 ,包名package com.example.SlidingMeun.view 一个类 类名SlidingMeun。
自定义布局,侧滑布局,实现的效果图
---------------效果图-----------
image.png
···
package com.example.SlidingMeun.view;
import android.content.Context;
import android.hardware.display.DisplayManager;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.Log;
import android.util.MonthDisplayHelper;
import android.util.TypedValue;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowManager;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
/**
自定义ViewGroup
设置View的 宽和高
/*/
public class SlidingMeun extends HorizontalScrollView {//HorizontalScrollView水平滑动
private LinearLayout mWapper;//水平滚动条
private ViewGroup mMenu;//菜单栏的子类
private ViewGroup mContent;//内容区域
private int mScreenWidth;//屏幕的宽度
private int mMenuRightPadding=50;//侧滑与右侧的距离
private boolean once;
private int mMenuWidth;//菜单宽度
public SlidingMeun(Context context, AttributeSet attrs) {
super(context, attrs);//自定义布局时 调用属性
//通过上下文获取 给屏幕的宽高赋值
WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
DisplayMetrics outMetrics=new DisplayMetrics();
wm.getDefaultDisplay().getMetrics(outMetrics);
mScreenWidth=outMetrics.widthPixels;
//把dp转化为Px(像素)
//通过TypedValue.applyDimension转换成了像素值
mMenuRightPadding=(int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 50, context.getResources().getDisplayMetrics());
}
//设置View的 宽和高就是设置自己的宽和高
protected void onMeasure(int widthMeasureSpec,int heightMeasureSpec){
if (!once) {
//获得(com.example.aiqiyi.view_ui.Sidngmenu)里面的布局
mWapper=(LinearLayout) getChildAt(0);//
mMenu=(ViewGroup) mWapper.getChildAt(0);//LinearLayout的第一个元素
mContent =(ViewGroup) mWapper.getChildAt(1);//LinearLayout的第二个元素
//设置宽度 meun的宽度=屏幕的宽度-侧滑与右侧的距离的宽度
mMenuWidth=mMenu.getLayoutParams().width=mScreenWidth-mMenuRightPadding;
//内容区域的宽度=屏幕的宽度
mContent.getLayoutParams().width=mScreenWidth;
once =true;
}
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
//通过设置偏移量 将menu隐藏 左侧
//决定View的摆放位置
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
super.onLayout(changed, l, t, r, b);
if (changed) {//隐藏menu
this.scrollTo(mMenuWidth, 0);//将menu隐藏 左侧
//x为正值时滚动态向右移动 内容区向左移动
}
}
@Override
public boolean onTouchEvent(MotionEvent ev) {
int action=ev.getAction();//按下抬起
switch (action) {//判断用户的操作
case MotionEvent.ACTION_UP:
//隐藏在左边的宽度
int scrollX = getScrollX();
if (scrollX >= mScreenWidth /2) {//scrollX大于mMenuWidth的一半
//smoothScrollTo(x, y);慢慢隐藏
this.smoothScrollTo(mMenuWidth, 0);
}else{//显示
this.smoothScrollTo(0, 0);
}
return true;
}
return super.onTouchEvent(ev);
}
}
···
···
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.SlidingMeun.view.SlidingMeun
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal"
>
<include
layout="@layout/left_menu"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/ic_beijing"
></LinearLayout>
</LinearLayout>
</com.example.SlidingMeun.view.SlidingMeun>
</RelativeLayout>
···
lef.xml
<?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:orientation="vertical"
android:background="@drawable/beij"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<!--
android:layout_centerVertical="true"
居中垂直
-->
<ImageView
android:id="@+id/id_1"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp"
android:layout_centerVertical="true"
android:src="@drawable/ic_tubiao2"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/id_1"
android:text="第一个按钮"
android:layout_centerVertical="true"
android:textSize="20sp"
android:textColor="#ffffff"
android:layout_marginLeft="20dp"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="@+id/id_2"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp"
android:layout_centerVertical="true"
android:src="@drawable/ic_tubiao3"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/id_2"
android:text="第二个按钮"
android:layout_centerVertical="true"
android:textSize="20sp"
android:textColor="#ffffff"
android:layout_marginLeft="20dp"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="@+id/id_3"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp"
android:layout_centerVertical="true"
android:src="@drawable/ic_tubiao4"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/id_3"
android:text="第三个按钮"
android:layout_centerVertical="true"
android:textSize="20sp"
android:textColor="#ffffff"
android:layout_marginLeft="20dp"
/>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
image.pngatvity.xml
网友评论