除了使用XML布局之外,如何绘制自定义视图装饰?

时间:2015-08-12 17:05:26

标签: android android-layout android-linearlayout android-relativelayout

下面是我使用下面的代码创建的图。但是我打算用布局文件多次使用它。有谁知道最好的方法是删除线性布局,同时保留相同的图形外观并保持最少的视图数量?

使用线性布局的主要好处是可以使用布局权重来均匀地分隔矩形但不幸的是,当线性布局被移除并且必须回复相对布局时,不会出现相等的间距可以不使用dp测量单位(不是我想要的,特别是考虑到Android屏幕有各种不同的尺寸)。

enter image description here

    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="#808080" >
        <include
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:layout_gravity="center"
            layout="@layout/textview_carriage2"/>
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="10dp"
            android:layout_alignParentTop="true"
            android:orientation="horizontal"
            android:weightSum="100"
            android:baselineAligned="false" >

            <include
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="20"
                layout="@layout/view_emptyrect_red"/>

            <include
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:layout_weight="7"
                layout="@layout/view_spacebetweenwindows"/>

            <include
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="20"
                layout="@layout/view_emptyrect_red"/>

            <include
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:layout_weight="6"
                layout="@layout/view_spacebetweenwindows"/>

            <include
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="20"
                layout="@layout/view_emptyrect_red"/>

            <include
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:layout_weight="7"
                layout="@layout/view_spacebetweenwindows"/>

            <include
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="20"
                layout="@layout/view_emptyrect_red"/>
        </LinearLayout>

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

            <include
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="20"
                layout="@layout/view_emptyrect_red"/>

            <include
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:layout_weight="7"
                layout="@layout/view_spacebetweenwindows"/>

            <include
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="20"
                layout="@layout/view_emptyrect_red"/>

            <include
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:layout_weight="6"
                layout="@layout/view_spacebetweenwindows"/>

            <include
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="20"
                layout="@layout/view_emptyrect_red"/>

            <include
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:layout_weight="7"
                layout="@layout/view_spacebetweenwindows"/>

            <include
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="20"
                layout="@layout/view_emptyrect_red"/>
        </LinearLayout>
    </RelativeLayout>

1 个答案:

答案 0 :(得分:1)

使用XML布局对于像这样的简单装饰来说是一种过度的解决方案。而是扩展TextView(或其他View,如果您愿意)并覆盖onDraw()方法。

创建字段paint并在您从所有构造函数调用的init()方法中初始化它:

Paint paint;

private void init() {
    paint = new Paint();
    paint.setColor(Color.RED);
    paint.setStrokeWidth(4); // convert to dp?
    paint.setStyle(Paint.Style.STROKE); // delete line for filled rect
}

onDraw()方法应如下所示:(自定义!)

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    int w = canvas.getWidth();
    int h = canvas.getHeight();

    int rectWidth = w/5;
    int space = w/15;
    int topRectHeight = getPaddingTop();
    int bottomRectHeight = getPaddingBottom();

    for (int i = 0; i < 4; i++) {
        int left = i * (rectWidth + space);
        int right = left + rectWidth;

        Rect rect = new Rect(left, 0, right, topRectHeight);
        canvas.drawRect(rect, paint);

        Rect rect2 = new Rect(left, h - bottomRectHeight, right, h);
        canvas.drawRect(rect2, paint);
    }
}

这将在填充区域中绘制矩形。请注意,宽度应由match_parentweightdp中的固定值指定。

然后将视图放在XML

<your.package.RectangleTextView 
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="10dp"
    android:paddingBottom="10dp"
    android:text="2"
    android:gravity="center" />