中心圈的文字 [英] Center the text in the circle
本文介绍了中心圈的文字的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我要画一个圆拥有一批在每件我的圈子。 我的问题是我不能中心，在那里我想要的文字。 为什么中心绘制文本并不比中心相同，那条???
我的软件的输出是链接到图片： florianbrunet.com/forum/problemCentrer.png
/ *输入code在这里
*作者：弗洛里安·布吕
*日期：2013年6月12日
*我的网站：florianbrunet.com
*
*在这里输入code
* /
包com.example.ando_dessin_test;
// MERCI一个http://supertos.free.fr/supertos.php?page=1066
导入了java.util.Random;
进口android.app.Activity;
进口android.content.Context;
进口android.graphics.Canvas;
进口android.graphics.Color;
进口android.graphics.Paint;
进口android.graphics.Paint.Align;
进口android.graphics.Paint.Style;
进口android.os.Bundle;
进口android.view.View;
进口android.view.Window;
进口android.view.WindowManager;
公共类MainActivity延伸活动{
@覆盖
保护无效的onCreate（包savedInstanceState）{
super.onCreate（savedInstanceState）;
// Desactiver拉巴里德滴度德圣母应用
requestWindowFeature（Window.FEATURE_NO_TITLE）;
//路人拉Fenêtre两家恩全creen == cacher的拉巴雷日的通知
getWindow（）。setFlags（WindowManager.LayoutParams.FLAG_FULLSCREEN，
WindowManager.LayoutParams.FLAG_FULLSCREEN）;
的setContentView（新的RenderView（本））;
}
//创建D'UNE CLASSE上网。的RenderView倒gérer未affichage简单
// permettant
//德montrer阙常识occupons边兜售L'ECRAN
一流的RenderView扩展视图{
公众的RenderView（上下文的背景下）{
超（上下文）;
}
// Dessinons河畔拉totalitéDE L'ECRAN
保护无效的OnDraw（帆布油画）{
canvas.drawRGB（0，0，0）;
//实例德漆倒définirL'attribut COULEUR德圣母点，
// AINSI阙
// SA taille。
涂料粉刷=新的油漆（）;
//奴斯allons dessiner号点相提并论关系点菜分辨率德
// L'ECRAN
INT iWidth = canvas.getWidth（）; // Largeur
INT IHEIGHT = canvas.getHeight（）; //豪特
//浮动半径= 0; //半径导致了错误，所以我初始化这个
// 变量
随机兰特=新的随机（）;
// J'AI L'IM pression detre丹斯莱ETOILES AVEC CES疫点
// Affichons 10000点去所有领域莱COULEURS
的for（int i = 0; I＆LT; 10000;我++）{
// Affecter UNE COULEUR德manièrealéatoire
paint.setARGB（255，rand.nextInt（256），rand.nextInt（256），
rand.nextInt（256））;
// PUIS dessiner号点丹斯乐canevas
canvas.drawPoint（rand.nextInt（iWidth），rand.nextInt（IHEIGHT）
涂料）;
}
// aficchons巴黎fameux色格拉
//帆布油画=新的Canvas（）;
油漆circlePaint =新的油漆（Paint.ANTI_ALIAS_FLAG）;
circlePaint.setColor（Color.RED）;
circlePaint.setStyle（Style.STROKE）;
circlePaint.setStrokeWidth（10）;
浮rayonDuCercle = canvas.getWidth（）/ 2;
canvas.drawCircle（（浮点）canvas.getWidth（）/ 2，
（浮点）canvas.getHeight（）/ 2，rayonDuCercle，circlePaint）;
浮rayonDuCerclePetit = canvas.getWidth（）/ 6;
canvas.drawCircle（（浮点）canvas.getWidth（）/ 2，
（浮点）canvas.getHeight（）/ 2，rayonDuCerclePetit，
circlePaint）;
/ *
* //随机兰特=新的随机（）; // Affichons 100段德所有领域
* LES COULEURS的for（int i = 0; I＆LT; 100;我++）{// Affecter UNE
* COULEUR德manièrealéatoirepaint.setARGB（255，
* rand.nextInt（256），rand.nextInt（256），rand.nextInt（256））; //
*DéfinirL'épaisseur杜段paint.setStrokeWidth
*（rand.nextInt（10））; // PUIS dessiner号点丹斯乐cavenas
* canvas.drawLine（rand.nextInt（iWidth），rand.nextInt（IHEIGHT）
* rand.nextInt（iWidth），rand.nextInt（IHEIGHT），漆）; }
* /
paint.setARGB（255，rand.nextInt（256），rand.nextInt（256），
rand.nextInt（256））;
//DéfinirL'épaisseur杜段
paint.setStrokeWidth（2）;
// PUIS dessiner号点丹斯乐cavenas
// okcanvas.drawLine（（浮动）（（浮点）Math.cos（0）* rayonDuCerclePetit）+ canvas.getWidth（）/ 2，
// canvas.getHeight（）/ 2，canvas.getWidth（）/ 2 + rayonDuCercle，
// canvas.getHeight（）/ 2，油漆）;
// okcanvas.drawLine（（浮动）（（浮点）Math.cos（Math.PI / 2）* rayonDuCerclePetit）+ canvas.getWidth（）/ 2，
// ((float)Math.sin(Math.PI/2)*rayonDuCerclePetit)+canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle*(float)Math.cos(Math.PI/2),
// rayonDuCercle *（浮点）Math.sin（Math.PI / 2）+ canvas.getHeight（）/ 2，
// 涂料）;
// okkk
// canvas.drawLine（（浮动）（（浮点）Math.cos（Math.PI / 4）* rayonDuCerclePetit）+ canvas.getWidth（）/ 2，
// ((float)Math.sin(Math.PI/4)*rayonDuCerclePetit)+canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle*(float)Math.cos(Math.PI/4),
// rayonDuCercle *（浮点）Math.sin（Math.PI / 4）+ canvas.getHeight（）/ 2，
// 涂料）;
// initPaint（油漆，）;
// pourquoi j'utilise 2 boucles？ Parce阙倒限制器和空间
//备忘录j'utilise乐即使得到canva等拉瑟差异恩特雷里奥斯CES
//德塞夫勒元素EST LA COULEUR。
// cette仿羔皮呢网站公告DES人造纤维
的for（int i = 0; I＆LT; 8;我++）{
setRayon（帆布，（Math.PI / 4）*我，涂料，rayonDuCercle，
rayonDuCerclePetit）;
}
paint.setTextAlign（Align.RIGHT）;
// cette仿羔皮呢affichage杜texte
的for（int i = 1; I＆LT; 9;我++）{
的setText（帆布，涂料，将String.valueOf（ⅰ），（Math.PI / 4）* I，
rayonDuCercle * 0.7，80）;
//州市济猪乐dernier元素j'affiche乐9杜中心
如果（我== 8）{
paint.setTextAlign（Align.CENTER）;
的setText（帆布，涂料，将String.valueOf第（i + 1），（Math.PI / 4）
* I，rayonDuCercle * 0，80）;
}
}
}
/ *
*信息倒入unen存在的阙J'AI PAS chercher一个COM prendre L'角
* positif s'affiche COMME SIc'été联合国法兰negatif。 Donc济bidouille
*恩multipliant L'角面值-1
* /
无效setRayon（画布油画，双angleRad，油漆涂料，
浮rayonDuCercle，浮rayonDuCerclePetit）{
// angleRad = angleRad * -1;
angleRad =（Math.toRadians（（双）70）+ angleRad）* -1;
canvas.drawLine（
（浮动）（（浮点）Math.cos（angleRad）* rayonDuCerclePetit）
+ canvas.getWidth（）/ 2，
（（浮点）Math.sin（angleRad）* rayonDuCerclePetit）
+ canvas.getHeight（）/ 2，
canvas.getWidth（）/ 2 + rayonDuCercle
*（浮点）Math.cos（angleRad）
rayonDuCercle *（浮点）Math.sin（angleRad）
+ canvas.getHeight（）/ 2，油漆）;
}
/ *
*信息倒入unen存在的阙J'AI PAS chercher一个COM prendre L'角
* positif s'affiche COMME SIc'été联合国法兰negatif。 Donc济bidouille
*恩multipliant L'角面值-1
* /
无效的setText（画布油画，漆漆，串TXT，双angleRad，
双rayonTxt，诠释sizeText）{
paint.setColor（Color.WHITE）;
paint.setTextSize（sizeText）;
angleRad =（Math.toRadians（（双）50）+ angleRad）* -1;
//斧德ordonees enhaut一个笨拙 - ＆GT; canvas.drawText（TXT，（浮动）
// Math.cos（angleRad）*（浮点）rayonTxt，
//（浮点）Math.sin（angleRad）*（浮点）rayonTxt，油漆）;
// LIGNE suivante J'AI山川L'斧
canvas.drawText（TXT，（浮动）Math.cos（angleRad）*（浮点）rayonTxt
+ canvas.getWidth（）/ 2，（浮动）Math.sin（angleRad）
*（浮点）rayonTxt + canvas.getHeight（）/ 2，油漆）;
}
/ *
*私人无效initPaint（油漆涂料，可绘制绘制，浮法
* textHeight不同，浮动baselineOffset）{油漆=新的油漆（）;
* paint.setStyle（Paint.Style.STROKE）; paint.setColor（Color.BLUE）;涂料
* =新的油漆（）; paint.setStyle（Paint.Style.FILL_AND_STROKE）;
* paint.setAntiAlias（真正的）; paint.setColor（Color.WHITE）;
* paint.setTextSize（30）; paint.setTextAlign（Align.CENTER）;的FontMetrics
*的FontMetrics = paint.getFontMetrics（）; baselineOffset =
* fontMetrics.bottom; //底部是最大量的文本
*下降//我不知道这是为什么，从血统不同...
* textHeight不同= fontMetrics.bottom - fontMetrics.top; //绘制=
* getResources（）getDrawable（R.drawable.ic_launcher）。 }
* /
}
}
解决方案
我有很多的乐趣与回答这个问题，这是我最后的努力：
第一个图像只是用于测试和在同时测定微胖的empyrical值;第二个是卸下额外code后的最终产品
圆的错觉接近完美（足以让人类的眼睛，我猜）
下面是修改后的布局，
＆LT; RelativeLayout的
的xmlns：机器人=http://schemas.android.com/apk/res/android
的xmlns：工具=http://schemas.android.com/tools
机器人：后台=＃F000
机器人：layout_width =match_parent
机器人：layout_height =match_parent
机器人：paddingBottom会=@扪/ activity_vertical_margin
机器人：以下属性来=@扪/ activity_horizontal_margin
机器人：paddingRight =@扪/ activity_horizontal_margin
机器人：paddingTop =@扪/ activity_vertical_margin
工具：上下文=。MainActivity
机器人：ID =@ + ID / BG
＆GT;
＆LT;的TextView
机器人：ID =@ + ID / txt9
机器人：layout_width =160dp
机器人：layout_height =160dp
机器人：layout_centerInParent =真
机器人：重力=中心
机器人：文本=9
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT;的TextView
机器人：ID =@ + ID / TXT1
机器人：layout_width =80dp
机器人：layout_height =80dp
机器人：layout_above =@ ID / txt9
机器人：layout_alignLeft =@ ID / txt9
机器人：paddingRight =12dp
机器人：paddingTop =12dp
机器人：重力=中心
机器人：文本=1
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT;的TextView
机器人：ID =@ + ID / txt8
机器人：layout_width =80dp
机器人：layout_height =80dp
机器人：layout_alignTop =@ ID / TXT1
机器人：layout_toRightOf =@ ID / TXT1
机器人：以下属性来=12dp
机器人：paddingTop =12dp
机器人：重力=中心
机器人：文本=8
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT;的TextView
机器人：ID =@ + ID / TXT2
机器人：layout_width =80dp
机器人：layout_height =80dp
机器人：layout_alignTop =@ ID / txt9
机器人：layout_toLeftOf =@ ID / txt9
机器人：以下属性来=12dp
机器人：paddingBottom会=12dp
机器人：重力=中心
机器人：文本=2
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT;的TextView
机器人：ID =@ + ID / txt3
机器人：layout_width =80dp
机器人：layout_height =80dp
机器人：layout_below =@ ID / TXT2
机器人：layout_toLeftOf =@ ID / txt9
机器人：以下属性来=12dp
机器人：paddingTop =12dp
机器人：重力=中心
机器人：文本=3
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT;的TextView
机器人：ID =@ + ID / txt4
机器人：layout_width =80dp
机器人：layout_height =80dp
机器人：layout_below =@ ID / txt9
机器人：layout_alignLeft =@ ID / txt9
机器人：paddingRight =12dp
机器人：paddingBottom会=12dp
机器人：重力=中心
机器人：文本=4
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT;的TextView
机器人：ID =@ + ID / txt5
机器人：layout_width =80dp
机器人：layout_height =80dp
机器人：layout_alignTop =@ ID / txt4
机器人：layout_toRightOf =@ ID / txt4
机器人：以下属性来=12dp
机器人：paddingBottom会=12dp
机器人：重力=中心
机器人：文本=5
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT;的TextView
机器人：ID =@ + ID / txt7
机器人：layout_width =80dp
机器人：layout_height =80dp
机器人：layout_alignTop =@ ID / txt9
机器人：layout_toRightOf =@ ID / txt9
机器人：paddingRight =12dp
机器人：paddingBottom会=12dp
机器人：重力=中心
机器人：文本=7
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT;的TextView
机器人：ID =@ + ID / txt6
机器人：layout_width =80dp
机器人：layout_height =80dp
机器人：layout_below =@ ID / txt7
机器人：layout_toRightOf =@ ID / txt9
机器人：paddingRight =12dp
机器人：paddingTop =12dp
机器人：重力=中心
机器人：文本=6
机器人：TEXTSIZE =40SP
机器人：TEXTSTYLE =黑体
机器人：文字颜色=＃FFFF
/＆GT;
＆LT; / RelativeLayout的＆GT;
这是更新的code（你会得到更多的优化）， MainActivity.java
包com.example.numbers;
导入了java.util.Random;
进口android.app.Activity;
进口android.content.Context;
进口android.graphics.Canvas;
进口android.graphics.Color;
进口android.graphics.Paint;
进口android.graphics.Paint.Style;
进口android.os.Bundle;
进口android.view.View;
进口android.view.ViewGroup;
进口android.view.Window;
进口android.view.WindowManager;
进口android.widget.RelativeLayout;
公共类MainActivity
扩展活动
{
最后的油漆PNT =新的油漆（Paint.ANTI_ALIAS_FLAG）;
最后随机RND =新的随机（）;
RelativeLayout的rlBG;
@覆盖
受保护的最终无效的onCreate（最终捆绑savedInstanceState）
{
super.onCreate（savedInstanceState）;
//让它全屏
// Desactiver拉巴里德滴度德圣母应用
requestWindowFeature（Window.FEATURE_NO_TITLE）;
//路人拉Fenêtre两家恩全creen == cacher的拉巴雷日的通知
getWindow（）。setFlags（WindowManager.LayoutParams.FLAG_FULLSCREEN，
WindowManager.LayoutParams.FLAG_FULLSCREEN）;
的setContentView（R.layout.activity_main）;
rlBG =（RelativeLayout的）findViewById（R.id.bg）;
rlBG.setPadding（0，0，0，0）;
最后CustomView CV =新CustomView（本）;
rlBG.addView（CV）;
sendViewToBack（CV）;
}
私有静态无效sendViewToBack（最终查看V）
{
最后的ViewGroup家长=（ViewGroup中）v.getParent（）;
如果（父！= NULL）
{
parent.removeView（五）;
parent.addView（五，0）;
}
}
私有类CustomView扩展视图
{
公共CustomView（最终上下文CTX）
{
超（CTX）;
}
@覆盖
受保护的最终无效的OnDraw（最终帆布CNV）
{
//
super.onDraw（CNV）;
//清除画布
cnv.drawRGB（0，0，0）;
//实例德漆倒définirL'attribut COULEUR德圣母点，
// AINSI阙山taille。
//奴斯allons dessiner号点相提并论关系点菜分辨率德
// L'ECRAN
最终诠释宽度= cnv.getWidth（）; // Largeur
最终诠释身高= cnv.getHeight（）; //豪特
最终浮rayonDuCercle =（浮点）（cnv.getWidth（）* .5） - 5;
最终浮rayonDuCerclePetit =（浮点）（cnv.getWidth（）* .167）;
//
drawStars（CNV，宽度，高度）;
//
drawRays（CNV，rayonDuCercle，rayonDuCerclePetit）;
//
drawCircles（CNV，宽度，高度，rayonDuCercle，rayonDuCerclePetit）;
}
私人最终无效drawCircles
（
最后帆布CNV，最终诠释宽度，最终诠释的高度，
最终浮动rayonDuCercle，最终浮动rayonDuCerclePetit
）
{
//
// aficchons巴黎fameux色格拉
pnt.setColor（Color.parseColor（＃FFFF0000））;
pnt.setStyle（Style.STROKE）;
pnt.setStrokeWidth（10）;
cnv.drawCircle（（浮动）（cnv.getWidth（）* .5），
（浮动）（cnv.getHeight（）* .5），rayonDuCercle，PNT）;
cnv.drawCircle（（浮动）（cnv.getWidth（）* .5），
（浮动）（cnv.getHeight（）* .5），rayonDuCerclePetit，PNT）;
// ???????????????????????????????????????????????? ????????????????
/ *
随机兰特=新的随机（）; // Affichons 100段德所有领域
莱COULEURS的for（int i = 0; I＆LT; 100;我++）{// Affecter UNE
传送彩色德manièrealéatoirepaint.setARGB（255，
rand.nextInt（256），rand.nextInt（256），rand.nextInt（256））; //
DéfinirL'épaisseur杜段paint.setStrokeWidth
（rand.nextInt（10））; // PUIS dessiner号点丹斯乐cavenas
canvas.drawLine（rand.nextInt（iWidth），rand.nextInt（IHEIGHT）
rand.nextInt（iWidth），rand.nextInt（IHEIGHT），漆）; }
* /
pnt.setARGB（255，rnd.nextInt（256），rnd.nextInt（256），
rnd.nextInt（256））;
//DéfinirL'épaisseur杜段
pnt.setStrokeWidth（2）;
// ???????????????????????????????????????????????? ????????????????
// PUIS dessiner号点丹斯乐cavenas
// okcanvas.drawLine（（浮动）（（浮点）Math.cos（0）* rayonDuCerclePetit）+ canvas.getWidth（）/ 2，
// canvas.getHeight（）/ 2，canvas.getWidth（）/ 2 + rayonDuCercle，
// canvas.getHeight（）/ 2，油漆）;
// okcanvas.drawLine（（浮动）（（浮点）Math.cos（Math.PI / 2）* rayonDuCerclePetit）+ canvas.getWidth（）/ 2，
// ((float)Math.sin(Math.PI/2)*rayonDuCerclePetit)+canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle*(float)Math.cos(Math.PI/2),
// rayonDuCercle *（浮点）Math.sin（Math.PI / 2）+ canvas.getHeight（）/ 2，
// 涂料）;
// okkk
// canvas.drawLine（（浮动）（（浮点）Math.cos（Math.PI / 4）* rayonDuCerclePetit）+ canvas.getWidth（）/ 2，
// ((float)Math.sin(Math.PI/4)*rayonDuCerclePetit)+canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle*(float)Math.cos(Math.PI/4),
// rayonDuCercle *（浮点）Math.sin（Math.PI / 4）+ canvas.getHeight（）/ 2，
// 涂料）;
// initPaint（油漆，）;
}
私人最终无效drawRays
（
最后帆布CNV，最终浮动rayonDuCercle，
最终浮动rayonDuCerclePetit
）
{
// pourquoi j'utilise 2 boucles？ Parce阙倒限制器和空间
//备忘录j'utilise乐即使得到canva等拉瑟差异恩特雷里奥斯CES
//德塞夫勒元素EST LA COULEUR。
// cette仿羔皮呢网站公告DES人造纤维
的for（int i = 8; I＆GT; -1; --i）
{
setRayon（CNV，（Math.PI * 0.25）*我，PNT，rayonDuCercle，
rayonDuCerclePetit）;
}
}
私人最终无效drawStars
（最终帆布CNV，最终诠释宽度，最终诠释高）
{
// J'AI L'IM pression detre丹斯莱ETOILES AVEC CES疫点
// Affichons（1/100的屏幕大小）分去所有领域莱COULEURS
最终诠释星=（INT）（（宽*高）* 0.01）;
的for（int i =明星; I＆GT; 0; --i）
{
// Affecter UNE COULEUR德manièrealéatoire
pnt.setARGB（255，rnd.nextInt（256），rnd.nextInt（256），
rnd.nextInt（256））;
// PUIS dessiner号点丹斯乐canevas
cnv.drawPoint（rnd.nextInt（宽），rnd.nextInt（高度），PNT）;
}
}
/ *
*信息倒入unen存在的阙J'AI PAS chercher一个COM prendre L'角
* positif s'affiche COMME SIc'été联合国法兰negatif。 Donc济bidouille
*恩multipliant L'角面值-1
* /
无效setRayon
（
最后帆布CNV，双angleRad，最终涂料PNT，
最终浮动rayonDuCercle，最终浮动rayonDuCerclePetit
）
{
angleRad =（Math.toRadians（90）+ angleRad）* -1;
cnv.drawLine
（
（（浮点）Math.cos（angleRad）* rayonDuCerclePetit）+
（浮动）（cnv.getWidth（）* .5），
（（浮点）Math.sin（angleRad）* rayonDuCerclePetit）+
（浮动）（cnv.getHeight（）* .5），
（浮动）（cnv.getWidth（）* .5）+（rayonDuCercle *
（浮点）Math.cos（angleRad）），
（rayonDuCercle *（浮点）Math.sin（angleRad））+
（浮动）（cnv.getHeight（）* .5），PNT
）;
}
}
}
I have to draw a circle with a number in each piece of my circle. My problem is i can't center the text where i want. Why the center to draw the text is not the same than the center to draw the line ???
the output of my software is the Link to the image : florianbrunet.com/forum/problemCentrer.png
/*enter code here
* Author : Florian Brunet
* date : 06/12/2013
* my website : florianbrunet.com
*
* enter code here
*/
package com.example.ando_dessin_test;
//merci a http://supertos.free.fr/supertos.php?page=1066
import java.util.Random;
import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.Align;
import android.graphics.Paint.Style;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Desactiver la barre de titre de notre application
requestWindowFeature(Window.FEATURE_NO_TITLE);
// Passer la fenêtre en full-creen == cacher la barre de notification
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(new RenderView(this));
}
// Création d'une classe interne RenderView pour gérer un affichage simple
// permettant
// de montrer que nous occupons bien tout l'écran
class RenderView extends View {
public RenderView(Context context) {
super(context);
}
// Dessinons sur la totalité de l'écran
protected void onDraw(Canvas canvas) {
canvas.drawRGB(0, 0, 0);
// Instance de Paint pour définir l'attribut couleur de notre point,
// ainsi que
// sa taille.
Paint paint = new Paint();
// Nous allons dessiner nos points par rapport à la résolution de
// l'écran
int iWidth = canvas.getWidth(); // Largeur
int iHeight = canvas.getHeight(); // Hauteur
// float radius = 0;//Radius caused an error so I initialized this
// variable
Random rand = new Random();
// j'ai l'impression detre dans les etoiles avec ces petits points
// Affichons 10000 points de toutes les couleurs
for (int i = 0; i < 10000; i++) {
// Affecter une couleur de manière aléatoire
paint.setARGB(255, rand.nextInt(256), rand.nextInt(256),
rand.nextInt(256));
// Puis dessiner nos points dans le canevas
canvas.drawPoint(rand.nextInt(iWidth), rand.nextInt(iHeight),
paint);
}
// aficchons notre fameux cercle
// Canvas canvas = new Canvas();
Paint circlePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
circlePaint.setColor(Color.RED);
circlePaint.setStyle(Style.STROKE);
circlePaint.setStrokeWidth(10);
float rayonDuCercle = canvas.getWidth() / 2;
canvas.drawCircle((float) canvas.getWidth() / 2,
(float) canvas.getHeight() / 2, rayonDuCercle, circlePaint);
float rayonDuCerclePetit = canvas.getWidth() / 6;
canvas.drawCircle((float) canvas.getWidth() / 2,
(float) canvas.getHeight() / 2, rayonDuCerclePetit,
circlePaint);
/*
* // Random rand = new Random(); //Affichons 100 segments de toutes
* les couleurs for (int i=0; i < 100; i++) { // Affecter une
* couleur de manière aléatoire paint.setARGB(255,
* rand.nextInt(256), rand.nextInt(256), rand.nextInt(256)); //
* Définir l'épaisseur du segment paint.setStrokeWidth
* (rand.nextInt(10)); // Puis dessiner nos points dans le cavenas
* canvas.drawLine(rand.nextInt(iWidth), rand.nextInt(iHeight),
* rand.nextInt(iWidth), rand.nextInt(iHeight), paint); }
*/
paint.setARGB(255, rand.nextInt(256), rand.nextInt(256),
rand.nextInt(256));
// Définir l'épaisseur du segment
paint.setStrokeWidth(2);
// Puis dessiner nos points dans le cavenas
// okcanvas.drawLine((float)((float)Math.cos(0)*rayonDuCerclePetit)+canvas.getWidth()/2,
// canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle,
// canvas.getHeight()/2, paint);
// okcanvas.drawLine((float)((float)Math.cos(Math.PI/2)*rayonDuCerclePetit)+canvas.getWidth()/2,
// ((float)Math.sin(Math.PI/2)*rayonDuCerclePetit)+canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle*(float)Math.cos(Math.PI/2),
// rayonDuCercle*(float)Math.sin(Math.PI/2)+canvas.getHeight()/2,
// paint);
// okkk
// canvas.drawLine((float)((float)Math.cos(Math.PI/4)*rayonDuCerclePetit)+canvas.getWidth()/2,
// ((float)Math.sin(Math.PI/4)*rayonDuCerclePetit)+canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle*(float)Math.cos(Math.PI/4),
// rayonDuCercle*(float)Math.sin(Math.PI/4)+canvas.getHeight()/2,
// paint);
// initPaint(paint,);
// pourquoi j'utilise 2 boucles ? Parce que pour limiter l'espace
// memoire j'utilise le même canva et la seul difference entre ces
// deux element est la couleur.
// cette boucle affiche des rayons
for (int i = 0; i < 8; i++) {
setRayon(canvas, (Math.PI / 4) * i, paint, rayonDuCercle,
rayonDuCerclePetit);
}
paint.setTextAlign(Align.RIGHT);
// cette boucle affichage du texte
for (int i = 1; i < 9; i++) {
setText(canvas, paint, String.valueOf(i), (Math.PI / 4) * i,
rayonDuCercle * 0.7, 80);
// si je suis le dernier element j'affiche le 9 du centre
if (i == 8) {
paint.setTextAlign(Align.CENTER);
setText(canvas, paint, String.valueOf(i + 1), (Math.PI / 4)
* i, rayonDuCercle * 0, 80);
}
}
}
/*
* info pour unen raison que j'ai pas chercher a comprendre l'angle
* positif s'affiche comme si c'été un ange negatif . Donc je bidouille
* en multipliant l'angle par -1
*/
void setRayon(Canvas canvas, double angleRad, Paint paint,
float rayonDuCercle, float rayonDuCerclePetit) {
// angleRad=angleRad*-1;
angleRad = (Math.toRadians((double) 70) + angleRad) * -1;
canvas.drawLine(
(float) ((float) Math.cos(angleRad) * rayonDuCerclePetit)
+ canvas.getWidth() / 2,
((float) Math.sin(angleRad) * rayonDuCerclePetit)
+ canvas.getHeight() / 2,
canvas.getWidth() / 2 + rayonDuCercle
* (float) Math.cos(angleRad),
rayonDuCercle * (float) Math.sin(angleRad)
+ canvas.getHeight() / 2, paint);
}
/*
* info pour unen raison que j'ai pas chercher a comprendre l'angle
* positif s'affiche comme si c'été un ange negatif . Donc je bidouille
* en multipliant l'angle par -1
*/
void setText(Canvas canvas, Paint paint, String Txt, double angleRad,
double rayonTxt, int sizeText) {
paint.setColor(Color.WHITE);
paint.setTextSize(sizeText);
angleRad = (Math.toRadians((double) 50) + angleRad) * -1;
// axe des ordonees enhaut a gauche -> canvas.drawText(Txt, (float)
// Math.cos(angleRad)*(float) rayonTxt,
// (float)Math.sin(angleRad)*(float) rayonTxt, paint);
// ligne suivante j'ai centree l'axe
canvas.drawText(Txt, (float) Math.cos(angleRad) * (float) rayonTxt
+ canvas.getWidth() / 2, (float) Math.sin(angleRad)
* (float) rayonTxt + canvas.getHeight() / 2, paint);
}
/*
* private void initPaint(Paint paint, Drawable drawable, float
* textHeight, float baselineOffset) { paint = new Paint();
* paint.setStyle(Paint.Style.STROKE); paint.setColor(Color.BLUE); paint
* = new Paint(); paint.setStyle(Paint.Style.FILL_AND_STROKE);
* paint.setAntiAlias(true); paint.setColor(Color.WHITE);
* paint.setTextSize(30); paint.setTextAlign(Align.CENTER); FontMetrics
* fontMetrics = paint.getFontMetrics(); baselineOffset =
* fontMetrics.bottom; // bottom is the maximum amount that the text
* descends // I'm not sure why this is different from descent...
* textHeight = fontMetrics.bottom - fontMetrics.top; // drawable =
* getResources().getDrawable(R.drawable.ic_launcher); }
*/
}
}
解决方案
I'm having a lot of fun with answering this question, here's my last effort:
The first image is just for testing and determinig the empyrical values of the extra padding; the second one is the final product after removing the extra code.
The illusion of circularity is nearly perfect (enough for human eye, I guess)
Here is the modified layout, activity_main.xml:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:background="#f000"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity"
android:id="@+id/bg"
>
<TextView
android:id="@+id/txt9"
android:layout_width="160dp"
android:layout_height="160dp"
android:layout_centerInParent="true"
android:gravity="center"
android:text="9"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
<TextView
android:id="@+id/txt1"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_above="@id/txt9"
android:layout_alignLeft="@id/txt9"
android:paddingRight="12dp"
android:paddingTop="12dp"
android:gravity="center"
android:text="1"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
<TextView
android:id="@+id/txt8"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignTop="@id/txt1"
android:layout_toRightOf="@id/txt1"
android:paddingLeft="12dp"
android:paddingTop="12dp"
android:gravity="center"
android:text="8"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
<TextView
android:id="@+id/txt2"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignTop="@id/txt9"
android:layout_toLeftOf="@id/txt9"
android:paddingLeft="12dp"
android:paddingBottom="12dp"
android:gravity="center"
android:text="2"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
<TextView
android:id="@+id/txt3"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_below="@id/txt2"
android:layout_toLeftOf="@id/txt9"
android:paddingLeft="12dp"
android:paddingTop="12dp"
android:gravity="center"
android:text="3"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
<TextView
android:id="@+id/txt4"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_below="@id/txt9"
android:layout_alignLeft="@id/txt9"
android:paddingRight="12dp"
android:paddingBottom="12dp"
android:gravity="center"
android:text="4"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
<TextView
android:id="@+id/txt5"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignTop="@id/txt4"
android:layout_toRightOf="@id/txt4"
android:paddingLeft="12dp"
android:paddingBottom="12dp"
android:gravity="center"
android:text="5"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
<TextView
android:id="@+id/txt7"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignTop="@id/txt9"
android:layout_toRightOf="@id/txt9"
android:paddingRight="12dp"
android:paddingBottom="12dp"
android:gravity="center"
android:text="7"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
<TextView
android:id="@+id/txt6"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_below="@id/txt7"
android:layout_toRightOf="@id/txt9"
android:paddingRight="12dp"
android:paddingTop="12dp"
android:gravity="center"
android:text="6"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="#ffff"
/>
</RelativeLayout>
This is the updated code (you'll get even more optimizations), MainActivity.java
package com.example.numbers;
import java.util.Random;
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.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.WindowManager;
import android.widget.RelativeLayout;
public class MainActivity
extends Activity
{
final Paint pnt = new Paint(Paint.ANTI_ALIAS_FLAG);
final Random rnd = new Random();
RelativeLayout rlBG;
@Override
protected final void onCreate(final Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
// Make it fullscreen
// Desactiver la barre de titre de notre application
requestWindowFeature(Window.FEATURE_NO_TITLE);
// Passer la fenêtre en full-creen == cacher la barre de notification
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_main);
rlBG = (RelativeLayout) findViewById(R.id.bg);
rlBG.setPadding(0, 0, 0, 0);
final CustomView cv = new CustomView(this);
rlBG.addView(cv);
sendViewToBack(cv);
}
private static void sendViewToBack(final View v)
{
final ViewGroup parent = (ViewGroup)v.getParent();
if (parent != null)
{
parent.removeView(v);
parent.addView(v, 0);
}
}
private class CustomView extends View
{
public CustomView(final Context ctx)
{
super(ctx);
}
@Override
protected final void onDraw(final Canvas cnv)
{
//
super.onDraw(cnv);
// Clear the canvas
cnv.drawRGB(0, 0, 0);
// Instance de Paint pour définir l'attribut couleur de notre point,
// ainsi que sa taille.
// Nous allons dessiner nos points par rapport à la résolution de
// l'écran
final int width = cnv.getWidth(); // Largeur
final int height = cnv.getHeight(); // Hauteur
final float rayonDuCercle = (float) (cnv.getWidth() *.5) - 5;
final float rayonDuCerclePetit = (float) (cnv.getWidth() * .167);
//
drawStars(cnv, width, height);
//
drawRays(cnv, rayonDuCercle, rayonDuCerclePetit);
//
drawCircles(cnv, width, height, rayonDuCercle, rayonDuCerclePetit);
}
private final void drawCircles
(
final Canvas cnv, final int width, final int height,
final float rayonDuCercle, final float rayonDuCerclePetit
)
{
//
// aficchons notre fameux cercle
pnt.setColor(Color.parseColor("#ffff0000"));
pnt.setStyle(Style.STROKE);
pnt.setStrokeWidth(10);
cnv.drawCircle((float) (cnv.getWidth() * .5),
(float) (cnv.getHeight() * .5), rayonDuCercle, pnt);
cnv.drawCircle((float) (cnv.getWidth() * .5),
(float) (cnv.getHeight() * .5), rayonDuCerclePetit, pnt);
// ????????????????????????????????????????????????????????????????
/*
Random rand = new Random(); //Affichons 100 segments de toutes
les couleurs for (int i=0; i < 100; i++) { // Affecter une
couleur de manière aléatoire paint.setARGB(255,
rand.nextInt(256), rand.nextInt(256), rand.nextInt(256)); //
Définir l'épaisseur du segment paint.setStrokeWidth
(rand.nextInt(10)); // Puis dessiner nos points dans le cavenas
canvas.drawLine(rand.nextInt(iWidth), rand.nextInt(iHeight),
rand.nextInt(iWidth), rand.nextInt(iHeight), paint); }
*/
pnt.setARGB(255, rnd.nextInt(256), rnd.nextInt(256),
rnd.nextInt(256));
// Définir l'épaisseur du segment
pnt.setStrokeWidth(2);
// ????????????????????????????????????????????????????????????????
// Puis dessiner nos points dans le cavenas
// okcanvas.drawLine((float)((float)Math.cos(0)*rayonDuCerclePetit)+canvas.getWidth()/2,
// canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle,
// canvas.getHeight()/2, paint);
// okcanvas.drawLine((float)((float)Math.cos(Math.PI/2)*rayonDuCerclePetit)+canvas.getWidth()/2,
// ((float)Math.sin(Math.PI/2)*rayonDuCerclePetit)+canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle*(float)Math.cos(Math.PI/2),
// rayonDuCercle*(float)Math.sin(Math.PI/2)+canvas.getHeight()/2,
// paint);
// okkk
// canvas.drawLine((float)((float)Math.cos(Math.PI/4)*rayonDuCerclePetit)+canvas.getWidth()/2,
// ((float)Math.sin(Math.PI/4)*rayonDuCerclePetit)+canvas.getHeight()/2,canvas.getWidth()/2+rayonDuCercle*(float)Math.cos(Math.PI/4),
// rayonDuCercle*(float)Math.sin(Math.PI/4)+canvas.getHeight()/2,
// paint);
// initPaint(paint,);
}
private final void drawRays
(
final Canvas cnv, final float rayonDuCercle,
final float rayonDuCerclePetit
)
{
// pourquoi j'utilise 2 boucles ? Parce que pour limiter l'espace
// memoire j'utilise le même canva et la seul difference entre ces
// deux element est la couleur.
// cette boucle affiche des rayons
for (int i = 8; i > -1; --i)
{
setRayon(cnv, (Math.PI * .25) * i, pnt, rayonDuCercle,
rayonDuCerclePetit);
}
}
private final void drawStars
(final Canvas cnv, final int width, final int height)
{
// j'ai l'impression detre dans les etoiles avec ces petits points
// Affichons (1/100th of screen size) points de toutes les couleurs
final int stars = (int) ((width * height) *.01);
for (int i = stars; i > 0; --i)
{
// Affecter une couleur de manière aléatoire
pnt.setARGB(255, rnd.nextInt(256), rnd.nextInt(256),
rnd.nextInt(256));
// Puis dessiner nos points dans le canevas
cnv.drawPoint(rnd.nextInt(width), rnd.nextInt(height), pnt);
}
}
/*
* info pour unen raison que j'ai pas chercher a comprendre l'angle
* positif s'affiche comme si c'été un ange negatif . Donc je bidouille
* en multipliant l'angle par -1
*/
void setRayon
(
final Canvas cnv, double angleRad, final Paint pnt,
final float rayonDuCercle, final float rayonDuCerclePetit
)
{
angleRad = (Math.toRadians(90) + angleRad) * -1;
cnv.drawLine
(
((float) Math.cos(angleRad) * rayonDuCerclePetit) +
(float) (cnv.getWidth() * .5),
((float) Math.sin(angleRad) * rayonDuCerclePetit) +
(float) (cnv.getHeight() * .5),
(float) (cnv.getWidth() * .5) + (rayonDuCercle *
(float) Math.cos(angleRad)),
(rayonDuCercle * (float) Math.sin(angleRad)) +
(float) (cnv.getHeight() * .5), pnt
);
}
}
}
这篇关于中心圈的文字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
