圆形半径的Android进度条动态变化

Posted

技术标签:

【中文标题】圆形半径的Android进度条动态变化【英文标题】:Android Progressbar with circle radius changes Dynamically 【发布时间】:2012-02-22 12:53:06 【问题描述】:

我想根据滑块位置更改圆半径

我分别创建了这两个。 同时将 circle 方法应用于进度条。 面临错误。

其实我用

来调用 Progress-Bar(Seek Bar)
setContentView(R.layout.main);

如你所知,为了画圈,我必须使用setContentView(demoview);

查询:我想将两个布局作为显示合并到图像中。

我不知道这是否可行?

任何指导,教程可观。

感谢您抽出宝贵的时间来咨询我的问题。 希望你有解决方案。

【问题讨论】:

我不完全明白,你想要达到什么目的。是否要根据滑块位置更改圆半径? 是的..你是 100% 正确的。但在此之前我想在一个屏幕上同时显示这两个我遇到错误。 【参考方案1】:

看看这个.. 我没有使用android seekbar,而是在画布上绘制了一个类似的seekbar .. 检查此代码是否可以帮助您..

package com.test;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;

public class SampleComp extends View implements OnTouchListener 

    private Paint paint = null;
    private int width = 0;
    private int height = 0;
    private int barStartX = 20;
    private int barStartY = 20;
    private int barEndX;
    private int barEndY = 30;
    private int radius;
    private int heightAvailableForCircle;
    private int widthAvailableForCircle;
    private int maxRadius;
    private int totalSeekBarLength;
    private int currentSeekBarLength = 10;
    private int whatPercentOfSeekBarIsSelected = 50;

    public SampleComp(Context context) 

        super(context);
        paint = new Paint();
        paint.setAntiAlias(true);
        setOnTouchListener(this);
    
    public SampleComp(Context context, AttributeSet attrs) 

        super(context, attrs);
        paint = new Paint();
        paint.setAntiAlias(true);
    
    public SampleComp(Context context, AttributeSet attrs, int defStyle) 

        super(context, attrs, defStyle);
        paint = new Paint();
        paint.setAntiAlias(true);
    

    @Override
    public void onDraw(Canvas canvas)

        barEndX = getWidth() - 20;
        paint.setColor(Color.WHITE);
        setWidth(canvas.getWidth());
        setHeight(canvas.getHeight());

        setHeightAvailableForCircle(getViewHeight() - barEndY);
        setWidthAvailableForCircle(getViewWidth() - 40);
        System.out.println("heightAvailableForCircle: "+getAvailableHeightForCircle());
        System.out.println("widthAvailableForCircle: "+getWidthAvailableForCircle());
        totalSeekBarLength = barEndX - barStartX;
        System.out.println("SEEK LEN: "+totalSeekBarLength);
        canvas.drawRect(barStartX, barStartY, barEndX, barEndY, paint);
        paint.setColor(Color.BLUE);
        setMaxRadius(heightAvailableForCircle, widthAvailableForCircle);
        whatPercentOfSeekBarIsSelected = getSelectedSeekBarPercentage(totalSeekBarLength,getCurrentSeekBarLenghtSelected());
        System.out.println("whatPercentOfSeekBarIsSelected: "+whatPercentOfSeekBarIsSelected);
        System.out.println("!!!!!: "+canvas.getWidth());
        System.out.println("@@@@: "+getViewWidth());
        System.out.println("^^^^^^^^^************: "+ (whatPercentOfSeekBarIsSelected * (getViewWidth() - 40)) / 100);
        canvas.drawRect(barStartX, barStartY, ( (whatPercentOfSeekBarIsSelected * (getViewWidth() - 40)) / 100) + 20,
                barEndY, paint);
        paint.setColor(Color.GRAY);
        setRadius(whatPercentOfSeekBarIsSelected);
        canvas.drawCircle( (canvas.getWidth())/2, (canvas.getHeight() - 30)/2, radius, paint);
    

    private void setRadius(int per)

        this.radius = (getMaxRadius() * per)/100;
    
    private int getSelectedSeekBarPercentage(int total, int current)

        int per = 0;
        per = ( (current * 100) / total);
        return per;
    
    private void setRadius(int total, int current)

        System.out.println("total: "+total);
        System.out.println("current: "+current);
        this.radius = ( ( (getMaxRadius()/2) * current) / 100);
        System.out.println("radius: "+this.radius);
    
    private void setMaxRadius(int h, int w)

        this.maxRadius = h < w ? h/2 : w/2 ;
    
    private int getMaxRadius()

        return this.maxRadius;
    
    private void setWidth(int w)

        this.width = w;
    

    private void setHeight(int h)

        this.height = h;
    

    private int getViewWidth()

        return this.width;
    

    private int getViewHeight() 

        return this.height;
    

    private void setHeightAvailableForCircle(int availableHeightForCircle)

        this.heightAvailableForCircle = availableHeightForCircle;
    
    private int getAvailableHeightForCircle()

        return this.heightAvailableForCircle;
    

    private void setWidthAvailableForCircle(int wid)

        this.widthAvailableForCircle = wid;
    

    private int getWidthAvailableForCircle()

        return this.widthAvailableForCircle;
    
    private void setCurrentSeekBarLength(int x)

        this.currentSeekBarLength = x;
    
    private int getCurrentSeekBarLenghtSelected()

        return this.currentSeekBarLength;
    
    @Override
    public boolean onTouch(View v, MotionEvent event) 

        int x = (int) event.getX();
        int y = (int) event.getY();
        System.out.println("x: "+x);
        System.out.println("y: "+y);

        if(x >= 10 && x<= barEndX && y >= 10 && y <= 30)

            System.out.println("TRUE");
            setCurrentSeekBarLength(x - 20);
            invalidate();
        
        return false;
    

这是我的 Activity 类:

package com.test;

import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.widget.ImageView;

public class SampleActivity extends Activity 

    @Override
    public void onCreate(Bundle savedInstanceState) 

        super.onCreate(savedInstanceState);
        setContentView(new SampleComp(this));
    

【讨论】:

【参考方案2】:

您能否更具体地说明您想要实现的目标。你的问题不是那么清楚。我可以弄清楚的是,你想根据进度条值增加/减少圆的半径。

【讨论】:

这是我的第二个优先事项。现在我想在布局中显示带有进度条的圆圈,这可能吗?如何?之后我想用进度条改变半径。希望你现在清楚这一点......【参考方案3】:

看看android custom component guide。你基本上必须从android.view.View 派生你的圈子组件。然后,您可以像其他所有组件一样将其添加到您的布局中。

【讨论】:

以上是关于圆形半径的Android进度条动态变化的主要内容,如果未能解决你的问题,请参考以下文章

首页2--动态自定义圆形进度条

自定义自动播放进度条 - 动态宽度属性 - 在铬中不起作用

CSS / jQuery:动态更新的文本出现在右侧而不是圆形进度条内

UE4 C++为角色添加血条组件并动态变化。

Android自定义view之圆形进度条

前端/h5 D3.js实现根据数据动态更新图形/类似进度实时变化效果