Using RecyclerView with GridLayoutManager to add dynamic buttons to a layout

Question

I am adding dynamic imagebuttons to a layout in a Fragment using recyclerview with gridlayoutmanager. The buttons are added as a user performs an action, so they are not all created during onCreateView().

I seem to have to initialize my recycler view and adapter onCreateView() with a an empty imagebutton, when my app starts up. And so I do that, but it creates a little grey square like the image below.

and then when the user performs an action and the real button I want is created, the square is still present over my image button that was just created like you can see in this new image below.

DOES ANYONE KNOW HOW I CAN GET THE INITIAL EMPTY GREY IMAGE BUTTON TO NOT BE THERE AT STARTUP OR OVER MY "DriveDroid" IMAGE BUTTON?

I have tried setting the initial background of my image button to transparent (using background color = #00000000), but this seems to make a transparent image button over my DriveDroid button, so that my onClick listener for DriveDroid no longer works.

Here is how I initialize my recycler view:

public class MyFragment extends Fragment {

private GridLayoutManager lLayout;



@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.my_fragment, container, false);


    // Create an empty list to initialize the adapter (or else get nullPointerException error)
    List<ItemObject> myList = new ArrayList<ItemObject>();


    lLayout = new GridLayoutManager(getActivity(), 4, GridLayoutManager.HORIZONTAL, false);

    RecyclerView rView = (RecyclerView)view.findViewById(R.id.recycler_view);

    rView.setHasFixedSize(true);
    rView.setLayoutManager(lLayout);

    RecyclerViewAdapter rcAdapter = new RecyclerViewAdapter(getActivity(),myList);
    rView.setAdapter(rcAdapter);


    return view;
}

And here is my layout my_fragment

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    android:layout_margin="5dp"
    android:id="@+id/my_fragment"
    >

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scrollbars="horizontal" />


            <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/new_app_button"
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/new_app_name"
                android:layout_below="@+id/new_app_button"
                android:layout_alignStart="@+id/new_app_button"
                android:layout_alignLeft="@+id/new_app_button"
                android:gravity="center"
                />

</RelativeLayout>

HERE IS HOW I CHANGED MY LAYOUT TO GET IT TO WORK, IF IT HELPS ANYONE ELSE!

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    android:layout_marginTop="15dp"
    android:id="@+id/my_fragment"
    >


    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scrollbars="horizontal" />

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/new_app_button"
        />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/new_app_name"
        android:gravity="center"
        android:layout_below="@+id/new_app_button"

        />


</RelativeLayout>


</LinearLayout>

in your my_fragment the 3 elements (RecyclerView, ImageButton, TextView) overlaps each other, either put them in LinearLayout, or properties to make them after each others. The ImageButton with id "new_app_button" is the grey image button which appears, Change its background and it should work. — Omar HossamEldin, May 10 '16 at 23:33
Thanks! I added a linear layout to get it to work! You can answer my question and I will up-rate it if you'd like. Also, I have another question that I posted if you'd be able to answer it: http://stackoverflow.com/questions/37150975/adding-dynamic-buttons-to-recyclerview-with-gridlayoutmanager — Natalie, May 11 '16 at 00:11
I have added the answer, Please mark is as accepted answer. Regarding the other question i will check it. — Omar HossamEldin, May 11 '16 at 11:52

score 1 · Accepted Answer · answered May 11 '16 at 10:13

1

As mentioned in the comment, that your controls was overlapping each others, you should wrap them inside linear layout or add properties to make them positioned relative to each others.

Regarding the grey button this should be related to "new_app_button"

answered May 11 '16 at 10:13

Omar HossamEldin

3,033
1
25
51

Using RecyclerView with GridLayoutManager to add dynamic buttons to a layout

1 Answers1