custom widget 2 unit 27 로봇 sw 콘텐츠 교육원 조용수. 학습 목표 custom widget canvas...

15
Custom Widget 2 UNIT 27 로로 SW 로로로 로로로 로로로

Upload: annabelle-pope

Post on 18-Jan-2018

222 views

Category:

Documents


0 download

DESCRIPTION

Custom View 의 기본 구조 : 생성자 3 public class ControllerView extends View { // 소스에서 직접 생성한 경우 호출되는 생성자 public ControllerView(Context context) { super(context); // TODO Auto-generated constructor stub } // 리소스 XML 에서 생성하게 될 경우 호출되는 생성자 public ControllerView(Context context, AttributeSet attrs) { super(context, attrs); // TODO Auto-generated constructor stub } // 리소스 XML 에서 생성하게 될 경우 호출되는 생성자, Default Style 파라메타 추가 public ControllerView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); // TODO Auto-generated constructor stub }

TRANSCRIPT

Page 1: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

Custom Widget 2UNIT

27

로봇 SW 콘텐츠 교육원조용수

Page 2: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

2학습 목표

• Custom Widget – Canvas 를 이용하여 Custom Widget 을 만든다 .

Page 3: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

3Custom View 의 기본 구조 : 생성자

public class ControllerView extends View {

// 소스에서 직접 생성한 경우 호출되는 생성자 public ControllerView(Context context) {

super(context);// TODO Auto-generated constructor stub

}// 리소스 XML 에서 생성하게 될 경우 호출되는 생성자 public ControllerView(Context context, AttributeSet attrs) {

super(context, attrs);// TODO Auto-generated constructor stub

}// 리소스 XML 에서 생성하게 될 경우 호출되는 생성자 , Default Style 파라메타 추가 public ControllerView(Context context, AttributeSet attrs, int defStyle) {

super(context, attrs, defStyle);// TODO Auto-generated constructor stub

}

Page 4: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

4Custom View 의 기본 구조 : 크기설정int heightSize = 0; int widthSize = 0; @Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

// TODO Auto-generated method stubint heightMode = MeasureSpec.getMode(heightMeasureSpec);switch(heightMode) {case MeasureSpec.UNSPECIFIED: // mode 가 셋팅되지 않은 크기가 넘어올때 or Fixed Size

heightSize = heightMeasureSpec;break;

case MeasureSpec.AT_MOST: // wrap_content ( 뷰 내부의 크기에 따라 크기가 달라짐 ) heightSize = 300; break; case MeasureSpec.EXACTLY: // fill_parent, match_parent ( 외부에서 이미 크기가 지정 ) heightSize = MeasureSpec.getSize(heightMeasureSpec); break;

} int widthMode = MeasureSpec.getMode(widthMeasureSpec); switch(widthMode) { case MeasureSpec.UNSPECIFIED: // mode 가 셋팅되지 않은 크기가 넘어올때 widthSize = widthMeasureSpec; break; case MeasureSpec.AT_MOST

widthSize = 300; break; case MeasureSpec.EXACTLY:

widthSize = MeasureSpec.getSize(widthMeasureSpec); break; } setMeasuredDimension(widthSize, heightSize);}

Page 5: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

5Custom View 의 기본 구조 : 터치@Overridepublic boolean onTouchEvent(MotionEvent event) {

// TODO Auto-generated method stubswitch(event.getAction()) {

case MotionEvent.ACTION_UP:invalidate();

break; case MotionEvent.ACTION_DOWN:

invalidate(); break; case MotionEvent.ACTION_MOVE: invalidate(); break; }

return true;}

Page 6: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

6onDraw

PointF pTouchPoint ;PointF pOldTouchPoint ;@Overrideprotected void onDraw(Canvas canvas) {

// TODO Auto-generated method stubfinal Paint pCenter = new Paint();pCenter.setColor(Color.YELLOW);

canvas.drawColor(Color.BLACK);

canvas.drawLine(0, heightSize/2, widthSize, heightSize/2, pCenter);canvas.drawLine(widthSize/2, 0, widthSize/2, heightSize, pCenter);

if(pTouchPoint.x > 0 && pTouchPoint.y > 0) {canvas.drawCircle(pTouchPoint.x, pTouchPoint.y, 200, pCenter);

}

}

Page 7: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

7좌표 처리

@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

…pTouchPoint = new PointF(widthSize/2, heightSize/2);

pOldTouchPoint = new PointF(widthSize/2, heightSize/2);setMeasuredDimension(widthSize, heightSize);

}

