Android GridView scrolling with ImageButtons

Question

I am building an app drawer fragment and am using a GridView for displaying each app item. Currently, the drawer is not vertically scrolling as I had hoped. I would prefer to use the ImageButtons as the only focusable items to keep consistent with my other screens. Essentially, all navigation is done by moving between ImageButtons (not the GridView area associated with each item). This app is a launcher for a TV, so the GridView should scroll with remote input. The buttons are navigable right now, but only the ones actually being displayed.

I'm stuck trying to get the scrolling functionality to work. I'm assuming it has to do with forcing focus to the ImageButtons, but I am unsure how to fix this. Any help is appreciated!

fragment_app_drawer.xml

<FrameLayout 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"
             tools:context="ninjabox.tv.com.ninjabox.AppDrawerFragment"
             android:background="@color/dark_gray">

    <GridView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/appsGridLayout"
        android:numColumns="5"
        android:verticalSpacing="10dp"
        android:columnWidth="50dp"
        android:stretchMode="columnWidth"
        android:gravity="center"
        android:focusable="false"
        android:descendantFocusability="afterDescendants"
        android:scrollIndicators="right">
    </GridView>

    <ProgressBar
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/fragmentProgressBar"
        android:layout_gravity="center"
        android:visibility="invisible"/>

</FrameLayout>

app_drawer_item.xml

    <?xml version="1.0" encoding="utf-8"?>
<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:padding="25dp"
                android:clipToPadding="false"
                android:focusable="false">

    <ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/appIcon"
        android:scaleType="fitCenter"
        android:adjustViewBounds="true"
        android:cropToPadding="false"
        android:stateListAnimator="@anim/button_elevation"
        android:background="@drawable/image_button_drawable"
        android:elevation="@dimen/elevation_default"
        android:src="@drawable/spotify_icon"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:padding="8dp"
        android:focusable="true"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/appLabel"
        android:textSize="@dimen/abc_text_size_medium_material"
        android:textColor="#ffffff"
        android:paddingTop="8dp"
        android:paddingBottom="8dp"
        android:text="App Name"
        android:layout_below="@+id/appIcon"
        android:layout_centerHorizontal="true"/>
</RelativeLayout>

AppDrawerFragment.java ArrayAdapter

@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
    super.onActivityCreated(savedInstanceState);
    ArrayAdapter<AppDetail> adapter = new ArrayAdapter<AppDetail>(
            getActivity(),
            R.layout.app_drawer_item,
            MainActivity.getApps()) {
        @Override
        public View getView(final int position, View convertView, ViewGroup parent) {
            if(convertView == null){
                convertView = getLayoutInflater(null).inflate(R.layout.app_drawer_item, null);
            }

            ImageButton appIconButton = (ImageButton)convertView.findViewById(R.id.appIcon);
            appIconButton.setImageDrawable(mApps.get(position).getIcon());
            if (position == 0) {
                appIconButton.requestFocus();
            }
            appIconButton.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(getContext(), mApps.get(position).getName(), Toast.LENGTH_LONG).show();
                }
            });

            TextView appLabel = (TextView)convertView.findViewById(R.id.appLabel);
            appLabel.setText(mApps.get(position).getLabel());

            return convertView;
        }
    };

    mGridView.setAdapter(adapter);
}

Answer 1

You just have to surround what you want to scroll with scrollView. For example, if you want to scrool the GridView in your first layout, add that:

<ScrollView 
android:id="@+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">

<GridView


    <!-- everything you already have -->

</GridView>
</ScrollView>

I have not test it but i would work.