I want my layout to look like this:
I used framelayout for this. The icons fit well but how can I fit the text as well? I tried textview but it overrides. Any help will be appreciated.
Here is my code so far:
<FrameLayout
android:id="@+id/fl_footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#565858"
android:padding="20dp">
<Button
android:id="@+id/button1"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="center"
android:background="@drawable/ic_wallpaper_black_24dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="SET"
android:textColor="@color/white"
></TextView>
<Button
android:id="@+id/button2"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="end|center_vertical"
android:background="@drawable/ic_share_black_24dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
android:text="SHARE"/>
<ImageButton
android:id="@+id/downloadimg"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="start|center_vertical"
android:background="@drawable/ic_file_download_black_24dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
android:text="DOWNLOAD"/>
</FrameLayout>
There are several ways to design this layout. On of them is using ConstraintLayout
. You can try this solution.
<androidx.constraintlayout.widget.ConstraintLayout android:id="@+id/fl_footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#565858"
android:paddingTop="20dp"
android:paddingBottom="20dp"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<Button
android:id="@+id/button1"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="center"
app:layout_constraintStart_toStartOf="@id/tvSet"
app:layout_constraintEnd_toEndOf="@id/tvSet"
app:layout_constraintTop_toTopOf="parent"
android:background="@drawable/ic_wallpaper_black_24dp" />
<TextView
android:id="@+id/tvSet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="SET"
android:textColor="@color/white"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="@id/button1"/>
<Button
android:id="@+id/button2"
android:layout_width="35dp"
android:layout_height="35dp"
app:layout_constraintEnd_toEndOf="@id/tvShare"
app:layout_constraintStart_toStartOf="@id/tvShare"
app:layout_constraintTop_toTopOf="parent"
android:background="@drawable/ic_share_black_24dp"/>
<TextView
android:id="@+id/tvShare"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
android:text="SHARE"
android:layout_marginEnd="20dp"
app:layout_constraintTop_toBottomOf="@id/button2"
app:layout_constraintEnd_toEndOf="parent"/>
<ImageButton
android:id="@+id/downloadimg"
android:layout_width="35dp"
android:layout_height="35dp"
app:layout_constraintStart_toStartOf="@id/tvDownload"
app:layout_constraintEnd_toEndOf="@id/tvDownload"
app:layout_constraintTop_toTopOf="parent"
android:background="@drawable/ic_file_download_black_24dp" />
<TextView
android:id="@+id/tvDownload"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
android:text="DOWNLOAD"
android:layout_marginStart="20dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/downloadimg"/>
</androidx.constraintlayout.widget.ConstraintLayout>