Question

我有一个3级深的菜单结构，在这里我总是要突出显示当前活动的菜单级别（灰色背景）和居中（选定）的项目（白色边框）。向上/向下滚动可将您带入另一个菜单级别。向左/向右滑动可在该菜单级别更改当前选择的项目。

当前活动的菜单和项目在“活动”中处理。该活动还将覆盖“ dispatchTouchEvent”，因此触摸事件不会传递到RecyclerViews。

居中项的突出显示应始终位于中心，并且RecyclerView项应进行动画处理，好像它不在此处一样。

我希望当用户猛扑时，中间项目周围的白色边框和灰色背景可以动画到下一个菜单级别。另外，作为奖励，我想使当前活动菜单比其他两个菜单大一点。（图中未显示）

我认为应该有两种方式：

创建一个灰色矩形，中间带有白色边框半径并将此形状设置为活动菜单级别的动画。
让每个recyclerView都有白色边框，并为更改菜单级别时的背景/白色边框。

当前状态：

enter link description here

我的布局：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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">

    <LinearLayout
        android:id="@+id/MainLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:background="#000">

        <android.support.v7.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="match_parent"
            android:layout_height="160dp"
            android:background="#000"
            android:fadingEdge="horizontal">
        </android.support.v7.widget.RecyclerView>

        <android.support.v7.widget.RecyclerView
            android:id="@+id/recyclerViewSecond"
            android:layout_width="match_parent"
            android:layout_height="160dp"
            android:background="#000"
            android:fadingEdge="horizontal">
        </android.support.v7.widget.RecyclerView>

        <android.support.v7.widget.RecyclerView
            android:id="@+id/recyclerViewThird"
            android:layout_width="match_parent"
            android:layout_height="160dp"
            android:background="#000"
            android:fadingEdge="horizontal">
        </android.support.v7.widget.RecyclerView>
    </LinearLayout>

</android.support.constraint.ConstraintLayout>

MainActivity：

public class MainActivity extends AppCompatActivity implements View.OnTouchListener {

    private int activeMenu = 0;
    private int[] activeItem = {0,0,0};
    private RecyclerView[] recyclerViews = new RecyclerView[3];

    private GestureDetector gestureDetector;

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

        this.initItems();
        this.updateActiveMenu();

        gestureDetector = new GestureDetector(this, new OnSwipeListener(){

            @Override
            public boolean onSwipe(Direction direction) {
                if (direction == Direction.up) {
                    if (activeMenu < 2) activeMenu++;
                    updateActiveMenu();
                    Log.d(TAG, "onSwipe: up  - activeMenu " + activeMenu);
                }

                if (direction == Direction.down) {
                    if (activeMenu > 0) activeMenu--;
                    updateActiveMenu();
                    Log.d(TAG, "onSwipe: down - activeMenu " + activeMenu);
                }

                if (direction == Direction.left) {
                    if (activeItem[activeMenu] < mNames.size()-1) activeItem[activeMenu]++;
                    updateMenuItem();
                    Log.d(TAG, "onSwipe: left - activeMenuItem: " +activeItem[activeMenu]);

                }

                if (direction == Direction.right) {
                    if (activeItem[activeMenu] > 0) activeItem[activeMenu]--;
                    updateMenuItem();
                    Log.d(TAG, "onSwipe: right - activeMenuItem: " +activeItem[activeMenu]);
                }
                return true;
            }
        });


        findViewById(R.id.MainLayout).setOnTouchListener(this);

    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        gestureDetector.onTouchEvent(event);
        return true;
    }

    @Override
    public boolean dispatchTouchEvent(MotionEvent ev) {
        gestureDetector.onTouchEvent(ev);
        return true;
    }

    private void updateMenuItem() {

   recyclerViews[activeMenu].smoothScrollToPosition(activeItem[activeMenu]);

    }

    private void updateActiveMenu() {

       String first = activeMenu == 0 ? "#646464" : "#000000";
       String second = activeMenu == 1 ? "#646464" : "#000000";
       String third = activeMenu == 2 ? "#646464" : "#000000";

       recyclerViews[0].setBackgroundColor(Color.parseColor(first));
       recyclerViews[1].setBackgroundColor(Color.parseColor(second));
       recyclerViews[2].setBackgroundColor(Color.parseColor(third));
    }
   // [...]
}

在RecyclerViewer中绘制背景动画

0 个答案: