如何绘制圆角正方形的线条?

时间:2015-11-04 06:40:26

标签: android drawing

我很高兴你的帮助!我使用以下代码:

Paint mPaintShape = new Paint();
mPaintShape.setStrokeWidth(AppUtill.dp2px(getContext(), 4));
mPaintShape.setColor(mNormalColor);
mPaintShape.setStyle(Paint.Style.STROKE);

@Override
    protected void onDraw(Canvas canvas) {
        RectF rect = new RectF(0, 0, mSize, mSize);
        canvas.drawRoundRect(rect, mCornerRadius, mCornerRadius, mPaintShape);
    }

我得到以下结果。但我希望有圆角外角 我怎么能这样做?

enter image description here

3 个答案:

答案 0 :(得分:0)

首先创建一个给定的样式文件 allround.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
    <shape  android:shape="rectangle">
        <solid
            android:color="#ff6600" />
        <stroke
            android:width="2dp"
            android:color="#EAD61C" />
        <corners
            android:radius="7dp" />
        <padding
            android:left="5dp"
            android:top="5dp"
            android:right="5dp"
            android:bottom="5dp" />
    </shape>
</item>
<item>
    <shape android:shape="rectangle">
        <gradient
            android:startColor="#ffff00"
            android:endColor="#FEC34D"
            android:angle="270" />
        <stroke
            android:width="2dp"
            android:color="#2f6699" />
        <corners
            android:radius="7dp" />
        <padding
            android:left="5dp"
            android:top="5dp"
            android:right="5dp"
            android:bottom="5dp" />
    </shape>
</item>
</selector>

并在布局组件中应用此样式,如下所示 -

android:background="@drawable/allround"

或者你可以使用&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;

RectF r = new RectF(1,2,3,4);
canvas.drawRoundRect(r, 0, 0, mPaint);

答案 1 :(得分:0)

试试这个:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true"
        android:drawableRight="@drawable/btnpressed">
        <shape>
            <solid
                android:color="#6B0000" />
            <stroke
                android:width="3dp"
                android:color="#6B0000" />
            <corners
                android:radius="6dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>

    <item>
        <shape>
            <gradient
                android:startColor="#794C3F"
                android:endColor="#794C3F"
                android:angle="270" />
            <stroke
                android:width="3dp"
                android:color="#794C3F" />
            <corners
                android:radius="7dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
</selector>

答案 2 :(得分:0)

此解决方案使用Canvas.drawLine()Canvas.draw Arc()。我介绍了偏移并设置了mSize&#39;根据测量的高度/宽度,确保所有边缘都可以看到所需的行程宽度。修改“mCornerRadius”&#39;当然会改变角落。

我使用了一个角半径为8的红色油漆来获得这个:

enter image description here

    @Override
protected void onDraw(Canvas canvas)
{
    // to make sure that the whole shape fits into the View
    // (else some lines may be thinner/ missing)
    mSize = Math.min(getMeasuredHeight(), getMeasuredWidth())*0.8f;

    float offset_top = 4;
    float offset_left = 4;
    float sizeMinusRadius = mSize - mCornerRadius;

    // horizontal lines
    canvas.drawLine(offset_left + mCornerRadius, offset_top, offset_left + sizeMinusRadius, offset_top, mPaintShape);
    canvas.drawLine(offset_left + mCornerRadius, offset_top + mSize, offset_left + sizeMinusRadius, offset_top + mSize, mPaintShape);

    // vertical lines
    canvas.drawLine(offset_left, offset_top + mCornerRadius, offset_left, offset_top + sizeMinusRadius, mPaintShape);
    canvas.drawLine(offset_left + mSize, offset_top + mCornerRadius, offset_left + mSize, offset_top + sizeMinusRadius, mPaintShape);

    // corner bottom left
    RectF rBottomLeft = new RectF(offset_left, 
          offset_top + mSize - 2 * mCornerRadius, offset_left + 2 * mCornerRadius,
          offset_top + mSize);
    canvas.drawArc(rBottomLeft, 90, 90, false, mPaintShape);
    // corner bottom right
    RectF rBottomRight = new RectF(offset_left + mSize - 2 * mCornerRadius,
        offset_top + mSize - 2 * mCornerRadius, offset_left + mSize, offset_top + mSize);
    canvas.drawArc(rBottomRight, 0, 90, false, mPaintShape);
    // corner top left
    RectF rTopLeft = new RectF(offset_left, offset_top, 
                offset_left + 2 * mCornerRadius, offset_top + 2 * mCornerRadius);
    canvas.drawArc(rTopLeft, 180, 90, false, mPaintShape);
    // corner top right
    RectF rTopRight = new RectF(offset_left + mSize - 2 * mCornerRadius, offset_top, 
                            offset_left + mSize, offset_top + 2 * mCornerRadius);
    canvas.drawArc(rTopRight, 270, 90, false, mPaintShape);
}