Saturday 7 May 2016

ImageView with Multiple TextViews - Custom Row

This is a custom row for a Listview. In this row, there is an ImageView to hold an image, and three TextViews for different texts. I created this layout for my Gym list, which contains the Picture / Thumbnail, Name, City, and Distance of the Gym.


<?xml version="1.0" encoding="UTF-8"?>
-<RelativeLayout
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:padding="5dp"
                android:gravity="center"
                android:layout_height="wrap_content"
                android:layout_width="fill_parent" >

<!-- ImageView -->
-<LinearLayout
                android:padding="5dp"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_alignParentLeft="true"
                android:id="@+id/gym_image">

<ImageView
                android:layout_height="80dp"
                android:layout_width="110dp"
                android:id="@+id/list_image"
                android:background="@drawable/gym_thumbnail"/>

</LinearLayout>

<!-- Gym Name-->
<TextView
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:id="@+id/gym_name"
                android:textStyle="bold"
                android:textSize="20sp"
                android:typeface="sans"
                android:textColor="#040404"
                android:text="@string/gym_name"
                android:layout_toRightOf="@+id/gym_image"
                android:layout_marginTop="20dp"/>

<!-- Gym City -->
<TextView
                android:layout_height="wrap_content"
                android:layout_width="fill_parent"
                android:id="@+id/gym_location"
                android:textSize="15sp"
                android:textColor="#888888"
                android:text="@string/gym_city"
                android:layout_toRightOf="@+id/gym_image"
                android:layout_marginTop="1dip"
                android:layout_below="@id/gym_name"/>

<!-- Gym Distance -->
<TextView
                android:gravity="right"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_marginRight="5dp"
                android:id="@+id/gym_distance"
                android:textStyle="bold"
                android:textSize="15sp"
                android:textColor="#888888"
                android:text="@string/gym_distance"
                android:layout_alignTop="@id/gym_name"
                android:layout_alignParentRight="true"/>

</RelativeLayout

While development, it isn't easy to create layouts from scratch and customize it as per needs. Therefore, it is more time saving to pick a readymade layout and require few changes only.

Please don't hesitate to contact me.

Thank you

No comments:

Post a Comment