今天終於解決了困擾整整一週的，一個令人抓狂的HPUX程式碼問題。可以在這半夜神清氣爽的說下昨天晚上推匯出來的一個小技巧，

如何在一張餅圖(Pie Chart)上每個扇形的中心位置標記出百分比。 我之前寫了一篇怎麼自繪餅圖的文章，但百分比都是另外在一個

地方顯示的，不是不想顯示在每個扇形圖中，是當時還不會。昨晚花了點時間，終於找出了計算方法。

   先上張最終效果圖:

   經歷過的思路歷程也很有意思，看看下面幾張圖，可以很清楚的顯示說明計算經過是怎麼樣子的:

   靠左的這張圖，說明了我需要解決的問題所在，即目前已知圓心座標，半徑，及角度，如何得到扇形的中心點

慚愧的心情baidu了一翻後，終於找到了依角度可求出圖上座標的計算公式，不知其所以然(繼續慚愧中.....)的套了上去，得到了中間這張圖。

   中間這張圖可以很清楚的得到每個角度，最末邊交叉點位置。 但這個位置並不是我們想要的，我們想的是中間這個點的座標。如果是這樣，而中點的座標是多少呢，

好像沒啥現成的公式，只好靈活變化一下，還是套用這公式，把角度減少一半不得就行了。這樣就得到了最右邊這張圖。

   最右邊這張圖已經很接近最終效果了，實際上很多餅圖得到這個座標就夠了，直接畫一條線延伸出去，再標註百分比就可以了，這種情況適合於角度太小的情況。

但我舉的例子中角度都偏大，可以直接標註百分比到圖中，怎麼做? 按前面取角度的思路想，事情就簡單了，即然現在是在邊上，那把半徑縮小一圈按這個方法計算不就行了，哈哈。 終於得到了想要的效果。

  附上主程式程式碼:     

package com.xcl.canvas05;

/**
 * Canvas練習 
 * 	  給餅圖示上百分比,能計算出餅圖標註的位置
 *  
 * author:xiongchuanliang
 * date:2014-4-10
 */

import java.text.DecimalFormat;

import com.xcl.chart.XChartCalc;

import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import android.graphics.Path;
import android.graphics.Path.Direction;
import android.graphics.RectF;
import android.util.DisplayMetrics;
import android.view.Menu;
import android.view.View;

