Относительная компоновка в ListView android

Question

Я пытаюсь извлечь данные из RSS в приложении для Android. Мне нужны данные в определенном формате. Я могу сделать все, но хочу, чтобы мой ListView выглядел так, как я хочу. В настоящее время она выглядит

Мы можем видеть, что символ глаза и номер не совпадают. И что глазной знак ниже левого миниатюры. Я хочу, чтобы это выглядело как

Обратитесь к 1-й элемент списка, левый овал. Изображение и номер глазного вида выровнены друг с другом и в нижней части левого миниатюры. И на месте 2-го пустого овала я хочу другой TextView, где я бы показывал источник новостей как текст.

Мой текущий код 1 ITeam в ListView выглядит следующим образом: -

<!-- postitem.xml --> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="wrap_content" 
android:paddingBottom="5dp" 
android:paddingLeft="16dp" 
android:paddingRight="16dp" 
android:paddingTop="5dp" 
android:background="@drawable/bg" > 

<ImageView 
    android:id="@+id/postThumb" 
    android:layout_width="90dp" 
    android:layout_height="80dp" 
    android:layout_marginRight="5dp" 
    android:scaleType="centerCrop" 
    android:src="@drawable/logo" /> 

<TextView 
    android:id="@+id/postTitleLabel" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_alignParentRight="true" 
    android:layout_alignTop="@id/postThumb" 
    android:layout_toRightOf="@id/postThumb" 
    android:ellipsize="end" 
    android:maxLines="2" 
    android:text="Place for title" 
    android:textIsSelectable="false" 
    android:textSize="16sp" /> 

<TextView 
    android:id="@+id/postDateLabel" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_alignBottom="@id/postThumb" 
    android:layout_alignParentRight="true" 
    android:layout_toRightOf="@id/postThumb" 
    android:maxLines="1" 
    android:text="April 12, 2013" 
    android:textSize="12sp" /> 

<TextView 
    android:id="@+id/postViews" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_marginLeft="20sp" 
    android:layout_alignLeft="@+id/postDateLabel" 
    android:layout_alignParentRight="true" 
    android:layout_toRightOf="@+id/eye" 
    android:layout_below="@id/postDateLabel" 
    android:maxLines="1" 
    android:text="1212" 
    android:textSize="12sp" /> 

<ImageView 
    android:id="@+id/eye" 
    android:layout_width="13dp" 
    android:layout_height="7dp" 
    android:layout_alignLeft="@+id/postDateLabel" 
    android:layout_below="@id/postDateLabel" 
    android:scaleType="centerCrop" 
    android:src="@drawable/eye" /> 

</RelativeLayout> 

Любая помощь будет принята с благодарностью. Я был бы признателен, если бы кто-то мог поделиться хорошим ресурсом, где я мог бы легко изучить этот пользовательский интерфейс.

Благодаря

Answer 1

Проблема заключается basicaly эта линия:

android:layout_alignBottom="@id/postThumb" 

в вашем postDateLabel.

Вы сказали, хорошо, выровняйте эту метку с нижним дном эскиза, и когда вы скажете, что хотите получить глазу и текст ниже postDateLabel, это то, где он заканчивается. Ты собираешься купить мне пиво для этого:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="wrap_content" 
android:paddingBottom="5dp" 
android:paddingLeft="16dp" 
android:paddingRight="16dp" 
android:paddingTop="5dp" > 

<ImageView 
    android:id="@+id/postThumb" 
    android:layout_width="90dp" 
    android:layout_height="80dp" 
    android:layout_marginRight="5dp" 
    android:scaleType="centerCrop" 
    android:src="@drawable/abc_ic_go" /> 

<TextView 
    android:id="@+id/postTitleLabel" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_alignParentRight="true" 
    android:layout_alignTop="@id/postThumb" 
    android:layout_toRightOf="@id/postThumb" 
    android:ellipsize="end" 
    android:maxLines="2" 
    android:text="Place for title" 
    android:textIsSelectable="false" 
    android:textSize="16sp" /> 

<TextView 
    android:id="@+id/postDateLabel" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_above="@+id/postViews" 
    android:layout_alignParentRight="true" 
    android:layout_toRightOf="@id/postThumb" 
    android:maxLines="1" 
    android:text="April 12, 2013" 
    android:textSize="12sp" /> 

<TextView 
    android:id="@+id/postViews" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_alignBottom="@id/postThumb" 
    android:layout_alignLeft="@+id/postDateLabel" 
    android:layout_alignParentRight="true" 
    android:layout_marginLeft="20sp" 
    android:layout_toRightOf="@+id/eye" 
    android:maxLines="1" 
    android:text="1212" 
    android:textSize="12sp" /> 

<ImageView 
    android:id="@+id/eye" 
    android:layout_width="13dp" 
    android:layout_height="7dp" 
    android:layout_alignBottom="@id/postThumb" 
    android:layout_alignLeft="@+id/postDateLabel" 
    android:scaleType="centerCrop" 
    android:src="@drawable/abc_spinner_ab_pressed_holo_dark" /> 

P.S. У вас много ненужных атрибутов, установленных в xml. Я просто сделал это за несколько секунд, чтобы помочь вам. Вы должны прочитать, как работают RelativeLayout и LinearLayout.

Answer 2

Лучший способ выравнивания заключается в использовании линейной компоновки и положить ImageView и TextView в этом макете

Например: -

 <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 

     android:orientation="Horizontal" > 

     <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     /> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       />