个人比较喜欢无人机相关的研究工作,苦于技术比较渣,还没有实力去找一个这样的机会加入无人机研发团队。
最近因为手头工作不是很忙,想起来写点跟无人机有关的东西。
刚开始来深圳面试的时候遇到过一个leader,让我描绘一些怎么实现一个无人机操作界面的绘制。
现在有点时间来把这个主要的控件实现一下。话不多说,先上效果图:
自定义控件需要用到的类主要就是 Paint (画笔类)和 Canvas (画布类)。
1.自定义一个控件,继承自View
public class WheelView extends View {
public WheelView(Context context) {
super(context);
initWheelView();
}
public WheelView(Context context, AttributeSet attrs) {
super(context, attrs);
initWheelView();
}
public WheelView(Context context, AttributeSet attrs, int paramInt) {
super(context, attrs, paramInt);
initWheelView();
}
/** 控件中心点的X坐标 */
public double centerX = 0.0D;
/** 控件中心点的Y坐标 */
public double centerY = 0.0D;
/** 控件的半径 */
private int joystickRadius;
/** 整个控件的大圆的画笔 */
private Paint mainCircle;
/** 第二个内圆的画笔 */
private Paint secondaryCircle;
/** 垂直线的画笔 */
private Paint verticalLine;
/** 水平线的画笔 */
private Paint horizontalLine;
/**
* 初始化画笔的基本样式
*/
private void initWheelView() {
this.mainCircle = new Paint(1);
this.mainCircle.setColor(Color.BLUE);
this.mainCircle.setStrokeWidth(3.0f);
this.mainCircle.setStyle(Paint.Style.STROKE);
this.secondaryCircle = new Paint();
this.secondaryCircle.setColor(Color.GREEN);
this.secondaryCircle.setStrokeWidth(3.0f);
this.secondaryCircle.setStyle(Paint.Style.STROKE);
this.verticalLine = new Paint();
this.verticalLine.setStrokeWidth(3.0F);
this.verticalLine.setColor(Color.RED);
this.horizontalLine = new Paint();
this.horizontalLine.setStrokeWidth(3.0F);
this.horizontalLine.setColor(Color.BLACK);
}
}
我打算在这个控件里面画一个大圆,一个小圆,加上纵横坐标线各一根,初始化了四个画笔类。
当然根据自己的需求来,目前只是简单实现。
2.重写View中的测量方法和绘制方法
/**
* 重写View中的测量方法
*/
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//取宽高中的小值,作为宽高值
int i = Math.min(measure(widthMeasureSpec), measure(heightMeasureSpec));
//将宽高值传给父容器,告诉父容器我需要占用多少宽高
setMeasuredDimension(i, i);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
/** 测量宽高的方法 */
private int measure(int paramInt) {
int i = View.MeasureSpec.getMode(paramInt);
int j = View.MeasureSpec.getSize(paramInt);
if (i == 0)//当模式=0时,表示 android:layout_width="wrap_content"
return 200;//此时设置默认宽高为200
return j;
}
/** 重写View中的绘制方法*/
@Override
protected void onDraw(Canvas canvas) {
//获取控件的宽高并取一半作为中心点坐标
this.centerX = (getWidth() / 2);
this.centerY = (getHeight() / 2);
this.joystickRadius = Math.min((int)this.centerX, (int)this.centerY) - 3;
// canvas.drawColor(Color.YELLOW);//画背景色
// paint.setUnderlineText(true);//设置文字带下划线
//用画布画大圆。参数顺序:圆心X坐标,圆心Y坐标,圆半径,画笔样式
canvas.drawCircle(
(int) this.centerX,
(int) this.centerY,
this.joystickRadius,
this.mainCircle);// paint
//用画布画里面的小圆。
canvas.drawCircle(
(int) this.centerX,
(int) this.centerY,
this.joystickRadius / 2,
this.secondaryCircle);//secondaryCircle
//画竖直线
canvas.drawLine(
(float) this.centerX,
(float) (this.centerY - this.joystickRadius + 1),
(float) this.centerX,
(float) (this.centerY + this.joystickRadius - 1),
this.verticalLine);
//画水平线
canvas.drawLine(
(float) (this.centerX - this.joystickRadius + 1),
(float) this.centerY,
(float) (this.centerX + this.joystickRadius - 1),
(float) this.centerY,
this.horizontalLine);
}
这样控件就已经基本上算做好了,接下来我们去使用这个控件。
3.控件的引用
在activity_main.xml中部署了两个自定义的控件
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="${relativePackage}.${activityClass}" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="matc