Android 使用 XML drawable 的垂直线

Vertical line using XML drawable

提问by Kaspa

I'm trying to figure out how to define a vertical line (1dp thick) to be used as a drawable.

我想弄清楚如何定义一条垂直线（1dp 粗）用作可绘制对象。

To make a horizontal one, it's pretty straightforward:

要制作一个水平的，它非常简单：

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
    <stroke android:width="1dp" android:color="#0000FF"/>
    <size android:height="50dp" />     
</shape>

The question is, how to make this line vertical?

问题是，如何使这条线垂直？

Yes, there are workarounds, such as drawing a rectangle shape 1px thick, but that complicates the drawable XML, if it consists of multiple <item>elements.

是的，有一些解决方法，例如绘制一个 1px 厚的矩形形状，但是如果它由多个<item>元素组成，这会使可绘制的 XML 复杂化。

Anyone had any chance with this?

有人有这个机会吗？

UPDATE

更新

Case is still unsolved. However, For anyone on a Android documentation crusade - you might find this useful: Missing Android XML Manual

案件至今未破。但是，对于 Android 文档征战中的任何人 - 您可能会发现这很有用： Missing Android XML Manual

UPDATE

更新

I found no other way other than the one that I marked as correct. It does the trick though feels a bit "heavy", thus if you happen to know the answer don't forget to share ;)

除了我标记为正确的方法之外，我没有找到其他方法。虽然感觉有点“沉重”，但它确实有效，因此如果您碰巧知道答案，请不要忘记分享;）

回答by CommonsWare

Instead of a shape, you could try a View:

您可以尝试使用View以下形状而不是形状：

<View
    android:layout_width="1dp"
    android:layout_height="fill_parent"
    android:background="#FF0000FF" />

I have only used this for horizontal lines, but I would think it would work for vertical lines as well.

我只将它用于水平线，但我认为它也适用于垂直线。

Use:

用：

<View
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="#FF0000FF" />

for a horizontal line.

为水平线。

回答by cephus

You can nest your shape inside a rotate tag.

您可以将形状嵌套在旋转标签中。

<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="90"
    android:toDegrees="90">
    <shape 
        android:shape="line">
        <stroke
            android:width="1dp"
            android:color="#ff00ff"
            android:dashWidth="1dp"
            android:dashGap="2dp" />
    </shape>
</rotate>

However, the only problem is the layout params defined in your layout xml will be the dimensions used to draw the original shape. Meaning if you want your line to be 30dp tall, you need to define a layout_width of 30dp in your layout xml. But the final width will also be 30dp in that case, which is likely undesirable for most situations. This essentially means both width and height have to be the same value, the value of your desired length for the line. I couldn't figure out how to fix this.

但是，唯一的问题是布局 xml 中定义的布局参数将是用于绘制原始形状的尺寸。这意味着如果您希望您的线条高 30dp，则需要在布局 xml 中定义 30dp 的 layout_width。但在这种情况下，最终宽度也将是 30dp，这在大多数情况下可能是不可取的。这基本上意味着宽度和高度必须是相同的值，即您想要的线长度值。我不知道如何解决这个问题。

This seems to be the "android way" solution, but unless there's some fix or workaround for the dimensions issue I mention then this likely won't work for most people. What we really need is an orientation attribute in <shape/> or <stroke/>.

这似乎是“android方式”解决方案，但除非我提到的尺寸问题有一些修复或解决方法，否则这可能对大多数人不起作用。我们真正需要的是 <shape/> 或 <stroke/> 中的方向属性。

You can also try referencing another drawable in the rotate tag's attributes, such as:

您还可以尝试在旋转标签的属性中引用另一个可绘制对象，例如：

<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="90"
    android:toDegrees="90"
    android:drawable="@drawable/horizontal_line" />

However I haven't tested this and expect it to have the same issues.

但是我还没有对此进行测试，并希望它有同样的问题。

-- EDIT --

- 编辑 -

Oh, I actually figured out a fix. You can use a negative margin in your layout xml to get rid of the undesired extra space. Such as:

哦，我真的想出了一个解决办法。您可以在布局 xml 中使用负边距来消除不需要的额外空间。如：

<ImageView
    android:layout_width="35dp"
    android:layout_height="35dp"
    android:layout_marginLeft="-15dp"
    android:layout_marginRight="-15dp"
    android:src="@drawable/dashed_vertical_line" />