@SuppressLint("NewApi")
public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
     //   setContentView(R.layout.activity_main);
        this.setTitle("給餅圖示上百分比");
        setContentView(new PanelPieChartLabel(this));
    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }
    

   
     class PanelPieChartLabel extends View {
    	
    	private int ScrWidth,ScrHeight;
		private float rx, ry;
		

		public PanelPieChartLabel(Context context) {
			super(context);
			// TODO Auto-generated constructor stub
			
			//解決4.1版本 以下canvas.drawTextOnPath()不顯示問題			
			this.setLayerType(View.LAYER_TYPE_SOFTWARE,null);
			
			//螢幕資訊
			DisplayMetrics dm = getResources().getDisplayMetrics();
			ScrHeight = dm.heightPixels;
			ScrWidth = dm.widthPixels;
		}
		
		public void onDraw(Canvas canvas){
			//畫布背景
			canvas.drawColor(Color.WHITE);
			
			//畫筆初始化
			Paint PaintArc = new Paint();
			PaintArc.setColor(Color.RED);		
						
			Paint PaintGree = new Paint();
			PaintGree.setColor(Color.GREEN);
			PaintGree.setStyle(Style.FILL);
			
			Paint PaintBlue = new Paint();
			PaintBlue.setColor(Color.BLUE);
			PaintBlue.setStyle(Style.STROKE);
			
			Paint PaintYellow = new Paint();
			PaintYellow.setColor(Color.YELLOW);
			PaintYellow.setStyle(Style.FILL);
			
			//抗鋸齒
			PaintArc.setAntiAlias(true);
			PaintYellow.setAntiAlias(true);
			PaintGree.setAntiAlias(true);
					
			PaintBlue.setTextSize(12);
						
			float cirX = ScrWidth / 2;
			float cirY = ScrHeight / 3 ;
			float radius = ScrHeight / 5 ;
			//先畫個圓確定下顯示位置
			canvas.drawCircle(cirX,cirY,radius,PaintGree);
									
			float arcLeft = cirX - radius;
			float arcTop  = cirY - radius ;
			float arcRight = cirX + radius ;
			float arcBottom = cirY + radius ;
			RectF arcRF0 = new RectF(arcLeft ,arcTop,arcRight,arcBottom);	
			
			////////////////////////////////////////////////////////////
			//餅圖示題
			canvas.drawText("author:xiongchuanliang",60,ScrHeight - 270, PaintBlue);	
			
			//位置計算類  
            XChartCalc xcalc = new XChartCalc();					
            
            //實際用於計算的半徑
            float calcRadius = radius/2;
			////////////////////////////////////////////////////////////
			//初始角度 				
			float pAngle1 = 130f; 
			float pAngle2 = 40f; 
			float pAngle3 = 360f - pAngle1 - pAngle2; 
			
			//填充扇形
			canvas.drawArc(arcRF0, 0,pAngle1, true,PaintArc); 
			
			//計算並在扇形中心標註上百分比    130%
            xcalc.CalcArcEndPointXY(cirX, cirY, calcRadius, pAngle1/2); 
            canvas.drawText(Float.toString(pAngle1)+"%", xcalc.getPosX(),xcalc.getPosY(), PaintBlue);  
            //////////////////////////////////////////////////////////////
            
            ////////////////////////////////////////////////////////////             
            //填充扇形
            canvas.drawArc(arcRF0, pAngle1,pAngle2, true,PaintYellow);            
            //計算並在扇形中心標註上百分比   40%
            xcalc.CalcArcEndPointXY(cirX, cirY, calcRadius, pAngle1 + pAngle2/2);	            
            canvas.drawText(Float.toString(pAngle2)+"%", xcalc.getPosX(),xcalc.getPosY(), PaintBlue);  
            
            ////////////////////////////////////////////////////////////  
            //計算並在扇形中心標註上百分比  190%
            xcalc.CalcArcEndPointXY(cirX, cirY, calcRadius, pAngle1 + pAngle2 + pAngle3/2);	            
            canvas.drawText(Float.toString(pAngle3)+"%", xcalc.getPosX(),xcalc.getPosY(), PaintBlue);  
            //////////////////////////////////////////////////////////// 								
	 }
		
	
    }
    
}
 

   附上計算位置的程式碼類:     

package com.xcl.chart;

/**
 * Canvas練習 
 * 	  圖形相關的計算類
 *   
 * author:xiongchuanliang
 * date:2014-4-9
 */

public class XChartCalc {
	

	//Position位置
	private float posX = 0.0f;
	private float posY = 0.0f;
	
	public XChartCalc()
	{
		
	}
			
	
	//依圓心座標，半徑，扇形角度，計算出扇形終射線與圓弧交叉點的xy座標
	public void CalcArcEndPointXY(float cirX, float cirY, float radius, float cirAngle){

		//將角度轉換為弧度		
        float arcAngle = (float) (Math.PI * cirAngle / 180.0);
        if (cirAngle < 90)
        {
            posX = cirX + (float)(Math.cos(arcAngle)) * radius;
            posY = cirY + (float)(Math.sin(arcAngle)) * radius;
        }
        else if (cirAngle == 90)
        {
            posX = cirX;
            posY = cirY + radius;
        }
        else if (cirAngle > 90 && cirAngle < 180)
        {
        	arcAngle = (float) (Math.PI * (180 - cirAngle) / 180.0);
            posX = cirX - (float)(Math.cos(arcAngle)) * radius;
            posY = cirY + (float)(Math.sin(arcAngle)) * radius;
        }
        else if (cirAngle == 180)
        {
            posX = cirX - radius;
            posY = cirY;
        }
        else if (cirAngle > 180 && cirAngle < 270)
        {
        	arcAngle = (float) (Math.PI * (cirAngle - 180) / 180.0);
            posX = cirX - (float)(Math.cos(arcAngle)) * radius;
            posY = cirY - (float)(Math.sin(arcAngle)) * radius;
        }
        else if (cirAngle == 270)
        {
            posX = cirX;
            posY = cirY - radius;
        }
        else
        {
        	arcAngle = (float) (Math.PI * (360 - cirAngle) / 180.0);
            posX = cirX + (float)(Math.cos(arcAngle)) * radius;
            posY = cirY - (float)(Math.sin(arcAngle)) * radius;
        }
				
	}


    //////////////
	public float getPosX() {
		return posX;
	}


	public float getPosY() {
		return posY;
	}	
    //////////////
}

附其它連結:

MAIL: [email protected]

BLOG: http://blog.csdn.net/xcl168