103

是否可以仅在某些侧面创建带有笔划的 Android 形状对象?

例如我有:

<stroke 
 android:width="3dip" 
 android:color="#000000"
    android:dashWidth="10dip" 
    android:dashGap="6dip" />

这类似于这个CSS:

border: 3px dashed black;

如何仅在一侧设置笔划?这就是我在 CSS 中的做法:

border-left: 3px dashed black;

你如何在 Android XML 中做到这一点?

4

8 回答 8

134

我用这个实现了一个很好的解决方案:

<?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- This is the line -->
    <item android:top="-1dp" android:right="-1dp" android:left="-1dp">
      <shape>
            <solid android:color="@android:color/transparent" />
            <stroke android:width="1dp" android:color="#ffffff" />
      </shape>
    </item>

</layer-list>

如果您需要透明背景但仍然需要开放笔触颜色(在我的情况下,我只需要底线),这很有效。如果您需要背景颜色,您可以像 Maragues 回答中一样添加纯色。

编辑 1

有时,对于高密度设备,使用低倾角值可能会以非常薄或不可见的笔划或距离结束。在设置 ListView 分隔符时,您也可能会遇到这种情况。

最简单的解决方法是使用 1px 的距离而不是 1dp。这将使线在所有密度下始终可见。最好的解决方案是为每个密度创建维度资源,以获得每个设备的最佳尺寸。

编辑 2

有趣,但我在 6 年后尝试使用它,但在 Lollipop 设备上无法获得良好的效果。

目前的解决方案可能是使用 9-patch。经过这么长时间,Android 应该已经为这个问题提供了一个简单的解决方案。

于 2011-12-14T09:01:57.053 回答
62

我知道这个问题是很久以前发布的,所以发布这个问题的人不会使用答案,但它仍然可能对其他人有所帮助。

 <?xml version="1.0" encoding="UTF-8"?>
    <!-- inset is used to remove border from top, it can remove border from any other side-->
    <inset xmlns:android="http://schemas.android.com/apk/res/android"
        android:insetTop="-2dp"
        >
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/rectangle">
        <stroke android:width="1dp" android:color="#b7b7b7" />
        <corners android:bottomRightRadius="5dp"  android:bottomLeftRadius="5dp"/>

        <solid android:color="#454444"/>
    </shape>
    </inset>

使用inset标签并为要删除的侧边框指定一个负值。

可能的值是:

android:insetTop="-1dp" android:insetBottom="-1dp" android:insetLeft="-1dp" android:insetRight="-1dp"

于 2015-08-21T17:05:04.313 回答
42

我通过使用列表层解决了这个问题,结合了两个形状,其中一个高度为 1dp 放置在底部

optionscreen_bottomrectangle.xml:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- This is the line -->
<item>
      <shape>
            <solid android:color="#535353" />
      </shape>
</item>
<!-- This is the main color -->
<item android:bottom="1dp">
     <shape>
           <solid android:color="#252525" />
     </shape>
</item>
</layer-list>

然后,在 layout/main.xml 文件中

<TextView
    android:id="@+id/bottom_rectangle"
    android:background="@drawable/optionscreen_bottomrectangle"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_below="@id/table_options"
    android:layout_above="@id/exit_bar"/>

它用背景填充了 table_options 和 exit_bar 之间的空白,并且就在 exit_bar 打印 1dp 行之前。这对我有用,我希望它可以帮助别人。

答案已编辑以按正确顺序放置图层。谢谢亚历克斯!

于 2010-03-30T16:04:39.440 回答
33

另一个使用填充代替其他响应。这个小片段在顶部和底部做了一个边框。

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- This is the line -->
    <item>
          <shape>
                <padding android:left="0dp" android:top="1dp" android:right="0dp" android:bottom="1dp"/>
                <solid android:color="#898989" />
          </shape>
    </item>
    <!-- This is the main color -->
    <item>
         <shape>
             <solid android:color="#ffffff" />
         </shape>
    </item>
</layer-list>
于 2013-04-11T00:14:12.527 回答
26

@Maragues 的答案是倒退的,因为图层列表可绘制对象从上到下绘制(意味着列表中的最后一项绘制在顶部):

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- This is the line -->
<item>
      <shape>
            <solid android:color="#535353" />
      </shape>
</item>
<!-- This is the main color -->
<item android:bottom="1dp">
     <shape>
           <solid android:color="#252525" />
     </shape>
</item>

</layer-list>

这将有效地用线条颜色填充形状,然后在其顶部绘制背景颜色,使最后 1dp 保持清晰,以便线条颜色显示出来。

于 2011-09-12T21:40:16.120 回答
2
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >


<item>
    <shape android:shape="rectangle" >
        <stroke  android:width="2dp"
                 android:color="#BBBBBB" />
        <solid android:color="@android:color/transparent" />
    </shape>
</item>
<item  android:bottom="2dp" >
    <shape android:shape="rectangle" >
        <stroke  android:width="2dp"
                 android:color="@color/main_background_color" />
        <solid android:color="@android:color/transparent" />
    </shape>
</item>

于 2013-11-07T11:15:11.937 回答
2

我使用了以下代码。

<?xml version="1.0" encoding="UTF-8"?>
<!-- inset is used to remove border from top, it can remove border from any other side-->
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetTop="-2dp" android:insetLeft="-2dp" android:insetRight="-2dp"
    >
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/rectangle">
        <stroke android:width="1dp" android:color="@color/colorPrimary" />
        <solid android:color="#0000"/>
        <padding android:left="2dp" android:top="2dp" android:bottom="2dp" android:right="2dp"/>
    </shape>
</inset>
于 2016-03-25T06:45:59.240 回答
0

简单高效

为了有一个透明的视图并且外部的所有东西都有某种颜色的覆盖,你可以做的是构建封装中心视图的视图,而不需要外部视图踩到中心视图

通过这种方式,您可以避免在布局外部使用可绘制对象,并且可以更好地控制视图的距离,而无需在运行时执行计算。

<androidx.constraintlayout.widget.ConstraintLayout .. >

    <View
        android:id="@+id/center"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        android:background="@color/transparent"/>

   <View
        android:id="@+id/left_overlay"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@id/center"
        app:layout_constraintTop_toBottomOf="@id/top_overlay"
        app:layout_constraintBottom_toTopOf="@id/bottom_overlay"
        android:background="@color/black"
        android:alpha="0.5"
        />

    <View
        android:id="@+id/right_overlay"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintLeft_toRightOf="@id/center"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/top_overlay"
        app:layout_constraintBottom_toTopOf="@id/bottom_overlay"
        android:background="@color/black"
        android:alpha="0.5"
        />

    <View
        android:id="@+id/top_overlay"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/center"
        android:background="@color/black"
        android:alpha="0.5"
        />

    <View
        android:id="@+id/bottom_overlay"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@id/center"
        android:background="@color/black"
        android:alpha="0.5"
        />

</androidx.constraintlayout.widget.ConstraintLayout>

总帐

于 2020-09-08T21:56:00.513 回答