Question

想要在这张照片中创建一个用户界面，我尝试使用相对布局的背景视图，这对于固定高度不起作用，在下面给出的UI中构建左红色垂直线的最佳方法是什么？

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#f5f5f5"
android:orientation="vertical"
tools:ignore="MissingPrefix">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#a9382b">

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

        <ImageView
            android:layout_marginLeft="14dp"
            android:layout_marginTop="14dp"
            android:layout_marginBottom="14dp"
            android:layout_marginRight="9dp"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:src="@drawable/globe"/>

        <TextView
            android:layout_marginTop="9dp"
            android:layout_weight="7"
            android:layout_marginBottom="9dp"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:textSize="13sp"
            android:textColor="#b3ffffff"
            fontPath="fonts/montserrat-medium.ttf"
            android:letterSpacing="-0.03"
            android:lineSpacingExtra="2sp"
            tools:text="Farmer Suicides, Agitations The Indian Agrarian 
    Crisis"
            />

        <LinearLayout
            android:layout_weight="3"
            android:layout_width="0dp"
            android:layout_marginRight="16dp"
            android:layout_height="wrap_content">
        <Button
            android:layout_width="87dp"
            android:layout_height="32dp"
            android:background="@drawable/button"
            android:text="FOLLOW"
            android:textColor="#FFFFFF"
            fontPath="fonts/montserrat-medium.ttf"
            android:layout_marginTop="8dp"
            android:layout_marginBottom="8dp"
            android:layout_marginLeft="12dp"
            android:textSize="12sp"
            android:lineSpacingExtra="0sp"
            android:gravity="center_horizontal||center_vertical"
            />
        </LinearLayout>



    </LinearLayout>



</RelativeLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="0dp"
    android:layout_marginTop="17dp"
    android:layout_marginLeft="15dp">

    <LinearLayout
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_marginRight="15dp">

    <ImageView
        android:layout_gravity="center"
        android:layout_width="10dp"
        android:layout_height="10dp"
      android:background="@drawable/ic_radio_button_unchecked_black_24dp"
        />


    </LinearLayout>



<TextView
    android:layout_gravity="center"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="13sp"
    android:textColor="#757575"
    android:letterSpacing="-0.03"
    android:lineSpacingExtra="0sp"
    tools:text="8 hours ago"
    />

</LinearLayout>

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

    <view
        android:layout_width="2dp"
        android:layout_height="match_parent"
        android:layout_marginLeft="19dp"
        android:background="#a9382b"
        android:layout_marginRight="19dp"/>

    <ImageView
        android:layout_marginTop="10dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:src="@drawable/background_splash" />

</LinearLayout>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <view
        android:layout_width="2dp"
        android:layout_alignParentTop="true"
        android:layout_height="wrap_content"
        android:layout_marginLeft="19dp"
        android:background="#a9382b" />

    <TextView
        android:id="@+id/seeall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:layout_marginRight="20dp"
        android:textColor="#a9382b"
        android:textSize="11sp"
        tools:text="SEE ALL" />

    <TextView
        android:id="@+id/articles"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:layout_marginRight="10dp"
        android:layout_toLeftOf="@id/seeall"
        android:textColor="#757575"
        android:textSize="11sp"
        tools:text="7 Articles"

        />


</RelativeLayout>

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

    <View
        android:layout_width="match_parent"
        android:layout_height="0.5dp"
        android:layout_marginLeft="40dp"
        android:layout_marginRight="20dp"
        android:background="#a9382b"/>

</LinearLayout>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="15dp">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_alignParentLeft="true"
        android:layout_centerInParent="true"
        android:layout_marginRight="15dp">


        <ImageView
            android:layout_gravity="center"
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:background="@drawable/ic_add_circle_outline_black_24dp"
            />

    </LinearLayout>

    <TextView
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:id="@+id/view_more"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="11sp"
        android:textColor="#a9382b"
        android:layout_marginRight="20dp"
        android:layout_alignParentRight="true"
        android:gravity="end"
        tools:text="VIEW FULL STORY"
        android:layout_marginTop="15dp"

        />




</RelativeLayout>



</LinearLayout>

Answer 1

您可以尝试两个答案

1）您可以创建视图

 <View
                android:layout_width="1dp"
                android:layout_height="50dp" 
                android:background="#cdcdcd" />

2）您可以创建线性布局并为线性布局设置左边距颜色，为此，请遵循以下方法。

在drawable文件夹margin_color.xml

下创建此xml文件

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">


<item>
    <shape android:shape="rectangle" >
        <solid android:color="#FFF" />
    </shape>
</item>

<item android:bottom="-4dp" android:right="-4dp" android:left="1dp"
    android:top="-4dp">
    <shape>
        <solid android:color="@android:color/transparent" />
        <stroke
            android:dashGap="0px"
            android:dashWidth="0px"
            android:width="2dp"
            android:color="#EF5350" />
    </shape>
</item>

然后将此边距应用于线性布局作为背景

<LinearLayout
            android:layout_width="5dp"
            android:layout_height="100dp"
            android:id="@+id/tactic_linear_layout"
            android:background="@drawable/margin_color"
            android:orientation="horizontal"
            android:layout_marginLeft="20dp"
            android:layout_marginTop="0dp"
            android:paddingBottom="0dp">

这个方法适合我试试....

Answer 2

由于您没有提供任何代码，您可以画一条直线：

                 <View
                    android:layout_width="1dp"
                    android:layout_height="50dp" 
                    android:background="#cdcdcd" />

Answer 3

使用xml文件中的下面代码绘制固定高度线

<View
    android:id="@+id/view_vertical_line"
    android:layout_width="1sp"
    android:layout_height="500sp"
    android:layout_marginLeft="15sp"
    android:background="@color/black" />

Answer 4

您可以使用下面的代码绘制具有固定高度的垂直线

   <View
        android:layout_width="specify thickness in dp"
        android:layout_height="specify fixed height in dp"
        android:background="specify color of line"/>

Answer 5

您也可以像这样使用drawable画线。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <stroke android:width="1dp" 
     android:color="@color/red"/>
    <size android:width="2dp" 
     android:height="290dp" />
</shape>

如何在Android XML中创建具有固定高度的垂直线？

5 个答案: