android. graphics 패키지 의 일부 클래스 사용
블 로그 분류:
android
Canvas Region Path SurfaceView android game
게임 프로 그래 밍 관련 참고
매트릭스 학습 시리즈:
http://www.moandroid.com/?p=1781
Android 그림 학습 총화 시리즈:
http://www.moandroid.com/?p=764
게임 개발 시리즈 (opengl es 기초 지식):
http://www.moandroid.com/?p=17
30
선형 대수 (행렬 에 관 한 지식 포함):
http://dl.iteye.com/topics/download/b56a388a-3408-3179-972b-3a72bdbaaa28
러시아 블록 의 실현 (c \ # silverlignth 실현):
http://www.cnblogs.com/crazy-dave/archive/2011/05/20/Silverlight_Tetris1.html
Surface View 사용 참고:
http://kb.cnblogs.com/page/80095/
http://blog.csdn.net/hellogv/article/details/5986835
http://www.cnblogs.com/xuling/archive/2011/06/06/android.html
2d 게임 프로 그래 밍 학습
러시아 블록 부터:
아직 완벽 해 야 할 부분:
1. 320 x480 화면 에서 만 화면 이 정상 이 고 다 중 화면 을 호 환 하지 않 았 습 니 다.
2. View 로 그립 니 다. Surface View 로 그립 니 다.
3. 기능 이 빈약 하여 주요 내용 만 실현
4. 이동 할 때 프레임 을 뛰 어 넘 는 현상 이 나타 날 수 있 습 니 다. 주로 다시 그 리 는 것 은 view 가 스스로 실행 하 는 것 이 고 onKey 에서 이동 하지 않 고 다시 그 리 는 것 입 니 다. 그러면 두 번 이동 하고 한 번 만 그 렸 을 때 프레임 을 뛰 어 넘 을 수 있 습 니 다.
...
소스 코드 (러시아 블록 의 코드 는 game. tetris 가방 에 있 고 다른 가방 의 내용 은 모두 학습 테스트 코드):http://dl.iteye.com/topics/download/4f8ef46f-e5fb-3724-9561-480179a8651c
지역
Rect 와 달리 불규칙 한 모습 을 나타 내 며 타원, 다각형 등 을 나 타 낼 수 있 으 며 Rect 는 직사각형 에 불과 하 다.
Region region = new Region();
region.isEmpty();
// width: 100, height: 50
region.set(100, 100, 200, 150);
Rect bounds = region.getBounds();
//
boolean contains = region.quickContains(120, 120, 170, 150);
//
boolean reject = region.quickReject(0, 0, 50, 50);
// INTERSECT
Region r2 = new Region(region);
r2.op(0, 0, 150, 120, Region.Op.INTERSECT);
// DIFFERENCE
r2 = new Region(region);
r2.op(0, 0, 150, 120, Region.Op.DIFFERENCE);
// REPLACE
r2 = new Region(region);
r2.op(0, 0, 150, 120, Region.Op.REPLACE);
// REVERSE_DIFFERENCE
r2 = new Region(region);
r2.op(0, 0, 150, 120, Region.Op.REVERSE_DIFFERENCE);
// UNION
r2 = new Region(region);
r2.op(0, 0, 150, 120, Region.Op.UNION);
// XOR ,
r2 = new Region(region);
r2.op(0, 0, 150, 120, Region.Op.XOR);
설명도
Path
path 는 점 집합 으로 볼 수 있 으 며, 내부 의 점 집합 을 순서대로 연결 할 때 임의의 변 형 을 구성 할 수 있 습 니 다.보통 다각형 은 Path 로 그립 니 다.
//
Path pathToDraw = new Path();
//
pathToDraw.moveTo(50, 50);
pathToDraw.lineTo(100, 50);
pathToDraw.lineTo(150, 100);
pathToDraw.lineTo(50, 100);
//
pathToDraw.lineTo(100, 75);
pathToDraw.close();
// ,
pathToDraw.addCircle(50, 100, <span style="background-color: rgb(255, 102, 255);">30</span>, <a target=_blank name="baidusnap0" style="color: rgb(16, 138, 198); text-decoration: underline;"></a><span style="background-color: rgb(255, 255, 102);">Path.</span>Direction.CCW);
// ,
pathToDraw.addCircle(50, 100, <span style="background-color: rgb(255, 102, 255);">30</span>, <span style="background-color: rgb(255, 255, 102);">Path.</span>Direction.CW);
// ,
pathToDraw.addCircle(50, 100, <span style="background-color: rgb(255, 102, 255);">30</span>, <span style="background-color: rgb(255, 255, 102);">Path.</span>Direction.CCW);
pathToDraw.close();
// ,
pathToDraw.addCircle(50, 100, <span style="background-color: rgb(255, 102, 255);">30</span>, <span style="background-color: rgb(255, 255, 102);">Path.</span>Direction.CW);
pathToDraw.close();
//
// , , ,
pathToDraw.addArc(new RectF(25, 75, 55, 155), 0, 270);
// , rectf , lineTo ( , )
pathToDraw.arcTo(new RectF(25, 75, 55, 155), 0, 270);
// , (25, 125), (75, 175)
pathToDraw.cubicTo(25, 125, 75, 175, <span style="background-color: rgb(255, 102, 255);">30</span>, 200);
// , (25, 125), (75, 175), (<span style="background-color: rgb(255, 102, 255);">30</span>, 200)
pathToDraw.cubicTo(25, 125, 75, 175, <span style="background-color: rgb(255, 102, 255);">30</span>, 200);
Path. Fill Type 의 힘 충전 유형 은 아직 이해 되 지 않 습 니 다. 주로 문서 가 이에 대해 아무런 설명 을 하지 않 았 기 때 문 입 니 다. api demo 는 코드 만 있 고 무슨 뜻 인지 모 릅 니 다.인터넷 에서 찾 아 봐 도 설명 이 안 돼.이 연결 을 볼 수 있 습 니 다:http://www.imobilebbs.com/wordpress/?p=1589
Bitmap
Bitmap 의 density 매개 변수 사용
// (0, 0)
canvas.drawBitmap(mBmp, 0, 0, null);
// 240(hdpi) 160 , 1.5
mBmp.setDensity(240);
// (100, 0)
canvas.drawBitmap(mBmp, 100, 0, null);
// (0, 100), 100、 100
canvas.drawBitmap(mBmp, null, new Rect(0, 100, 100, 200), null);
// (0, 0) 100、 100 (100, 100) 100, 50
canvas.drawBitmap(mBmp, new Rect(0, 0, 100, 50), new Rect(100, 100, 200, 150), null);
// (0, 0) 100、 100 (200, 100) 50, 25
canvas.drawBitmap(mBmp, new Rect(0, 0, 100, 50), new Rect(200, 100, 250, 125), null);
효과:
최종 결론: bitmap. setDensity 는 원본 그림 에 영향 을 주지 않 습 니 다. 다만 그 릴 때 canvas 는 이 density 에 따라 그림 을 크기 조정 하여 그립 니 다.
페인트 소개
Paint 는 바로 붓 으로 그림 을 그 리 는 과정 에서 매우 중요 한 역할 을 했 고 붓 은 주로 색깔 을 보존 했다.
스타일 등 정 보 를 그립 니 다. 텍스트 와 도형 을 그 리 는 방법 을 지정 합 니 다. 붓 대상 은 설정 방법 이 많 습 니 다.
크게 두 가지 로 나 눌 수 있 는데 하 나 는 도형 그리 기와 관련 되 고 하 나 는 텍스트 그리 기와 관련 이 있다.
1.
setARGB(int a,int r,int g,int b);
,a ,r,g,b 。
setAlpha(int a);
。
setColor(int color);
, , RGB 。
setAntiAlias(boolean aa);
, , 。
setDither(boolean dither);
, ,
setFilterBitmap(boolean filter);
true, Bitmap ,
, dither xfermode
setMaskFilter(MaskFilter maskfilter);
MaskFilter, MaskFilter , ,
setColorFilter(ColorFilter colorfilter);
,
setPathEffect(PathEffect effect);
,
setShader(Shader shader);
, Shader
setShadowLayer(float radius ,float dx,float dy,int color);
, ,radius ,dx dy x y ,color
setStyle(Paint.Style style);
, FILL,FILL_OR_STROKE, STROKE
setStrokeCap(Paint.Cap cap);
STROKE FILL_OR_STROKE , ,
Cap.ROUND, Cap.SQUARE
setSrokeJoin(Paint.Join join);
,
setStrokeWidth(float width);
STROKE FILL_OR_STROKE ,
setXfermode(Xfermode xfermode);
, , ,
2.
setFakeBoldText(boolean fakeBoldText);
,
setSubpixelText(boolean subpixelText);
true, LCD
setTextAlign(Paint.Align align);
setTextScaleX(float scaleX);
x ,
setTextSize(float textSize);
setTextSkewX(float skewX);
,skewX
setTypeface(Typeface typeface);
Typeface , , , ,
setUnderlineText(boolean underlineText);
setStrikeThruText(boolean strikeThruText);
Paint 류 와 관련 된 몇 가지 매 거 진: (msdn 에서 베 낀 msdn 의 문 서 는 역시 안 드 로 이 드 문서 보다 n 배 상세 합 니 다.http://msdn.microsoft.com/en-us/library/cc294944.aspx)
Paint. Cap 터치 매 거 진 을 어떻게 끝 냅 니까?
Paint. Join path 의 모퉁이 를 어떻게 그립 니까?
Canvas 의 기본 사용
톱날 저항 관련 참고:http://www.iteye.com/topic/794505
컬러 채 우기, 보통 클 리 어 할 때 여기 쓰 는 방법.
switch (keyUpCount) {
case 0:
canvas.drawARGB(100, 255, 0, 0);
break;
case 1:
canvas.drawColor(Color.argb(100, 0, 255, 0));
break;
case 2:
// PorterDuff mode
canvas.drawColor(Color.argb(100, 0, 0, 255), Mode.SRC);
break;
case 3:
// paint
Paint paint = new Paint();
paint.setARGB(100, 0xEE, 0xEE, 0xEE);
canvas.drawPaint(paint);
break;
}
비트 맵 그리 기
switch (keyUpCount) {
case 0: // (x, y) bitmap
canvas.drawBitmap(chameleonBmp, 20, 20, null);
break;
case 1: // bimap
Matrix matrix = new Matrix();
matrix.setRotate(10);
matrix.preTranslate(50, 50);
canvas.drawBitmap(chameleonBmp, matrix, null);
break;
case 2:
// (0, 0, 100, 184) canvas
// (50, 50, 250, 418)
Rect src = new Rect();
src.set(0, 0, 100, 184);
Rect dst = new Rect();
dst.set(50, 50, 250, 418);
canvas.drawBitmap(chameleonBmp, src, dst, null);
// canvas.drawBitmap(Bitmap, Rect, RectF, Paint);
// RectF Rect float
break;
case 3:
// bitmap , canvas
// 200x200 bitmap, 40000
int[] bmpPixels = new int[] {
Color.RED, Color.RED, Color.RED, Color.RED, Color.RED,
Color.RED, Color.RED, Color.RED, Color.RED, Color.RED,
Color.RED, Color.RED, Color.RED, Color.RED, Color.RED,
Color.GREEN, Color.GREEN, Color.GREEN, Color.GREEN, Color.GREEN,
Color.GREEN, Color.GREEN, Color.GREEN, Color.GREEN, Color.GREEN,
Color.GREEN, Color.GREEN, Color.GREEN, Color.GREEN, Color.GREEN,
Color.BLUE, Color.BLUE, Color.BLUE, Color.BLUE, Color.BLUE,
Color.BLUE, Color.BLUE, Color.BLUE, Color.BLUE, Color.BLUE,
Color.BLUE, Color.BLUE, Color.BLUE, Color.BLUE, Color.BLUE
};
canvas.drawBitmap(bmpPixels, 0, 15, 20, 20, 15, 3, false, null);
break;
}
기본 기하학 적 도형 그리 기 (기하학 적 도형 을 그 릴 때 는 반드시 붓 paint 를 사용 해 야 합 니 다)
Paint paint = new Paint();
paint.setColor(Color.RED); //
paint.setAntiAlias(true); //
paint.setStyle(Paint.Style.STROKE); //
paint.setStrokeWidth(3); //
switch (keyUpCount) {
case 0: //
for (int i = 1; i <= 10; i<a target=_blank name="baidusnap9" style="color: rgb(16, 138, 198); text-decoration: underline;"></a><span style="color: white; background-color: rgb(153, 0, 153);">++</span>) {
canvas.drawPoint(i * 10, 20, paint);
}
break;
case 1: //
for (int i = 1; i < 10; i<span style="color: white; background-color: rgb(153, 0, 153);">++</span>) {
canvas.drawLine(10, i * 10, 200, i * 10, paint);
}
break;
case 2: //
canvas.drawCircle(100, 100, 90, paint);
break;
case 3: //
RectF outRect = new RectF(10, 10, 110, 110);
canvas.drawRect(outRect, paint);
float startAngle = 70;
float sweepAngle = 180;
canvas.drawArc(outRect, startAngle, sweepAngle, false, paint);
break;
case 4: //
canvas.drawOval(new RectF(10, 10, 110, 60), paint);
break;
case 5: // ( )
Path path = new Path();
<span style="background-color: rgb(255, 255, 102);">path.</span>moveTo(10, 10);
<span style="background-color: rgb(255, 255, 102);">path.</span>lineTo(200, 10);
<span style="background-color: rgb(255, 255, 102);">path.</span>lineTo(140, 60);
<span style="background-color: rgb(255, 255, 102);">path.</span>lineTo(120, <span style="background-color: rgb(255, 102, 255);">30</span>);
canvas.drawPath(path, paint);
break;
case 6: //
RectF rect = new RectF(10, 10, 100, 100);
canvas.drawRoundRect(rect, 20, 40, paint);
break;
}
canvas 의 일부 효과
뒤 집기 효 과 는 그림 을 사용 할 때 왼쪽 과 오른쪽 그림 을 다시 사용 할 수 있 습 니 다.
Bitmap bmp = BitmapFactory.decodeResource(res, R.drawable.image8<span style="background-color: rgb(255, 102, 255);">30</span>);
canvas.drawColor(Color.WHITE);
canvas.drawBitmap(bmp, 100, 160, null);
//
canvas.save();
canvas.scale(-1, 1, 240, 160);
canvas.drawBitmap(bmp, 240, 160, null);
canvas.restore();
//
canvas.save();
canvas.scale(1, -1, <span style="background-color: rgb(255, 102, 255);">30</span>0, 160);
canvas.drawBitmap(bmp, <span style="background-color: rgb(255, 102, 255);">30</span>0, 160, null);
canvas.restore();
텍스트 그리 기
Paint. Align 텍스트 를 어떻게 그립 니까 (x, y)
첫 번 째 는 (x, y) 텍스트 왼쪽 에 있 습 니 다.두 번 째 는 (x, y) 텍스트 중간 에 있 는 것 입 니 다.세 번 째 는 (x, y) 텍스트 의 오른쪽 에 있 습 니 다.그러나 그들 은 모두 canvas. drawText ("...", x, y, paint) 이다.그냥 페인트 설정 이 달라 졌어 요.
Paint. FontMetrics: 글꼴 메타 데이터
다음 그림 은 이 부분 과 관련 된 조판 용어 에 대한 도형 설명 입 니 다.
Paint. FontMetrics. top: 어떤 글꼴 에서 기선 이상 의 최대 거리 (ascent 의 최대 값)
Paint. FontMetrics. bottom: 어떤 글꼴 에서 기선 이하 의 최대 거리 (바로 descent 의 최소 값)
Paint paint = new Paint();
paint.setColor(Color.RED); //
paint.setAntiAlias(true); //
paint.setStyle(Style.STROKE); //
paint.setTextSize(<span style="background-color: rgb(255, 102, 255);">30</span>); //
switch (keyUpCount) {
case 0: //
Paint paint0 = new Paint(paint);
paint0.setUnderlineText(true);
canvas.drawText("underline text", 10, 50, paint0);
break;
case 1: // x
Paint paint1 = new Paint(paint);
paint1.setTextSkewX(-0.3F);
char[] chars = "text skew x".toCharArray();
canvas.drawText(chars, 0, chars.length, 10, 50, paint1);
break;
case 2: //
Paint paint2 = new Paint(paint);
paint2.setTextScaleX(3.0F);
paint2.setTextSize(15);
canvas.drawText("text scale x", 0, 12, 10, 50, paint2);
break;
case 3: //
Paint paint3 = new Paint(paint);
paint3.setTextSize(45);
paint3.setColor(Color.BLUE);
Typeface shift = Typeface.createFromAsset(getAssets(), "fonts/Shift.ttf");
paint3.setTypeface(shift);
canvas.drawText("Shift.ttf", 0, 9, 10, 50, paint3);
/* font attributes
Paint.FontMetrics fontMetrics = paint3.getFontMetrics();
fontMetrics.ascent;
paint3.ascent();
fontMetrics.descent;
paint3.descent();
fontMetrics.leading;
fontMetrics.top;
fontMetrics.bottom;
*/
break;
case 4: //
String text = "abcdefghijklmnOPQRST12345";
Paint paint4 = new Paint();
paint4.setColor(Color.BLUE);
paint4.setStyle(Style.STROKE);
// draw path
Path path = new Path();
<span style="background-color: rgb(255, 255, 102);">path.</span>moveTo(10, 100);
<span style="background-color: rgb(255, 255, 102);">path.</span>cubicTo(110, 200, 210, 0, 310, 100);
canvas.drawPath(path, paint4);
// draw text
paint.setTextSize(20);
canvas.drawTextOnPath(text, path, 20.0F, 5.0F, paint);
break;
canvas 변환, save, restore, layer 사용
layer 는 사실 포 토 샵 의 그림 층 개념 에 해당 하 며 현재 그림 층 의 조작 은 다른 그림 층 에 영향 을 주지 않 습 니 다.
Paint paint = new Paint();
paint.setColor(Color.RED);
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(3);
switch (keyUpCount) {
case 0: // rotate
canvas.rotate(20);
canvas.drawRect(10, 10, <span style="background-color: rgb(255, 102, 255);">30</span>0, 210, paint);
break;
case 1: // translate
canvas.translate(100, 0);
canvas.drawRect(10, 10, <span style="background-color: rgb(255, 102, 255);">30</span>0, 210, paint);
break;
case 2: // skew
canvas.skew(0.2F, 0);
canvas.drawRect(10, 10, <span style="background-color: rgb(255, 102, 255);">30</span>0, 210, paint);
break;
case 3: //
canvas.scale(0.5F, 1);
canvas.drawRect(10, 10, <span style="background-color: rgb(255, 102, 255);">30</span>0, 210, paint);
break;
case 4: // save, restore
canvas.rotate(20);
canvas.drawRect(10, 10, 60, 60, paint);
canvas.translate(50, 0);
canvas.drawRect(10, 10, 70, 70, paint);
break;
case 5: // save, restore
int saveCount = canvas.save();
// 20 , 20
canvas.rotate(20);
canvas.drawRect(10, 10, 60, 60, paint);
// canvas rotate
canvas.restoreToCount(saveCount);
canvas.translate(50, 0);
canvas.drawRect(10, 10, 70, 70, paint);
break;
case 6: //
paint.setStyle(Paint.Style.FILL);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.LIGHTEN));
canvas.drawRect(0, 0, 100, 100, paint);
canvas.drawRect(100, 100, 200, 200, paint);
paint.setColor(Color.BLUE);
canvas.drawRect(50, 50, 150, 150, paint);
break;
case 7: // layer
paint.setStyle(Paint.Style.FILL);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.LIGHTEN));
canvas.drawRect(0, 0, 100, 100, paint);
//
int layerSC = canvas.saveLayer(null, null,
Canvas.MATRIX_SAVE_FLAG | // ,restore
Canvas.HAS_ALPHA_LAYER_SAVE_FLAG |
Canvas.FULL_COLOR_LAYER_SAVE_FLAG);
canvas.translate(100, 100);
canvas.drawRect(0, 0, 100, 100, paint);
paint.setColor(Color.BLUE);
canvas.translate(-50, -50);
canvas.drawRect(0, 0, 100, 100, paint);
canvas.restoreToCount(layerSC); //
break;
선형 대수 칭 화 제2 판. pdf (4.2 MB)
다운로드 횟수: 65 demo_game.rar (397.6 KB)
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Is Eclipse IDE dying?In 2014 the Eclipse IDE is the leading development environment for Java with a market share of approximately 65%. but ac...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.