Question

如何修改小矩形，使它们呈灰色，并在它们周围有红色边框，就像在此图像中一样？这是我的代码。我试过这样做，但我的矩形只显示为红色。我也需要他们同等间隔。此外，是否可以使用权重来定义宽度和高度而不是像素？

enter image description here

代码

    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="#808080" >

        <View
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:layout_alignParentLeft="true"
            android:background="@android:color/red" />

        <View
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:layout_centerHorizontal="true"
            android:background="@android:color/red"/>

        <View
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:layout_alignParentRight="true"
            android:background="@android:color/red" />

        <View
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"
            android:background="@android:color/red" />

        <View
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:background="@android:color/red" />

        <View
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:background="@android:color/red" />
    </RelativeLayout>

Answer 1

这是如何做到这一点的一个粗略的例子。这是你要使用的drawable。我把它命名为emptyrect。将其保存在drawables文件夹中。

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

<solid android:color="#808080" /> 

<stroke
    android:width="1dp"
    android:color="#FF0000" />

</shape>

接下来是你的布局。

宽度使用100重力。每个空直线使用100个重力中的20个。有2种线性布局。 1对齐顶部，另一个对齐底部。

GL

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

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="50dp"
    android:orientation="horizonal"
    android:weightSum="100" >

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:background="@drawable/emptyrect" />

    <View
        android:layout_width="1dp"
        android:layout_height="0dp"
        android:layout_weight="7" />

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:background="@drawable/emptyrect" />

    <View
        android:layout_width="1dp"
        android:layout_height="0dp"
        android:layout_weight="6" />

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:background="@drawable/emptyrect" />

    <View
        android:layout_width="1dp"
        android:layout_height="0dp"
        android:layout_weight="7" />

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:background="@drawable/emptyrect" />
</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="50dp"
    android:layout_alignParentBottom="true"
    android:orientation="horizontal"
    android:weightSum="100" >

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:background="@drawable/emptyrect" />

    <View
        android:layout_width="1dp"
        android:layout_height="0dp"
        android:layout_weight="7" />

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:background="@drawable/emptyrect" />

    <View
        android:layout_width="1dp"
        android:layout_height="0dp"
        android:layout_weight="6" />

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:background="@drawable/emptyrect" />

    <View
        android:layout_width="1dp"
        android:layout_height="0dp"
        android:layout_weight="7" />

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20"
        android:background="@drawable/emptyrect" />
</LinearLayout>

Answer 2

您需要创建一个可绘制的形状。这就是我如何使用带有橙色bg的黑色边框，因此您只需要根据需要修改颜色和尺寸。

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

    // solid fills in the shape with the color you want
    <solid android:color="@drawable/orange" />

    // stroke gives the outline with the specified width and color
    <stroke
        android:width="3px"
        android:color="@drawable/black" />

</shape>

您可以使用<size>告诉它您希望它们有多大。

Shape drawable docs

此外，是否可以使用权重来定义宽度和高度而不是像素？

您可以执行其中一项操作，使其大小和间距相同，但您需要将其更改为LinearLayout。

如果不重写所有代码，您可能会有类似

的内容

<RelativeLayout
    // vertical orientation>
    <LinearLayout
        // horizontal orientation
        // width of 'match_parent'
        // height of wrap_content
        alignParentTop = true>
        <View
            //weight of maybe 1
            // width of '0'
            // height of wrap_content/>
        // maybe need an empty view in between each
        <View
            //weight of maybe .2
            // width of '0'
            // height of wrap_content/>
       // continue for all of your Views
    </LinearLayout>
    <LinearLayout
        // horizontal orientation
        // width of 'match_parent'
        // height of wrap_content
        alignParentBottom = true>
        <View
            //weight of maybe 1
            // width of '0'
            // height of wrap_content/>
        // maybe need an empty view in between each
        <View
            //weight of maybe .2
            // width of '0'
            // height of wrap_content/>
       // continue for all of your Views
    </LinearLayout>
</RelativeLayout>

Answer 3

使用笔画属性：

<stroke
        android:width="4dp"
        android:color="@color/red" />

笔画只能在<shape>HERE</shape>

中使用

您可以添加新的mybackground.xml文件并将其添加到drawble文件夹中 xml文件将包含以下内容：

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

    <solid android:color="#77000000" />

    <corners android:radius="10dip" />

    <gradient
        android:angle="-90"
        android:endColor="#44FF0000"
        android:startColor="#CCFF0000" />

    <padding
        android:bottom="10dip"
        android:left="10dip"
        android:right="10dip"
        android:top="10dip" />

    <stroke
        android:width="1dip"
        android:color="#000000" >
    </stroke>

</shape>

现在而不是做：你可以做android:background="@android:color/red"

android:background="@drawable/mybackground"

（顺便说一下，角落，渐变和填充属性就在那里，所以你会知道还有什么可以做）

我希望这会有所帮助：）

Answer 4

<View
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:background="@drawable/border" />

border.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >

<corners
    android:bottomLeftRadius="2dp"
    android:bottomRightRadius="2dp"
    android:radius="2dp"
    android:topRightRadius="2dp" />

<gradient
    android:endColor="#707070"
    android:startColor="#707070" />

<stroke
    android:width="1dp"
    android:color="#FF0000" />

<padding
    android:bottom="2dip"
    android:left="2dip"
    android:right="2dip"
    android:top="2dip" />

</shape>

带边框的视图

4 个答案: