【问题标题】:Removing the Background border from a ProgressBar从 ProgressBar 中删除背景边框
【发布时间】:2019-06-02 20:23:31
【问题描述】:

我正在尝试实现无边界的 Pie Progress

没有圆心就是进步 ..所以我尝试了多种方法在ProgressBar中实现它

我的两种方法在 PIE 周围显示一个边框

我只是想删除边框或者我希望下面的圆圈具有精确的大小。 第一种方法

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <shape android:shape="oval">
            <solid android:color="@color/grey_lightest"/>
        </shape>
    </item>
    <item>
        <shape
            android:innerRadiusRatio="100"
            android:shape="ring"
            android:thicknessRatio="2.5"
            android:useLevel="true">
            <gradient
                android:centerColor="@color/orange_above_avg"
                android:endColor="@color/orange_above_avg"
                android:startColor="@color/orange_above_avg"
                android:type="sweep"
                android:useLevel="false" />
        </shape>
    </item>

</layer-list>

第二种方法

我创建了单独的背景和progressDrawable,但结果仍然相同..

【问题讨论】:

  • 我的 2 美分想法:也许这个 android:thicknessRatio="2.5" 应该改为 android:thicknessRatio="0.0"

标签: android android-progressbar android-shape


【解决方案1】:

这不是您问题的确切解决方案,但您可以使用 customview 来实现它。

这是我从某个项目中挑选的参考资料(因此没有给予适当的评价)

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PointF;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

import in.eightfolds.soundvision.R;


public class CustomProgress extends View {

    private static final String TAG = "CustomProgress";
    private float maxWidth, maxHight;
    private PointF centerPoint;
    private float radius;
    float progressSize = 0f;
    private Path path;
    private RectF oval;
    private Paint mcirclePaint;
    private Paint mTextPaint;
    private int progress = 0;
    private Paint mBackCirclePaint;
    private  int paintStrokeWidth=40;

    public CustomProgress(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init();
    }

    public CustomProgress(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public CustomProgress(Context context) {
        super(context);
        init();
    }

    private void init() {
        centerPoint = new PointF();
        path = new Path();

        mcirclePaint = new Paint();

        mcirclePaint.setColor(Color.RED);

        mcirclePaint.setStrokeWidth(paintStrokeWidth);
        // paint.setDither(true);
        mcirclePaint.setAntiAlias(true);
        mcirclePaint.setStyle(Paint.Style.STROKE);
        mBackCirclePaint = new Paint();

        mBackCirclePaint.setColor(Color.DKGRAY);

        mBackCirclePaint.setStrokeWidth(paintStrokeWidth);
        // paint.setDither(true);
        mBackCirclePaint.setAntiAlias(true);
        mBackCirclePaint.setStyle(Paint.Style.STROKE);
        oval = new RectF();

        mTextPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.SUBPIXEL_TEXT_FLAG);
        // mTextPaint.setColor(getResources().getColor(
        // android.R.color.holo_blue_dark));

        mTextPaint.setColor(Color.RED);
        mTextPaint.setStrokeWidth(1);
        mTextPaint.setStyle(Paint.Style.FILL_AND_STROKE);
        mTextPaint.setTextAlign(Paint.Align.CENTER);
        mTextPaint.setTextSize(60);

    }

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

        canvas.drawCircle(centerPoint.x, centerPoint.y, radius,
                mBackCirclePaint);
        // mcirclePaint.setColor(Color.RED);
        canvas.drawArc(oval, -90, progressSize, false, mcirclePaint);
        // paint.setTextSize(20);
        // canvas.drawCircle(centerPoint.x, centerPoint.y, 2, mcirclePaint);

        if (progress > 0) {
            canvas.drawText(progress + "%", centerPoint.x, centerPoint.y
                    + mTextPaint.descent(), mTextPaint);

        }

    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right,
            int bottom) {

        Log.v(TAG, "" + changed);

        if (getMeasuredWidth() < getMeasuredHeight()) {
            maxWidth = getMeasuredWidth();
            maxHight = getMeasuredHeight();
            centerPoint.x = maxWidth / 2;
            centerPoint.y = maxHight / 2;

        } else {
            maxWidth = getMeasuredHeight();
            maxHight = getMeasuredWidth();
            centerPoint.x = maxHight / 2;
            centerPoint.y = maxWidth / 2;
        }
        setUp();

    }

    private void setUp() {

        if (maxWidth > maxHight) {

            radius = maxHight / 4;

        } else {

            radius = maxWidth / 4;

        }

        path.addCircle(maxWidth / 2,

        maxHight / 2, radius,

        Path.Direction.CW);

        oval.set(centerPoint.x - radius,

        centerPoint.y - radius,

        centerPoint.x + radius,

        centerPoint.y + radius);

    }

    public void upDateProgress(int progress) {


            mcirclePaint.setColor(getResources().getColor(R.color.themeColor));
            mTextPaint.setColor(getResources().getColor(R.color.themeColor));

        this.progress = progress;
        float i = 360f / 100f;
        progressSize = (float) (i * progress);
        Log.d(TAG, progress + "<----progress---->" + progressSize);
        invalidate();
    }

    public int getProgress() {
        return progress;
    }
}

在布局文件中使用它并使用upDateProgress 更改进度。 将宽度和颜色更改为您自己的。如果您想要文本,则在此自定义视图的中心放置一个文本视图

【讨论】:

    猜你喜欢
    • 2014-07-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-04-08
    • 2012-09-27
    • 1970-01-01
    • 1970-01-01
    • 2015-05-06
    相关资源
    最近更新 更多