private final int TOUCH_OFFSET = 10;@Overridepublic boolean onTouchEvent(MotionEvent event) {

// TODO Auto-generated method stubswitch(event.getAction()) {

case MotionEvent.ACTION_UP: pOldTouchPoint.x = pTouchPoint.x = widthSize/2; pOldTouchPoint.y = pTouchPoint.y = heightSize/2; invalidate(); break;

Page 8: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

8좌표 처리

case MotionEvent.ACTION_DOWN: pTouchPoint.x = event.getX(); pTouchPoint.y = event.getY(); pOldTouchPoint.x = pTouchPoint.x; pOldTouchPoint.y = pTouchPoint.y; invalidate(); break; case MotionEvent.ACTION_MOVE: pTouchPoint.x = event.getX(); pTouchPoint.y = event.getY(); if(Math.abs(pTouchPoint.x - pOldTouchPoint.x) > TOUCH_OFFSET || Math.abs(pTouchPoint.y - pOldTouchPoint.y) > TOUCH_OFFSET ) {

pOldTouchPoint.x = pTouchPoint.x; pOldTouchPoint.y = pTouchPoint.y; } invalidate(); break; }

return true;}

Page 9: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

9좌표 처리

case MotionEvent.ACTION_DOWN: pTouchPoint.x = event.getX(); pTouchPoint.y = event.getY(); pOldTouchPoint.x = pTouchPoint.x; pOldTouchPoint.y = pTouchPoint.y; invalidate(); break; case MotionEvent.ACTION_MOVE: pTouchPoint.x = event.getX(); pTouchPoint.y = event.getY(); if(Math.abs(pTouchPoint.x - pOldTouchPoint.x) > TOUCH_OFFSET || Math.abs(pTouchPoint.y - pOldTouchPoint.y) > TOUCH_OFFSET ) {

pOldTouchPoint.x = pTouchPoint.x; pOldTouchPoint.y = pTouchPoint.y; } invalidate(); break; }

return true;}

Page 10: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

10onDraw 에 반영

PointF pTouchPoint ;PointF pOldTouchPoint ;@Overrideprotected void onDraw(Canvas canvas) {

// TODO Auto-generated method stubfinal Paint pCenter = new Paint();pCenter.setColor(Color.YELLOW);

canvas.drawColor(Color.BLACK);

canvas.drawLine(0, heightSize/2, widthSize, heightSize/2, pCenter);canvas.drawLine(widthSize/2, 0, widthSize/2, heightSize, pCenter);

if(pTouchPoint.x > 0 && pTouchPoint.y > 0) {canvas.drawCircle(pTouchPoint.x, pTouchPoint.y, 200, pCenter);

}

}

Page 11: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

11좌표 데이터 전송

public interface ControllerCallBack {public void ChangeControllerPosition(int xOffset, int yOff-

set);}

public class MainActivity extends RobotActivity implements Controller-CallBack{

ControllerView controllerView;@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); controllerView = (ControllerView)findViewById(R.id.conroller); controllerView.setCallback(this); }

Page 12: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

12좌표 데이터 전송

public class ControllerView extends View {ControllerCallBack callback = null;…public ControllerCallBack getCallback() {

return callback;}public void setCallback(ControllerCallBack callback) {

this.callback = callback;}

}

Page 13: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

13좌표 데이터 전송

@Overridepublic boolean onTouchEvent(MotionEvent event) {

// TODO Auto-generated method stubswitch(event.getAction()) {

case MotionEvent.ACTION_UP: … callback.ChangeControllerPosition(0, 0); invalidate(); break; case MotionEvent.ACTION_DOWN: … invalidate(); break; case MotionEvent.ACTION_MOVE: … int xOffset = (int)(widthSize/2 - pTouchPoint.x); int yOffset = (int)(heightSize/2 - pTouchPoint.y); callback.ChangeControllerPosition(xOffset, yOffset); } invalidate(); break; }

return true;}

Page 14: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

14좌표 데이터 처리

@Overridepublic void ChangeControllerPosition(int xOffset, int yOffset) { // TODO Auto-generated method stub Log.d("MainActivity", "ChangeControlerPosition x:" + xOffset

+ " y:" + yOffset);int rSpeed = 0;int fSpeed = 0;if(Math.abs(xOffset/10) > 10) {

rSpeed = (int)(xOffset/10);}// Front Speedif(Math.abs(yOffset/10) > 10) {

fSpeed = (int)(yOffset/10);}leftWheel.write(fSpeed + rSpeed);rightWheel.write(fSpeed - rSpeed);

}

Page 15: Custom Widget 2 UNIT 27 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Custom Widget Canvas 를 이용하여 Custom Widget 을 만든다. 2

15테스트