回答by user4679242

You can use the rotate attribute

您可以使用旋转属性

 <item>
    <rotate
        android:fromDegrees="90"
        android:toDegrees="90"
        android:pivotX="50%"
        android:pivotY="50%" >
        <shape
            android:shape="line"
            android:top="1dip" >
            <stroke
                android:width="1dip"
                 />
        </shape>
    </rotate>
</item>

回答by logcat

<?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/white" />
    <size android:width="2dp" />
</shape>

Work's for me . Put it as background of view with fill_parent or fixed sized in dp height

为我工作。将其作为带有 fill_parent 或固定大小的 dp 高度的视图背景

回答by Eric Kok

I came up with a different solution. The idea is to fill the drawable first with the color that you like the line to be and then fill the whole area again with the background color while using left or right padding. Obviously this only works for a vertical line in the far left or right of your drawable.

我想出了一个不同的解决方案。这个想法是首先用你喜欢的线条的颜色填充可绘制对象，然后在使用左或右填充时再次用背景颜色填充整个区域。显然，这仅适用于 drawable 最左侧或最右侧的垂直线。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@color/divider_color" />
    <item android:left="6dp" android:drawable="@color/background_color" />
</layer-list>

回答by a.ch.

I think this is the simplest solution:

我认为这是最简单的解决方案：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:gravity="center">
        <shape android:shape="rectangle">
            <size android:width="1dp" />
            <solid android:color="#0000FF" />
        </shape>
    </item>

</layer-list>

回答by willlma

I needed to add my views dynamically/programmatically, so adding an extra view would have been cumbersome. My view height was WRAP_CONTENT, so I couldn't use the rectangle solution. I found a blog-post hereabout extending TextView, overriding onDraw() and painting in the line, so I implemented that and it works well. See my code below:

我需要以动态/编程方式添加我的视图，因此添加额外的视图会很麻烦。我的视图高度是 WRAP_CONTENT，所以我不能使用矩形解决方案。我在这里找到了一篇关于扩展 TextView、覆盖 onDraw() 和绘画的博客文章，所以我实现了它并且它运行良好。请参阅下面的代码：

public class NoteTextView extends TextView {
    public NoteTextView(Context context) {
       super(context);
    }
    private Paint paint = new Paint();
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        paint.setColor(Color.parseColor("#F00000FF"));
        paint.setStrokeWidth(0);
        paint.setStyle(Paint.Style.FILL);
        canvas.drawLine(0, 0, 0, getHeight(), paint);
    }
}

I needed a vertical line on the left, but the drawline parameters are drawLine(startX, startY, stopX, stopY, paint)so you can draw any straight line in any direction across the view. Then in my activity I have NoteTextView note = new NoteTextView(this);Hope this helps.

我需要在左侧有一条垂直线，但drawLine(startX, startY, stopX, stopY, paint)绘制线参数是这样您可以在视图的任何方向上绘制任何直线。然后在我的活动中，我NoteTextView note = new NoteTextView(this);希望这会有所 帮助。

回答by user3130068

its very simple... to add a vertical line in android xml...

它非常简单......在android xml中添加一条垂直线......

<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:layout_marginTop="5dp"
android:rotation="90"
android:background="@android:color/darker_gray"/>

回答by Lukas1

Depends, where you want to have the vertical line, but if you want a vertical border for example, you can have the parent view have a background a custom drawable. And you can then define the drawable like this:

取决于你想要垂直线的位置，但如果你想要一个垂直边框，你可以让父视图有一个自定义可绘制的背景。然后您可以像这样定义可绘制对象：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape
            android:shape="rectangle">
            <stroke android:width="1dp" android:color="#000000" />
            <solid android:color="#00ffffff" />

        </shape>
    </item>

    <item android:right="1dp">
        <shape android:shape="rectangle">
            <solid android:color="#00ffffff" />
        </shape>
    </item>

</layer-list>

This example will create a 1dp thin black line on the right side of the view, that will have this drawable as an background.

这个例子将在视图的右侧创建一条 1dp 的细黑线，将这个 drawable 作为背景。

回答by AnupamChugh

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:bottom="-3dp"
        android:left="-3dp"
        android:top="-3dp">

        <shape android:shape="rectangle">
            <solid android:color="@color/colorPrimary" />
            <stroke
                android:width="2dp"
                android:color="#1fc78c" />
        </shape>

    </item>

</layer-list>