自定義佈局實現仿qq側滑部分

源碼DEMO地址:https://github.com/applelili/ImitationQQandroid

實現說明:git

經過自定義佈局實現:github

SlidingLayout繼承於 HorizontalScrollView


/**
* Created by Administrator on 2017/3/29.
*/app

public class SlidingLayout extends HorizontalScrollView{ide

/** 左側右邊間距 */
private float rightPadding;
/** 左側菜單的寬度 */
private int leftWidth;
private ViewGroup leftView;
private ViewGroup contentView;
private final Context context;
private boolean isOpenMeun = true;
private ImageView shadowView;佈局

public SlidingLayout(Context context) {
this(context,null);
}this

public SlidingLayout(Context context, AttributeSet attrs) {
this(context, attrs,0);
}orm

public SlidingLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
this.context = context;
//獲取自定義的屬性
TypedArray typedArray=context.obtainStyledAttributes(attrs,R.styleable.SlidingLayout);
rightPadding=typedArray.getDimension(R.styleable.SlidingLayout_rightPadding,80);
//計算左側菜單的寬度
leftWidth = (int) (getScreenWidth() - rightPadding + 0.5f);
}xml

//獲取屏幕的寬度
private float getScreenWidth() {
return getResources().getDisplayMetrics().widthPixels;
}繼承

@Override /** 佈局解析完畢的時候 */
protected void onFinishInflate() {
super.onFinishInflate();
ViewGroup container= (ViewGroup) getChildAt(0);
if(container.getChildCount() > 2){
throw new IllegalStateException("SlidingLayout中只能放兩個子View");
}
//獲取左側菜單view
leftView = (ViewGroup) container.getChildAt(0);
//獲取主佈局的Viwe
contentView = (ViewGroup) container.getChildAt(1);
//設置子view 的寬度
leftView.getLayoutParams().width = leftWidth;
contentView.getLayoutParams().width = (int) getScreenWidth();

//移除父佈局
container.removeView(contentView);
FrameLayout frameLayout=new FrameLayout(context);
frameLayout.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.MATCH_PARENT));
frameLayout.addView(contentView);
//添加陰影
shadowView = new ImageView(context);
shadowView.setBackgroundColor(Color.parseColor("#99000000"));
frameLayout.addView(shadowView);
container.addView(frameLayout);
}

/**
* 該方法在滑動的時候會不斷的調用
* @param l : left
* @param t
* @param oldl
* @param oldt
*/
@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
float x=l*0.8f;//偏移量
leftView.setTranslationX(x);//平移
float color = 1 - l * 1.0f / leftWidth;
shadowView.setAlpha(color);
}

@Override
public boolean onTouchEvent(MotionEvent ev) {

switch (ev.getAction()) {
case MotionEvent.ACTION_UP://手指擡起的時候判斷是否關閉
int currentX = getScrollX();
if (isOpenMeun) {
if (currentX >= leftWidth / 2) {
closeMeun();
} else {
openMeun();
}
//點擊關閉
float x = ev.getX();
if (x > leftWidth) {
closeMeun();
}
return true;
} else {//關閉狀態
if (currentX < leftWidth / 2) {
openMeun();
} else {
closeMeun();

}
return true;
}

}
return super.onTouchEvent(ev);

}
/** 關閉菜單 */
public void closeMeun(){
isOpenMeun = false;
smoothScrollTo(leftWidth,0);// 250ms
}

/** 打開菜單 */
public void openMeun(){
isOpenMeun = true;
smoothScrollTo(0,0);
}
}

====attrs屬性文件========

<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="SlidingLayout">
<attr name="rightPadding" format="dimension"/>
</declare-styleable>
</resources>

===========佈局方面-========

<?xml version="1.0" encoding="utf-8"?>
<com.example.myqq.SlidingLayout
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"
app:rightPadding="65dp"
tools:context="com.example.myqq.MainActivity">


<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">

<include layout="@layout/left_main" />

<include layout="@layout/right_main" />


</LinearLayout>


</com.example.myqq.SlidingLayout>

 =============activity=======

package com.example.myqq;import android.animation.ObjectAnimator;import android.annotation.TargetApi;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.WindowManager;import android.widget.ArrayAdapter;import android.widget.ImageView;import android.widget.ListView;public class MainActivity extends AppCompatActivity {    private String strings[] = {"開通會員", "QQ錢包", "個性裝扮", "個人收藏", "個人相冊", "個人文件", "個人日程", "個人名片夾"};    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setState();        setContentView(R.layout.activity_main);        ListView listView= (ListView) findViewById(R.id.list_left);        listView.setDividerHeight(0);        listView.setAdapter(new ArrayAdapter<>(this,android.R.layout.simple_list_item_1,strings));        ImageView bgimg1= (ImageView) findViewById(R.id.bgimg);        float currentY=bgimg1.getTranslationY();        ObjectAnimator animator = ObjectAnimator.ofFloat(bgimg1, "translationY", currentY, -100, -40, currentY);        animator.setDuration(5000);        animator.setRepeatCount(ObjectAnimator.INFINITE);        animator.start();    }    @TargetApi(20)    private void setState() {        WindowManager.LayoutParams params=new WindowManager.LayoutParams();        params.flags=WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS;        getWindow().setAttributes(params);    }}
相關文章
相關標籤/搜索