Question

I would like to know the best way of using Linear Layout or Table Layout for designing attached android screen.

I am using Linear layout as main layout and then adding the sub Linear layouts and Table Layouts in it. Is this the best way of doing???

Answer 1

Use RelativeLayout or GridLayout (ICS and above only).

This should get you started. It’s not perfectly what you want but it hopefully is close. I didn’t test the code so I don’t even know if it compiles. Shouldn’t be too far from the final code though. 🙂

<RelativeLayout>
  <!-- Image, may want to size this as a square using dp pixels say, 64dpx64dp -->
  <ImageView android:id="@+id/PhotoImageView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" />

  <!-- TextViews at the right of the image. Stacked, caution this might end up being taller than the ImageView itself. -->
  <TextView android:id="@+id/PersonNameTextView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_toRightOf="@id/PhotoImageView" />
  <TextView android:id="@+id/TitleTextView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_toRightOf="@id/PhotoImageView" android:layout_below="@id/PersonNameTextView" />

  <!-- Stacked TextViews below, you can split this out to side by side TextViews but that's more work. -->
  <TextView android:id="@+id/PhoneTextView" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/PhotoImageView" />
  <TextView android:id="@+id/EmailTextView" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/PhoneTextView" />

  <!-- Delete button placed at the bottom. -->
  <Button android:id="@+id/DeleteButton" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" />
</RelativeLayout>