标签:
自定义控件, 视频教程
http://www.jikexueyuan.com/course/1748.html
1. 编写自定义view
2. 加入逻辑线程
3. 提取和封装自定义view
4. 利用xml中定义样式来影响显示效果
----------------------------------
1. 编写自定义view
定义MyView
public class MyView extends View { public MyView(Context context, AttributeSet attrs) { super(context, attrs); } public MyView(Context context) { super(context); } @Override protected void onDraw(Canvas canvas) { // 加入绘制元素 Paint paint = new Paint(); paint.setTextSize(30); canvas.drawText("hello carloz", 0, 30, paint); //默认左下对齐 } }
在布局文件中使用,背景绿色
<com.carloz.diycontrols.MyView android:layout_width="match_parent" android:layout_height="match_parent" android:background="#00ff00"/>
运行效果
绘制几何图形
canvas.drawLine(0, 60, 100, 60, paint); //绘制直线 Rect r = new Rect(10, 90, 110, 190); //parm: int canvas.drawRect(r, paint); // 绘制矩形 RectF rect = new RectF(10, 90, 110, 190); //parm: float canvas.drawRect(rect, paint); // 绘制矩形
绘制图片
public class MyView extends View { Bitmap bitmap; public MyView(Context context, AttributeSet attrs) { super(context, attrs); bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher); } public MyView(Context context) { super(context); bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher); } @Override protected void onDraw(Canvas canvas) { // 加入绘制元素 Paint paint = new Paint(); paint.setTextSize(30); canvas.drawText("hello carloz", 0, 30, paint); //默认左下对齐 RectF r = new RectF(10, 90, 110, 190); //parm: int canvas.drawRoundRect(r, 10, 10, paint); // 绘制圆角矩形 paint.setColor(Color.RED); //改变图形颜色 canvas.drawCircle(60, 270, 50, paint); // 绘制圆, 圆心, 半径 paint.setStyle(Style.STROKE); //绘制空心的元素 canvas.drawBitmap(bitmap, 10, 350, paint); //画图 } }
充当ContentView,可以看到,layout文件中的背景色已经去掉了
public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); //setContentView(R.layout.activity_main); setContentView(new MyView(this)); } }
2. 加入逻辑线程
目的:让绘制元素动起来
2.1 跑马灯效果的 文字
public class LogicView extends View { Paint paint = new Paint(); String text = "Carloz Logic View"; private float rx = 0; MyThread thread; public LogicView(Context context, AttributeSet attrs) { super(context, attrs); // TODO Auto-generated constructor stub } public LogicView(Context context) { super(context); // TODO Auto-generated constructor stub } @Override protected void onDraw(Canvas canvas) { paint.setTextSize(30); canvas.drawText(text, rx, 30, paint); if(thread == null ) { thread = new MyThread(); thread.start(); } } class MyThread extends Thread { @Override public void run() { // TODO Auto-generated method stub super.run(); while(true) { rx += 5; if (rx > getWidth()) //超出屏幕的时候让它返回来 rx = 0 - paint.measureText(text); postInvalidate(); //线程中更新绘制,重新调用onDraw方法 try { Thread.sleep(50); //速度太快肉眼看不到,要睡眠 } catch (InterruptedException e) { // TODO Auto-generated catch block e.printStackTrace(); } } } } }
效果如下, 图片做的不好(????)
2.2. 扇形成圆
3. 提取和封装自定义view
4. 利用xml中定义样式来影响显示效果
标签:
原文地址:http://www.cnblogs.com/carlo/p/4721206.html