Question

我正在为filter目的从右到左创建 SlidingPanelLayout 。面板正常工作从右侧出来并做动画但是当动画停止时它直接转到左侧一边但是我希望比率是70％意味着right side panel came out 70% of the total screen，当再次点击它会进入后面并显示完整的活动。

当第一次动画停止时，侧面板会在屏幕截图中显示左侧。但我希望它在右侧。

ScreenShot：

但是我想显示它的写入方面，当再次点击时它会向右侧再次隐藏。

activity_inventory.xml

<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"
    android:background="#e6e6e6"
    android:id="@+id/mainLayout"
    tools:context="com.example.softeng.jogi.InventoryActivity">

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/backLayout"
        tools:ignore="NotSibling">

    </RelativeLayout>

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

    <com.rey.material.widget.FloatingActionButton
        android:id="@+id/button_bt_float_wave_color"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        style="@style/LightFABWaveColor"
        android:layout_margin="8dp"/>

</RelativeLayout>

filter.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">

    <RelativeLayout
        android:id="@+id/filter_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#0072BA"
        android:visibility="invisible">

    </RelativeLayout>
</RelativeLayout>

filterAnimation.java

public class FilterAnimation implements Animation.AnimationListener
{
    Context context;

    RelativeLayout filterLayout, otherLayout;

    private Animation filterSlideIn, filterSlideOut, otherSlideIn, otherSlideOut;

    private static int otherLayoutWidth, otherLayoutHeight;

    private boolean isOtherSlideOut = false;

    private int deviceWidth;

    private int margin;

    public FilterAnimation(Context context)
    {
        this.context = context;

        DisplayMetrics displayMetrics = context.getResources().getDisplayMetrics();

        deviceWidth = displayMetrics.widthPixels; // as my animation is x-axis related so i gets the device width and will use that width,so that this sliding menu will work fine in all screen resolutions
    }

    public void initializeFilterAnimations(RelativeLayout filterLayout)
    {
        this.filterLayout = filterLayout;

        filterSlideIn = AnimationUtils.loadAnimation(context, R.anim.filter_slide_in);

        filterSlideOut = AnimationUtils.loadAnimation(context, R.anim.filter_slide_out);

    }

    public void initializeOtherAnimations(RelativeLayout otherLayout)
    {
        this.otherLayout = otherLayout;

        otherLayoutWidth = otherLayout.getWidth();

        otherLayoutHeight = otherLayout.getHeight();


        otherSlideIn = AnimationUtils.loadAnimation(context, R.anim.other_slide_in);
        otherSlideIn.setAnimationListener(this);

        otherSlideOut = AnimationUtils.loadAnimation(context, R.anim.other_slide_out);
        otherSlideOut.setAnimationListener(this);
    }

    public void toggleSliding()
    {
        if(isOtherSlideOut) //check if findLayout is already slided out so get so animate it back to initial position
        {

            filterLayout.startAnimation(filterSlideOut);

            filterLayout.setVisibility(View.INVISIBLE);

            otherLayout.startAnimation(otherSlideIn);

        }
        else //slide findLayout Out and filterLayout In
        {
            otherLayout.startAnimation(otherSlideOut);

            filterLayout.setVisibility(View.VISIBLE);

            filterLayout.startAnimation(filterSlideIn);
        }
    }

    @Override
    public void onAnimationEnd(Animation animation)
    {
        if(isOtherSlideOut) //Now here we will actually move our view to the new position,because animations just move the pixels not the view
        {
            RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(otherLayoutWidth, otherLayoutHeight);

            otherLayout.setLayoutParams(params);

            isOtherSlideOut = false;
        }
        else
        {
            margin = (deviceWidth * 70) / 100; //here im coverting device percentage width into pixels, in my other_slide_in.xml or other_slide_out.xml you can see that i have set the android:toXDelta="80%",so it means the layout will move to 80% of the device screen,to work across all screens i have converted percentage width into pixels and then used it



            RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(otherLayoutWidth, otherLayoutHeight);

            params.leftMargin = margin;

            params.rightMargin = -margin; //same margin from right side (negavite) so that our layout won't get shrink


            otherLayout.setLayoutParams(params);

            isOtherSlideOut = true;

            dimOtherLayout();
        }
    }

    @Override
    public void onAnimationRepeat(Animation animation)
    {

    }

    @Override
    public void onAnimationStart(Animation animation)
    {

    }

    private void dimOtherLayout()
    {
        AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.5f);

        alphaAnimation.setFillAfter(true);

        otherLayout.startAnimation(alphaAnimation);
    }

}

InventoryActivity.java

public class InventoryActivity extends AppCompatActivity implements View.OnClickListener {

    RelativeLayout filterLayout, findLayout;

