1

I try to create a layout which should look like this:

  • Listview
  • ImageButton
  • Listview
  • ImageButton
  • Listview
  • ImageButton
  • ....

So that I have 5 Listviews and 5 ImageButtons in the end.

If I have just one element in each ListView it works fine but when I start adding more and more elements the buttons disappear behind the elements.

Now it looks like one big ListView instead of being separated by a Button.

That is the layout.xml

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:id="@+id/detailview_1_listview"/>

    <ImageButton
        android:id="@+id/detailview_1_button_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_below="@id/detailview_1_listview"
        android:src="@android:drawable/ic_input_add" />

    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/detailview_1_button_add"
        android:id="@+id/detailview_2_listview"/>

    <ImageButton
        android:id="@+id/detailview_2_button_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_below="@id/detailview_2_listview"
        android:src="@android:drawable/ic_input_add" />

    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/detailview_2_button_add"
        android:id="@+id/detailview_3_listview"/>

    <ImageButton
        android:id="@+id/detailview_3_button_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_below="@id/detailview_3_listview"
        android:src="@android:drawable/ic_input_add" />

    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/detailview_3_button_add"
        android:id="@+id/detailview_4_listview"/>

    <ImageButton
        android:id="@+id/detailview_4_button_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_below="@id/detailview_4_listview"
        android:src="@android:drawable/ic_input_add" />

    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/detailview_4_button_add"
        android:id="@+id/detailview_5_listview" />

    <ImageButton
        android:id="@+id/detailview_5_button_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_below="@id/detailview_5_listview"
        android:src="@android:drawable/ic_input_add" />
</RelativeLayout>

And the list_item.xml is

<RelativeLayout
    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">

    <ImageView
        android:id="@+id/detailview_1_imageview"
        android:layout_width="109dp"
        android:layout_height="112dp"
        app:srcCompat="@android:drawable/ic_menu_gallery"
        tools:layout_editor_absoluteX="62dp"
        tools:layout_editor_absoluteY="62dp" />

    <ImageView
        android:id="@+id/detailview_2_imageview"
        android:layout_width="109dp"
        android:layout_height="112dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="196dp"
        app:srcCompat="@android:drawable/ic_menu_gallery"
        tools:layout_editor_absoluteX="62dp"
        tools:layout_editor_absoluteY="62dp" />

    <Switch
        android:id="@+id/detailview_switch_mangel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentTop="true"
        android:layout_marginEnd="524dp"
        android:layout_marginTop="94dp"
        android:text="Mangel" />

    <EditText
        android:id="@+id/detailview_textview_beschreibung"
        android:layout_width="230dp"
        android:layout_height="73dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="366dp"
        android:layout_marginTop="28dp"
        android:ems="10"
        android:inputType="textMultiLine"
        android:hint="Beschreibung"/>

    <EditText
        android:id="@+id/detailview_textview_fensternummer"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignStart="@+id/detailview_switch_mangel"
        android:layout_alignTop="@+id/detailview_textview_beschreibung"
        android:ems="10"
        android:hint="Nummer"
        android:inputType="number" />
</RelativeLayout>
Reaz Murshed
  • 23,691
  • 13
  • 78
  • 98
Michi
  • 19
  • 1
  • 8
  • off course it will disappear. Your best bet is to use scrollview as a parent layout. – Umair Jun 08 '18 at 09:12
  • instead the relative layout or in the relative layout ? :) – Michi Jun 08 '18 at 09:14
  • It's due to parent layout. You are using relative layout as parent and for list view you are using wrap content so its disappearing behind layout. – Abhishek Jun 08 '18 at 09:15
  • @Michi use scrollview as parent layout, and give fix height to your listviews. So you will be able to see all your data. – Umair Jun 08 '18 at 09:16
  • The way you're using the ListViews defeats their purpose. Use LinearLayouts instead and add new Views dynamically. – user1504495 Jun 08 '18 at 09:18
  • @Michi use some constant values for height for list views so it won't change – Abhishek Jun 08 '18 at 09:21
  • @user1504495 i did a lot of research about this approach but i didnt find a thing about it – Michi Jun 08 '18 at 09:57
  • @Michi The reason for using ListView or RecyclerView is because it is very efficient if used correctly. However in your layout you'd lose all the benefits and they'd be more hassle than anything else. Basically to have the advantages of List/RecyclerView it needs to have any other height other than wrap_content. If you must have wrap_content you might as well use a LinearLayout. – user1504495 Jun 08 '18 at 10:06

