Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit d64610cb authored by Cassy Chun-Crogan's avatar Cassy Chun-Crogan
Browse files

[DocsUI M3] Space grid items evenly 

See the document "How to evenly space items dynamically with
GridLayoutManager" in the bug for an explanation.

Bug: 404978549
Test: m DocumentsUIGoogle && manual inspection
Flag: com.android.documentsui.flags.use_material3
Change-Id: Ib7a2ab8d6b1df2d5cf7d20893db3b2a5d697e4cc
parent 8b029bc3

src/com/android/documentsui/dirlist/DirectoryFragment.java

+25 −1
Original line number Diff line number Diff line
@@ -193,6 +193,7 @@ public class DirectoryFragment extends Fragment implements SwipeRefreshLayout.On 
    private IconHelper mIconHelper;

    private SwipeRefreshLayout mRefreshLayout;

    private RecyclerView mRecView;

    private GridEvenSpacingDecoration mGridEvenSpacingDecoration;

    private DocumentsAdapter mAdapter;

    private DocumentClipper mClipper;

    private GridLayoutManager mLayout;
@@ -525,6 +526,14 @@ public class DirectoryFragment extends Fragment implements SwipeRefreshLayout.On 


        mState = mActivity.getDisplayState();



        if (isUseMaterial3FlagEnabled()) {

            mGridEvenSpacingDecoration = new GridEvenSpacingDecoration();

            if (mState.derivedMode == MODE_GRID) {

                // Ensure items are spaced evenly in the grid layout.

                mRecView.addItemDecoration(mGridEvenSpacingDecoration);

            }

        }



        // Read arguments when object created for the first time.

        // Restore state if fragment recreated.

        Bundle args = savedInstanceState == null ? getArguments() : savedInstanceState;