    FilterAnimation filterAnimation;
    FloatingActionButton bffilter;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_inventory);

        assert getSupportActionBar() != null;
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);

        filterLayout = (RelativeLayout)findViewById(R.id.filter_layout);

        findLayout = (RelativeLayout)findViewById(R.id.backLayout);

        bffilter = (FloatingActionButton)findViewById(R.id.button_bt_float_wave_color);
        bffilter.setOnClickListener(this);

        filterAnimation = new FilterAnimation(this);

        initializeAnimations();


    }

    private void initializeAnimations(){

        final ViewTreeObserver filterObserver = filterLayout.getViewTreeObserver();

        filterObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
            @Override
            public void onGlobalLayout() {

                filterLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);

                DisplayMetrics displayMetrics = getResources().getDisplayMetrics();

                int deviceWidth = displayMetrics.widthPixels;

                int filterLayoutWidth = (deviceWidth * 70) / 100;

                RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(filterLayoutWidth, RelativeLayout.LayoutParams.MATCH_PARENT);

                filterLayout.setLayoutParams(params);

                filterAnimation.initializeFilterAnimations(filterLayout);
            }
        });


        final ViewTreeObserver findObserver = findLayout.getViewTreeObserver();
        findObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
            @Override
            public void onGlobalLayout() {
                findLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);

                filterAnimation.initializeOtherAnimations(findLayout);
            }
        });

    }


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

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == android.R.id.home) {
            this.finish();
            onBackPressed();
            return true;
        }

        return super.onOptionsItemSelected(item);
    }


    @Override
    public void onClick(View v) {

        int id = v.getId();

        switch (id){
            case R.id.button_bt_float_wave_color:
                filterAnimation.toggleSliding();
                break;
        }
    }
}

filter_slide_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator">

    <translate
        android:fromXDelta="130%"
        android:toXDelta="30%"
        android:duration="1000" />

</set>

filter_slide_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator">

    <translate
        android:fromXDelta="30%"
        android:toXDelta="130%"
        android:duration="1000"/>

</set>

other_slide_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator">

    <translate
        android:fromXDelta="-70%"
        android:toXDelta="30%"
        android:duration="1000"
        android:fillEnabled="true"/>

</set>

other_slide_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator" >

    <translate
        android:fromXDelta="30%"
        android:toXDelta="-70%"
        android:duration="1000"/>

</set>

我的问题：我想如何设置右侧面板进行显示，再次点击它就会消失。只是我我的这段代码我要删除面板完全左侧看到的截图。另一部分工作正常。

ScreenShot：

先谢谢。

Answer 1

我想我找到了解决方案。我正在创建新项目。

<强> Sliding.java

public class Sliding extends LinearLayout
{
    private Paint innerPaint, borderPaint ;
    public Sliding(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }
    public Sliding(Context context) {
        super(context);
        init();
    }
    private void init() {
        innerPaint = new Paint();
        innerPaint.setARGB(0, 255, 255, 255); //gray
        innerPaint.setAntiAlias(true);
        borderPaint = new Paint();
        borderPaint.setARGB(255, 255, 255, 255);
        borderPaint.setAntiAlias(true);
        borderPaint.setStyle(Paint.Style.STROKE);
        borderPaint.setStrokeWidth(2);
    }
    public void setInnerPaint(Paint innerPaint) {
        this.innerPaint = innerPaint;
    }
    public void setBorderPaint(Paint borderPaint) {
        this.borderPaint = borderPaint;
    }
    @Override
    protected void dispatchDraw(Canvas canvas) {
        RectF drawRect = new RectF();
        drawRect.set(0,0, getMeasuredWidth(), getMeasuredHeight());
        canvas.drawRoundRect(drawRect, 5, 5, innerPaint);
        canvas.drawRoundRect(drawRect, 5, 5, borderPaint);
        super.dispatchDraw(canvas);
    }
}

<强> Sliding2Activity.java

public class Sliding2Activity extends Activity {

    CheckBox c1,c2,c3;
    int key=0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_sliding2);

        final Sliding popup = (Sliding) findViewById(R.id.sliding1);
        popup.setVisibility(View.GONE);

        final FloatingActionButton btn=(FloatingActionButton)findViewById(R.id.show1);
        btn.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View arg0) {
                if (key == 0) {
                    key = 1;
                    popup.setVisibility(View.VISIBLE);

                } else if (key == 1) {
                    key = 0;
                    popup.setVisibility(View.GONE);

                }
            }
        });

    }


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

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

<强> activity_sliding2.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="right"
    android:orientation="horizontal">

    <com.rey.material.widget.FloatingActionButton
        android:id="@+id/show1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        style="@style/LightFABWaveColor"
        android:layout_margin="8dp"
        android:layout_gravity="bottom" />

   <com.example.softeng.panel.Sliding
        android:id="@+id/sliding1"
        android:layout_width="250dp"
        android:layout_height="match_parent"
        android:background="#0072BA"
        android:gravity="left"
        android:orientation="vertical"
        android:padding="1px">

        <CheckBox
            android:id="@+id/check1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Option1"
            android:textColor="#FFFFFF" />

        <CheckBox
            android:id="@+id/check2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Option2"
            android:textColor="#FFFFFF" />

        <CheckBox
            android:id="@+id/check3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Option3"
            android:textColor="#FFFFFF" />
    </com.example.softeng.panel.Sliding>



</LinearLayout>

ScreenShot：

活动正在运行时的正常屏幕。

点击 FloatinActionButton 时。布局正在改变。

再次点击时，输出是第一屏。

在Android

1 个答案: