2015-01-20 3 views
4

Я использую две горизонтальные линии обзора (id is view2 и view 3) между верхней и нижней частью относительной компоновки. Как разместить вертикальную линию просмотра между двумя текстами. Вот код и скриншот ожидаемого результата.Как нарисовать вертикальную линию разделения между двумя текстовыми строками андроида?

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="match_parent" > 

<RelativeLayout 
    android:id="@+id/delivery_address" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/address_layout" 
    android:layout_margin="10dp" 
    android:orientation="horizontal" > 

    <TextView 
     android:id="@+id/delivery_phone" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/delivery_country" 
     android:layout_marginLeft="7dp" 
     bold="" 
     android:paddingLeft="6dp" 
     android:paddingTop="5dp" 
     android:text="Phone: 12345678 
     android:textStyle=" /> 
</RelativeLayout> 

<View 
    android:id="@+id/view2" 
    android:layout_width="wrap_content" 
    android:layout_height="1dp" 
    android:layout_below="@+id/delivery_address" 
    android:layout_centerVertical="true" 
    android:background="#cfcfcf" /> 

<RelativeLayout 
    android:id="@+id/delivery_edit_delete_layout" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/view2" 
    android:layout_margin="8dp" 
    android:orientation="horizontal" > 

    <TextView 
     android:id="@+id/delivery_edit" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentLeft="true" 
     android:layout_marginLeft="7dp" 
     android:drawableLeft="@drawable/delivery_edit" 
     android:drawablePadding="5dp" 
     android:paddingLeft="20dp" 
     android:text="Edit" 
     android:textColor="#555555" /> 

    <TextView 
     android:id="@+id/delivery_delete" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentRight="true" 
     android:layout_marginRight="7dp" 
     android:layout_toLeftOf="@+id/delivery_edit" 
     android:drawableLeft="@drawable/delivery_delete" 
     android:drawablePadding="5dp" 
     android:paddingRight="20dp" 
     android:text="Delete" 
     android:textColor="#555555" /> 
</RelativeLayout> 

<View 
    android:id="@+id/view3" 
    android:layout_width="wrap_content" 
    android:layout_height="1dp" 
    android:layout_below="@+id/delivery_edit_delete_layout" 
    android:layout_centerVertical="true" 
    android:background="#cfcfcf" /> 

Ожидаемый результат:

enter image description here

My output is: 

enter image description here

+0

проверить мой ответ ... –

ответ

5

Что бы я сделал:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="match_parent" > 

    <RelativeLayout 
    android:id="@+id/delivery_address" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/address_layout" 
    android:layout_margin="10dp" 
    android:orientation="horizontal" > 

     <TextView 
     android:id="@+id/delivery_phone" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/delivery_country" 
     android:layout_marginLeft="7dp" 
     android:paddingLeft="6dp" 
     android:paddingTop="5dp" 
     android:text="Phone: 12345678 
     android:textStyle="bold" /> 
    </RelativeLayout> 

    <View 
    android:id="@+id/view2" 
    android:layout_width="wrap_content" 
    android:layout_height="1dp" 
    android:layout_below="@+id/delivery_address" 
    android:layout_centerVertical="true" 
    android:background="#cfcfcf" /> 

    <RelativeLayout 
    android:id="@+id/delivery_edit_delete_layout" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/view2" 
    android:orientation="horizontal" > 

     <LinearLayout 
     android:id="container_for_text" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" 
     > 

      <TextView 
      android:id="@+id/delivery_edit" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:layout_gravity="center" (Or try android:gravity) 
      android:layout_marginLeft="7dp" 
      android:drawableLeft="@drawable/delivery_edit" 
      android:drawablePadding="5dp" 
      android:paddingLeft="20dp" 
      android:text="Edit" 
      android:textColor="#555555" /> 

      <View 
      android:id="@+id/innerLine" 
      android:layout_width="1dp" 
      android:layout_height="match_parent" 
      android:background="#cfcfcf" /> 

      <TextView 
      android:id="@+id/delivery_delete" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:layout_gravity="center" (Or try android:gravity) 
      android:layout_marginRight="7dp" 
      android:layout_toLeftOf="@+id/delivery_edit" 
      android:drawableLeft="@drawable/delivery_delete" 
      android:drawablePadding="5dp" 
      android:paddingRight="20dp" 
      android:text="Delete" 
      android:textColor="#555555" /> 

     </LinearLayout> 
    </RelativeLayout> 

    <View 
    android:id="@+id/view3" 
    android:layout_width="wrap_content" 
    android:layout_height="1dp" 
    android:layout_below="@+id/delivery_edit_delete_layout" 
    android:layout_centerVertical="true" 
    android:background="#cfcfcf" /> 
</RelativeLayout> 

Try используя LinearLayout потому, что поставит его прямо в середине двух. Надеюсь, этот кусок кода поможет! Я еще не пробовал это сам, поэтому вы должны проверить его для меня!

Редактировать: Обновлено, чтобы сделать их центрами (Если и layout_gravity/gravity не удается, попробуйте использовать android: gravity в LinearLayout).

+0

привет спасибо за ваш ответ. Я применил ваш код, и вывод выглядит так: http: //www.tiikoni.com/tis/view/? id = e75394c линия просмотра не трогает сверху и снизу. он находится в середине – Star

+0

Удалите границу из RelativeLayout и примените ее к текстовым изображениям отдельно. Должно сделать это, заполнить поля и создать некоторое расстояние между границей и textView. Посмотрите на обновленную кодировку. Собираем некоторые изменения, чтобы создать центр удаления и редактирования. –

+0

большое вам спасибо :) – Star

0

Вы можете d необработайте границу вокруг текстового поля. Вы можете сделать это, создав стиль границы в папке вводимого коэффициента, а затем установить фон TextView, чтобы указать на этот sttyle:

//your textview 
<TextView android:text="Hi there" android:background="@drawable/my_border/> 

тогда ваша граница, как вытяжка/my_border:

//you can set the border colors, width, and which sides should have borders. 
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > 
    <solid android:color="#ffffff" /> 
    <stroke android:width="1dip" android:color="#e2e2e2"/> 
</shape> 

, если вы только хотите бордюр на одной/конкретных сторон вы можете сделать это:

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
<item> 
    //this is your textview main background 
    <shape android:shape="rectangle"> 
     <solid android:color="#ffffff" /> 
    </shape> 
</item> 
//this will then draw only left border with specified colour and width 
<item android:left="1dp"> 
    <shape android:shape="rectangle"> 
     <solid android:color="#e1e1e1" /> 
    </shape> 
</item> 

+0

привет спасибо за ваш ответ. для какого текста мне нужно подать заявку? как для текстового просмотра? – Star

+0

no probs, если вы примените его в левом текстовом представлении, вы можете использовать нижнее мое решение и просто изменить андроид: left = "1dp", чтобы прочитать android: right = "1dp", чтобы вы установили правильную границу. это должно быть достаточно, и не обязательно включать его в оба текста. его хорошо знать об этом, так как вы найдете много ситуаций, когда вам нужны границы вокруг просмотров или даже создавать свои собственные кнопки! – Chris

0

Ваш код не имеет даже вида в середине RelativeLayout, поэтому поставить следующий вид внутри относительного расположения delivery_edit_delete_layout после представления delivery_edit:

<View 
android:id="@+id/view_separator" 
android:layout_width="1dp" 
android:layout_height="30dp" 
android:layout_centerInParent="true" 
android:layout_centerVertical="true" 
android:background="#cfcfcf" /> 

, но помните, что вы должны обеспечить фиксированную высоту для что здесь я указал 30dp или, по крайней мере, обеспечил фиксированную высоту до RelativeLayout и дал этому разделителю вид match_parent высоты.

0

Глядя на то, чего вы хотите достичь, лучше всего использовать весы вместе с линейной компоновкой.
Это гарантирует, что вертикальная разделительная линия будет размещена точно в середине горизонтальной компоновки.
Here - очень хорошее сообщение, объясняющее использование весов с линейными макетами.

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

 <LinearLayout 
     android:id="@+id/delivery_edit_delete_layout" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/view2" 
     android:layout_margin="8dp" 
     android:orientation="horizontal" > 

     <TextView 
      android:id="@+id/delivery_edit" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:drawableLeft="@drawable/delivery_edit" 
      android:gravity="center" 
      android:layout_weight="1" 
      android:text="Edit" 
      android:textColor="#555555" /> 

     <View 
      android:id="@+id/verticalLine" 
      android:layout_width="1dp" 
      android:layout_height="match_parent" 
      android:background="#cfcfcf" > 
     </View> 

     <TextView 
      android:id="@+id/delivery_delete" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_height="wrap_content" 
      android:drawableLeft="@drawable/delivery_delete" 
      android:gravity="center" 
      android:text="Delete" 
      android:textColor="#555555" /> 
    </LinearLayout> 
+0

привет благодарю за ваш ответ. все тот же выпуск. это выглядит так. http://www.tiikoni.com/tis/view/?id=e75394ci нужно просмотреть, чтобы коснуться выше и ниже строки. линия просмотра находится в середине между двумя текстовыми полями. – Star

0

попробовать этот

enter image description here

<LinearLayout 
     android:id="@+id/delivery_edit_delete_layout" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/view2" 
     android:orientation="horizontal" > 

     <TextView 
      android:id="@+id/delivery_edit" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginLeft="7dp" 
      android:layout_weight="1" 
      android:background="@drawable/divider" 
      android:drawableLeft="@drawable/delivery_edit" 
      android:drawablePadding="5dp" 
      android:gravity="center" 
      android:paddingLeft="20dp" 
      android:text="Edit" 
      android:textColor="#555555" /> 

     <TextView 
      android:id="@+id/delivery_delete" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginRight="7dp" 
      android:layout_weight="1" 
      android:drawableLeft="@drawable/delivery_delete" 
      android:drawablePadding="5dp" 
      android:gravity="center" 
      android:paddingRight="20dp" 
      android:text="Delete" 
      android:textColor="#555555" /> 
    </LinearLayout> 

divider.xml в ур

вводимого коэффициента
<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 

<item 
    android:bottom="-2dp" 
    android:left="-2dp" 
    android:right="1dp" 
    android:top="-2dp"> 
    <shape android:shape="rectangle" > 
     <stroke 
      android:width="1dp" 
      android:color="#cfcfcf" /> 

     <solid android:color="@android:color/transparent" /> 

     <padding 
      android:bottom="10dp" 
      android:left="10dp" 
      android:right="10dp" 
      android:top="10dp" /> 
    </shape> 
</item> 
</layer-list> 

надеюсь, что он работает для и ...

Смежные вопросы