как дизайн следующим образом на изображении на Android - PullRequest
0 голосов
/ 13 марта 2012

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

enter image description here

1 Ответ

1 голос
/ 13 марта 2012

Следующий код дает такой результат:
screenshot
Можно использовать некоторые настройки, но основы есть.

  • Разделителями являются View объекты с шириной (или высота, в зависимости от ориентации) 1px.
  • Маленькая зеленая стрелка (здесь представлена ​​квадратом) - это Compound Drawable, принадлежащий TextView, отображающему число.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView 
        android:id="@+id/number"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableLeft="@drawable/smallsquare"
        android:drawablePadding="8dp"
        android:text="1-234-567-890"
        android:textColor="#FFFF"
        android:textSize="20sp"
        android:textStyle="bold"/>
    <TextView 
        android:id="@+id/time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:layout_toLeftOf="@+id/separator_vert"
        android:text="13 mins ago"
        android:layout_below="@+id/number"/>
    <View 
        android:id="@+id/separator_vert"
        android:layout_width="1px"
        android:layout_height="0dp"
        android:layout_margin="2dp"
        android:layout_alignParentTop="true"
        android:layout_toLeftOf="@+id/phoneicon"
        android:layout_above="@+id/separator_horz"
        android:background="#FFAAAAAA"/>
    <View 
        android:id="@+id/separator_horz"
        android:layout_width="0dp"
        android:layout_height="1px"       android:layout_margin="2dp"
        android:layout_below="@+id/time"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:background="#FFAAAAAA"/>
    <ImageView 
        android:id="@+id/phoneicon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_margin="5dp"
        android:src="@drawable/mediumsquare"/> </RelativeLayout>
...