CODEWITHSUNDEEP
androidandroid-layoutandroid-imagebutton
Kaos
Kaos

Reputation: 33

(android) How to put images that continue on next line when screen width is full?

Well...maybe it's very simple but I can't find a sample of how to do this.

I need to display a set of imagesbuttons (almost 10), and I wish to display them once in the right of the another using the available width and when there's no more room, then continue in the space below. (preety simple in html buy I'm going crazy in android)

The original idea was the image and a textview below as title, later I encounter that it was too much for my very basic Android, so I decided, only imagebuttons.

It was very lovely to put a fixed quantity as a parameter and resize the images to fit the screen distribution....this is also too much for me now.

I take this idea having in mind both...relativelayout supposing that when no more space is available, then it continues below...I cant.

As Linearlayout horizontal....I cant :(

Should I do that from the code instead of layouts?

Here is my actual screen: https://i.sstatic.net/GuVDv.jpg

The Ideal: https://i.sstatic.net/kqsOJ.jpg

This is my basic code:

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


    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageButton1"
        android:src="@drawable/btn_fra_pierre"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageButton2"
        android:src="@drawable/btn_sab_evo"
        android:layout_alignParentTop="true"
        android:layout_toRightOf="@+id/imageButton1"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageButton3"
        android:src="@drawable/btn_fra_pierre"
        android:layout_alignParentTop="true"
        android:layout_toRightOf="@+id/imageButton2"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageButton4"
        android:src="@drawable/btn_sab_evo"
        android:layout_alignParentTop="true"
        android:layout_toRightOf="@+id/imageButton3"/>



</RelativeLayout>

Thanks a lot!

Upvotes: 1

Views: 210

Answers (2)

Gavriel
Gavriel

Reputation: 19237

flexbox-layout by Google is a bit newer: https://github.com/google/flexbox-layout

Upvotes: 1

Much Overflow
Much Overflow

Reputation: 3140

What you are trying to do is called a FlowLayout. It is not something available within the standard android SDK. You may have to write your own custom layout for this. I would suggest taking a look at some third party libraries such as this https://github.com/ApmeM/android-flowlayout

Upvotes: 1

Related Questions