2 Answers2

2

I would suggest you add the ImageButton under each ListView as the footer of that ListView. In that case, the button will not hide anymore and you will get an appropriate behaviour while scrolling your list.

It is very simple to add a footer in your ListView. I am just sharing some code from this answer here for convenience.

View footerView =  ((LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.footer_layout, null, false);
list.addFooterView(footerView);

Please remember to add the footer view in your ListView before setting your adapter in your ListView.

There is another way to having the behaviour that you want, with using NestedScrollView. Here is a nice tutorial on how you can have multiple RecyclerView inside a single NestedScrollView.

If you are considering to use RecyclerView instead of ListView, you might have a single RecyclerView and populate the items based on your need like the way suggested here. The idea is to have a single RecyclerView so that your scrolling and recycling the views can be implemented in most effective way.

Reaz Murshed
  • 23,691
  • 13
  • 78
  • 98
  • You suggestion is nice until `RecyclerView`s, why it haven't any attribute footer or header – Abner Escócio Jun 08 '18 at 09:39
  • I think you have misunderstood about the different view types that I wanted to point out. I have also provided a [github link](https://github.com/masudias/dynamic-recyclerview) to explain using different view types in `RecyclerView` as well. Please have a look. However, you might also add a footer or header in a `RecyclerView`. See this [answer here](https://stackoverflow.com/a/31154402/3145960). – Reaz Murshed Jun 08 '18 at 09:51
  • If I do it with the footer approach I have to create one footer_layout.xml for each ListView. Did I get it right ? – Michi Jun 08 '18 at 10:45
  • Yes, you might create a separate footer for each `ListView`. – Reaz Murshed Jun 08 '18 at 11:37
1

Use ScrollView as a parent layout. Then your listview won't merge with your imageButtons.

<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent"
android:layout_height="wrap_content">

<ListView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:id="@+id/detailview_1_listview"/>

<ImageButton
    android:id="@+id/detailview_1_button_add"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="20dp"
    android:layout_below="@id/detailview_1_listview"
    android:src="@android:drawable/ic_input_add"
    />

<ListView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_below="@id/detailview_1_button_add"
    android:id="@+id/detailview_2_listview"/>

<ImageButton
    android:id="@+id/detailview_2_button_add"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="20dp"
    android:layout_below="@id/detailview_2_listview"
    android:src="@android:drawable/ic_input_add"
    />

<ListView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_below="@id/detailview_2_button_add"
    android:id="@+id/detailview_3_listview"/>

<ImageButton
    android:id="@+id/detailview_3_button_add"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="20dp"
    android:layout_below="@id/detailview_3_listview"
    android:src="@android:drawable/ic_input_add"
    />

<ListView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_below="@id/detailview_3_button_add"
    android:id="@+id/detailview_4_listview"/>

<ImageButton
    android:id="@+id/detailview_4_button_add"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="20dp"
    android:layout_below="@id/detailview_4_listview"
    android:src="@android:drawable/ic_input_add"
    />

<ListView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_below="@id/detailview_4_button_add"
    android:id="@+id/detailview_5_listview"/>

<ImageButton
    android:id="@+id/detailview_5_button_add"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="20dp"
    android:layout_below="@id/detailview_5_listview"
    android:src="@android:drawable/ic_input_add"
    />

Umair
  • 6,366
  • 15
  • 42
  • 50
  • listview inside a scrollview? or nested scrollview? Which one is better? – Aswin P Ashok Jun 08 '18 at 09:16
  • Doing so would make the ScrollView capture any scroll events and make the ListViews useless. – user1504495 Jun 08 '18 at 09:16
  • listview inside a scrollview, nested scrollview will make it messy. In this way scrollview will take the scroll and also listviews will have fix heights so they won't merge will each other. – Umair Jun 08 '18 at 09:17
  • By the way this design approach the OP is using is all togather wrong because it's not how it is done. Best way is to inflate layout at run time and implement a nested scroll. – Umair Jun 08 '18 at 09:18