2013-03-22 77 views
1

我在android應用程序中工作,我有一個stings列表。如果字符串列表包含3個字符串,則必須將該圓圈分成3個相等部分,並將三個字符串綁定在圓圈的分隔區域中。我怎樣才能做到這一點。我應該使用哪個小部件來製作這個圈子。請幫我enter image description here p我。在android中動態劃分圈子

+1

使用achartengine餅圖。 www.achartengine.org/ – Raghunandan 2013-03-22 09:22:39

+0

@Raghunandan謝謝你的回覆。有沒有什麼解決方案,以便我們可以使用一個android小部件並對其進行自定義,因爲我必須將動畫應用到它才能旋轉圓圈。 – Arun 2013-03-22 09:28:06

+0

我們可以自定義一個android小部件來圓形並將它們分成相等的部分嗎? – Arun 2013-03-22 11:19:28

回答

0

您可以使用AChartEngine來完成此操作。它有非常強大的方法來繪製餅圖。

enter image description here

+0

感謝您的回覆。有沒有什麼解決方案,以便我們可以使用一個android小部件並對其進行自定義,因爲我必須將動畫應用到它才能旋轉圓圈。 – Arun 2013-03-22 09:29:43

+0

AChartEnginge帶有它自己的視圖,因此您可以將動畫直接應用到它。 – Thommy 2013-03-22 09:40:31

1

這只是一個例子。您需要根據您的需求進行修改。既然你問了我已經粘貼了下面的代碼的示例。

http://developer.android.com/training/custom-views/custom-drawing.html。關於繪圖的文檔。在鏈接末尾有一個示例

使用achartengine很容易。 http://www.achartengine.org/

對於使用achartengine的餅圖。 http://wptrafficanalyzer.in/blog/android-drawing-pie-chart-using-achartengine/

要繪製視圖,您可以使用下面的示例。

public class MainActivity extends Activity { 

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    MyView mv= new MyView(this); 
    setContentView(mv); 
} 

@Override 
public boolean onCreateOptionsMenu(Menu menu) { 
    // Inflate the menu; this adds items to the action bar if it is present. 
    getMenuInflater().inflate(R.menu.activity_main, menu); 
    return true; 
} 
class MyView extends View 
{ 
    Context c; 
     private Bitmap mBitmap; 
     private Canvas mCanvas; 
     private Path mPath; 
     private Paint mBitmapPaint; 
     private Paint mpaint,paint2; 

    public MyView(Context context) { 
     super(context); 
     c= context; 
     mpaint= new Paint(); 
     mpaint.setColor(Color.RED); 
     mpaint.setStyle(Paint.Style.FILL); 
     paint2 = new Paint(); 
     paint2.setColor(Color.GREEN); 
     paint2.setStrokeWidth(10); 
      mBitmapPaint = new Paint(); 
      mBitmapPaint.setColor(Color.RED); 
     // TODO Auto-generated constructor stub 
    } 
     @Override 
     protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
      super.onSizeChanged(w, h, oldw, oldh); 
      mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888); 
      mCanvas = new Canvas(mBitmap); 
     } 

     @Override 
     protected void onDraw(Canvas canvas) { 
      Display display = ((Activity) c).getWindowManager().getDefaultDisplay(); 
      float w = display.getWidth(); 
      float h = display.getHeight(); 
      canvas.drawCircle(w/2, h/2, 350, mpaint); 
      canvas.drawLine(w/2, h/2, 20, h/2, paint2); 

     } 
} 
} 

用canvas.drawText(text,x,y,paint)繪製文本。根據您的需要修改相同的內容。在視圖上添加動畫。

enter image description here

+0

@阿倫你嘗試了以上。 – Raghunandan 2013-03-24 20:19:28

0
public class Demo extends Activity { 
    /** Called when the activity is first created. */ 
    float values[]={300,400,100,500}; 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.main); 
     LinearLayout linear=(LinearLayout) findViewById(R.id.linear); 
     values=calculateData(values); 
     linear.addView(new MyGraphview(this,values)); 

    } 
    private float[] calculateData(float[] data) { 
     // TODO Auto-generated method stub 
     float total=0; 
     for(int i=0;i<data.length;i++) 
     { 
      total+=data[i]; 
     } 
     for(int i=0;i<data.length;i++) 
     { 
     data[i]=360*(data[i]/total);    
     } 
     return data; 

    } 
    public class MyGraphview extends View 
    { 
     private Paint paint=new Paint(Paint.ANTI_ALIAS_FLAG); 
     private float[] value_degree; 
     private int[] COLORS={Color.BLUE,Color.GREEN,Color.GRAY,Color.CYAN,Color.RED}; 
     RectF rectf = new RectF (10, 10, 200, 200); 
     int temp=0; 
     public MyGraphview(Context context, float[] values) { 

      super(context); 
      value_degree=new float[values.length]; 
      for(int i=0;i<values.length;i++) 
      { 
       value_degree[i]=values[i]; 
      } 
     } 
     @Override 
     protected void onDraw(Canvas canvas) { 
      // TODO Auto-generated method stub 
      super.onDraw(canvas); 

      for (int i = 0; i < value_degree.length; i++) {//values2.length; i++) { 
       if (i == 0) { 
        paint.setColor(COLORS[i]); 
        canvas.drawArc(rectf, 0, value_degree[i], true, paint); 
       } 
       else 
       { 
         temp += (int) value_degree[i - 1]; 
         paint.setColor(COLORS[i]); 
         canvas.drawArc(rectf, temp, value_degree[i], true, paint); 
       } 
      } 
     } 

    } 
} 
0

您可以創建自定義視圖,這裏面畫一個圓圈,鴻溝沒有使用拉線部分的。

您的onDraw()方法使用此代碼。

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

    int width = getWidth(); // get center point of view. 
    // Draw circle 
    Paint mPaintCircle = new Paint(); 
    mPaintCircle.setColor(Color.WHITE); 
    mPaintCircle.setAntiAlias(true); 
    mPaintCircle.setStyle(Paint.Style.STROKE); 
    mPaintCircle.setStrokeWidth(5); 

    canvas.drawCircle(width/2, width/2, width/2, mPaintCircle); 
    // Draw line 
    Paint mPaintLine = new Paint(); 
    mPaintLine.setColor(Color.GREEN); 
    mPaintLine.setStrokeWidth(5); 

    //number of section you want to divide. 
    int pointsTODraw = 8; 
    float pointAngle = 360/pointsTODraw; //angle between points 
    for (float angle = 0; angle < 360; angle = angle + pointAngle) { //move round the circle to each point 
      float x = (float) (Math.cos(Math.toRadians(angle)) * radiusPart); //convert angle to radians for x and y coordinates 
      float y = (float) (Math.sin(Math.toRadians(angle)) * radiusPart); 
      canvas.drawLine(radiusPart, radiusPart, x + radiusPart, y + radiusPart, mPaintLine); 
    } 
}