@@ -810,6 +819,15 @@ public class DirectoryFragment extends Fragment implements SwipeRefreshLayout.On 
    }



    public void onViewModeChanged() {

        if (isUseMaterial3FlagEnabled()) {

            // Only enable the decoration for grid mode.

            if (mState.derivedMode != MODE_GRID) {

                mRecView.removeItemDecoration(mGridEvenSpacingDecoration);

            } else {

                mRecView.addItemDecoration(mGridEvenSpacingDecoration);



            }

        }

        // Mode change is just visual change; no need to kick loader.

        mRootView.announceForAccessibility(getString(

                mState.derivedMode == State.MODE_GRID ? R.string.grid_mode_showing
@@ -867,7 +885,13 @@ public class DirectoryFragment extends Fragment implements SwipeRefreshLayout.On 
            mRecView.setPadding(pad, mAppBarHeight, pad, mSaveLayoutHeight);

        }



        if (isUseMaterial3FlagEnabled() && mRecView.getItemDecorationCount() > 0) {

            // Invalidate item decorations so they are recalculated before layout. This also

            // calls requestLayout().

            mRecView.invalidateItemDecorations();

        } else {

            mRecView.requestLayout();

        }

        mIconHelper.setViewMode(mode);



        int range = getResources().getDimensionPixelOffset(R.dimen.refresh_icon_range);

src/com/android/documentsui/dirlist/GridEvenSpacingDecoration.java

0 → 100644
+63 −0
Original line number Diff line number Diff line 
/*

 * Copyright (C) 2025 The Android Open Source Project

 *

 * Licensed under the Apache License, Version 2.0 (the "License");

 * you may not use this file except in compliance with the License.

 * You may obtain a copy of the License at

 *

 *      http://www.apache.org/licenses/LICENSE-2.0

 *

 * Unless required by applicable law or agreed to in writing, software

 * distributed under the License is distributed on an "AS IS" BASIS,

 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.

 * See the License for the specific language governing permissions and

 * limitations under the License.

 */



package com.android.documentsui.dirlist;



import static com.android.documentsui.util.FlagUtils.isUseMaterial3FlagEnabled;



import android.graphics.Rect;

import android.view.View;

import android.view.ViewGroup;



import androidx.recyclerview.widget.GridLayoutManager;

import androidx.recyclerview.widget.RecyclerView;



/**

 * RecyclerView ItemDecorator that distributes the horizontal space into equal size buckets

 * for each item (to match the bounds given by the GridViewLayout) and adds an offset to

 * either side to centre the item within its bucket. This only works when the layout manager

 * is GridViewLayout and all items have the same fixed width.

 */

public class GridEvenSpacingDecoration extends RecyclerView.ItemDecoration {

    @Override

    public void getItemOffsets(Rect outRect, View view, RecyclerView parent,

            RecyclerView.State state) {

        if (!isUseMaterial3FlagEnabled()) {

            return;

        }

        RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();

        if (!(layoutManager instanceof GridLayoutManager)) {

            return;

        }

        ViewGroup.MarginLayoutParams lp = (ViewGroup.MarginLayoutParams) view.getLayoutParams();

        if (lp.width == ViewGroup.LayoutParams.MATCH_PARENT

                || lp.width == ViewGroup.LayoutParams.WRAP_CONTENT) {

            // This item does not have a fixed width.

            return;

        }

        // Distribute the horizontal space into equal size buckets for each item and add an

        // offset to either side to centre the item within its bucket.

        int spanCount = ((GridLayoutManager) layoutManager).getSpanCount();

        int itemWidth = lp.getMarginStart() + lp.width + lp.getMarginEnd();

        int allocatedGridSpace =

                (parent.getWidth() - parent.getPaddingLeft() - parent.getPaddingRight())

                        / spanCount;

        int extraSpace = allocatedGridSpace - itemWidth;

        int offset = extraSpace / 2;

        outRect.left = offset;

        outRect.right = offset;

    }

}

tests/unit/com/android/documentsui/GridEvenSpacingDecorationTest.java

0 → 100644
+251 −0
Original line number Diff line number Diff line 
/*

 * Copyright (C) 2025 The Android Open Source Project

 *

 * Licensed under the Apache License, Version 2.0 (the "License");

 * you may not use this file except in compliance with the License.

 * You may obtain a copy of the License at

 *

 *      http://www.apache.org/licenses/LICENSE-2.0

 *

 * Unless required by applicable law or agreed to in writing, software

 * distributed under the License is distributed on an "AS IS" BASIS,

 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.

 * See the License for the specific language governing permissions and

 * limitations under the License.

 */

package com.android.documentsui;



import static com.android.documentsui.flags.Flags.FLAG_USE_MATERIAL3;



import static junit.framework.Assert.assertEquals;



import static org.mockito.Mockito.mock;

import static org.mockito.Mockito.when;



import android.graphics.Rect;

import android.platform.test.annotations.RequiresFlagsEnabled;

import android.platform.test.flag.junit.CheckFlagsRule;

import android.platform.test.flag.junit.DeviceFlagsValueProvider;

import android.view.View;

import android.view.ViewGroup;



import androidx.recyclerview.widget.GridLayoutManager;

import androidx.recyclerview.widget.RecyclerView;



import com.android.documentsui.dirlist.GridEvenSpacingDecoration;

import com.android.documentsui.testing.TestRecyclerView;



import org.junit.Before;

import org.junit.Rule;

import org.junit.Test;

import org.mockito.Mock;

import org.mockito.MockitoAnnotations;



import java.util.ArrayList;



@RequiresFlagsEnabled(FLAG_USE_MATERIAL3)

public class GridEvenSpacingDecorationTest {

    @Rule

    public final CheckFlagsRule mCheckFlagsRule = DeviceFlagsValueProvider.createCheckFlagsRule();

    private static final int ITEM_WIDTH = 100;

    private static final int ITEM_COUNT = 3;

    private TestRecyclerView mTestRecView;

    @Mock

    private GridLayoutManager mMockGridLayoutManager;

    private GridEvenSpacingDecoration mGridEvenSpacingDecoration;

    private ViewGroup.MarginLayoutParams mLayoutParamsForItem;

    private ArrayList<View> mMockItems;



    @Before

    public void setUp() {

        MockitoAnnotations.openMocks(this);



        mTestRecView = TestRecyclerView.create(new ArrayList<>());

        mTestRecView.setLayoutManager(mMockGridLayoutManager);



        // All items have the same width.

        mLayoutParamsForItem = new ViewGroup.MarginLayoutParams(ITEM_WIDTH, 100);

        mMockItems = new ArrayList<>();

        for (int i = 0; i < ITEM_COUNT; i++) {

            View mockItem = mock(View.class);

            when(mockItem.getLayoutParams()).thenReturn(mLayoutParamsForItem);

            mMockItems.add(mockItem);

        }



        mGridEvenSpacingDecoration = new GridEvenSpacingDecoration();

    }



    @Test

    public void testPerfectFit_noRecViewPadding_noItemMargins() {

        // ITEM_COUNT items per row.

        when(mMockGridLayoutManager.getSpanCount()).thenReturn(ITEM_COUNT);



        // Parent width fits the ITEM_COUNT items perfectly within one row.

        mTestRecView.setLeft(0);

        mTestRecView.setRight(ITEM_WIDTH * ITEM_COUNT);



        for (View mockItem : mMockItems) {

            Rect rect = new Rect();

            mGridEvenSpacingDecoration.getItemOffsets(rect, mockItem, mTestRecView,

                    new RecyclerView.State());

            // Offsets should be 0.

            Rect expectedRect = new Rect();

            assertEquals(expectedRect, rect);

        }

    }



    @Test

    public void testPerfectFit_recViewPadding_itemMargins() {

        // ITEM_COUNT items per row.

        when(mMockGridLayoutManager.getSpanCount()).thenReturn(ITEM_COUNT);



        int leftMargin = 1;

        int rightMargin = 2;

        int itemWidthWithMargins = leftMargin + ITEM_WIDTH + rightMargin;

        mLayoutParamsForItem.setMargins(leftMargin, 0, rightMargin, 0);



        // Parent width fits the ITEM_COUNT items perfectly within one row (between the padding).

        int leftPad = 10;

        int rightPad = 5;

        mTestRecView.setPadding(leftPad, 0, rightPad, 0);

        mTestRecView.setLeft(0);

        mTestRecView.setRight(leftPad + itemWidthWithMargins * ITEM_COUNT + rightPad);



        for (View mockItem : mMockItems) {

            Rect rect = new Rect();

            mGridEvenSpacingDecoration.getItemOffsets(rect, mockItem, mTestRecView,

                    new RecyclerView.State());

            // Offsets should be 0.

            Rect expectedRect = new Rect();

            assertEquals(expectedRect, rect);

        }

    }



    @Test

    public void testExtraSpace_SpaceLessThanOneItem() {

        // ITEM_COUNT items per row.

        when(mMockGridLayoutManager.getSpanCount()).thenReturn(ITEM_COUNT);



        int leftMargin = 1;

        int rightMargin = 2;

        int itemWidthWithMargins = leftMargin + ITEM_WIDTH + rightMargin;

        mLayoutParamsForItem.setMargins(leftMargin, 0, rightMargin, 0);



        // Parent width fits almost ITEM_COUNT+1 items (12 pixels too narrow).

        int leftPad = 10;

        int rightPad = 5;

        mTestRecView.setPadding(leftPad, 0, rightPad, 0);

        mTestRecView.setLeft(0);

        int spaceForItems = itemWidthWithMargins * (ITEM_COUNT + 1) - 12;

        mTestRecView.setRight(leftPad + spaceForItems + rightPad);



        // The space is divided into "span count" number of equal size buckets. The items will be

        // centred within their buckets.

        int spaceForItem = spaceForItems / ITEM_COUNT;

        int offset = (spaceForItem - itemWidthWithMargins) / 2;



        for (View mockItem : mMockItems) {

            Rect rect = new Rect();

            mGridEvenSpacingDecoration.getItemOffsets(rect, mockItem, mTestRecView,

                    new RecyclerView.State());

            Rect expectedRect = new Rect(offset, 0, offset, 0);

            assertEquals(expectedRect, rect);

        }

    }



    @Test

    public void testExtraSpace_SpaceMoreThanOneItem() {

        // ITEM_COUNT+1 items per row.

        int spanCount = ITEM_COUNT + 1;

        when(mMockGridLayoutManager.getSpanCount()).thenReturn(spanCount);



        int leftMargin = 1;

        int rightMargin = 2;

        int itemWidthWithMargins = leftMargin + ITEM_WIDTH + rightMargin;

        mLayoutParamsForItem.setMargins(leftMargin, 0, rightMargin, 0);



        // Parent width fits almost ITEM_COUNT+1 items (12 pixels extra).

        int leftPad = 10;

        int rightPad = 5;

        mTestRecView.setPadding(leftPad, 0, rightPad, 0);

        mTestRecView.setLeft(0);

        int spaceForItems = itemWidthWithMargins * (ITEM_COUNT + 1) + 12;

        mTestRecView.setRight(leftPad + spaceForItems + rightPad);



        // The space is divided into "span count" number of equal size buckets. The items will be

        // centred within their buckets.

        int spaceForItem = spaceForItems / spanCount;

        int offset = (spaceForItem - itemWidthWithMargins) / 2;



        for (View mockItem : mMockItems) {

            Rect rect = new Rect();

            mGridEvenSpacingDecoration.getItemOffsets(rect, mockItem, mTestRecView,

                    new RecyclerView.State());

            Rect expectedRect = new Rect(offset, 0, offset, 0);

            assertEquals(expectedRect, rect);

        }

    }



    @Test

    public void perfectFit_testMultipleRows() {

        // ITEM_COUNT-1 items per row.

        int spanCount = ITEM_COUNT - 1;

        when(mMockGridLayoutManager.getSpanCount()).thenReturn(spanCount);



        int leftMargin = 1;

        int rightMargin = 2;

        int itemWidthWithMargins = leftMargin + ITEM_WIDTH + rightMargin;

        mLayoutParamsForItem.setMargins(leftMargin, 0, rightMargin, 0);



        // Parent width fits ITEM_COUNT-1 items perfectly.

        int leftPad = 10;

        int rightPad = 5;

        mTestRecView.setPadding(leftPad, 0, rightPad, 0);

        mTestRecView.setLeft(0);

        int spaceForItems = itemWidthWithMargins * spanCount;

        mTestRecView.setRight(leftPad + spaceForItems + rightPad);



        for (View mockItem : mMockItems) {

            Rect rect = new Rect();

            mGridEvenSpacingDecoration.getItemOffsets(rect, mockItem, mTestRecView,

                    new RecyclerView.State());

            Rect expectedRect = new Rect();

            // Offsets should be 0 even for the item on the second row since the bucket size is

            // exactly itemWidthWithMargins.

            assertEquals(expectedRect, rect);

        }

    }



    @Test

    public void testExtraSpace_testMultipleRows() {

        // ITEM_COUNT-1 items per row.

        int spanCount = ITEM_COUNT - 1;

        when(mMockGridLayoutManager.getSpanCount()).thenReturn(spanCount);



        int leftMargin = 1;

        int rightMargin = 2;

        int itemWidthWithMargins = leftMargin + ITEM_WIDTH + rightMargin;

        mLayoutParamsForItem.setMargins(leftMargin, 0, rightMargin, 0);



        // Parent width fits almost ITEM_COUNT+1 items (12 pixels extra).

        int leftPad = 10;

        int rightPad = 5;

        mTestRecView.setPadding(leftPad, 0, rightPad, 0);

        mTestRecView.setLeft(0);

        int spaceForItems = itemWidthWithMargins * (ITEM_COUNT + 1) + 12;

        mTestRecView.setRight(leftPad + spaceForItems + rightPad);



        // The space is divided into "span count" number of equal size buckets. The items will be

        // centred within their buckets.

        int spaceForItem = spaceForItems / spanCount;

        int offset = (spaceForItem - itemWidthWithMargins) / 2;



        for (View mockItem : mMockItems) {

            Rect rect = new Rect();

            mGridEvenSpacingDecoration.getItemOffsets(rect, mockItem, mTestRecView,

                    new RecyclerView.State());

            Rect expectedRect = new Rect(offset, 0, offset, 0);

            assertEquals(expectedRect, rect);

        }

    }

}