8.3.2 绘图类实战示例

Android基础入门教程——8.3.2 绘图类实战示例

标签(空格分隔): Android基础入门教程

本节引言:

前两节我们学了Bitmap和一些基本的绘图API的属性以及常用的方法,但心里总觉得有点 不踏实,总得写点什么加深下映像是吧,嗯,本节我们就来写两个简单的例子: 1.简单画图板的实现 2.帮美女擦衣服的简单实现 嘿嘿,第二个例子是小猪刚学安卓写的一个小Demo~嘿嘿~ 开始本节内容~

1.实战示例1:简单画图板的实现:

这个相信大家都不陌生,很多手机都会自带一个给用户涂鸦的画图板,这里我们就来写个简单的 例子,首先我们分析下,实现这个东东的一些逻辑: Q1:这个画板放在哪里? 答:View里,我们自定义一个View,在onDraw()里完成绘制,另外View还有个onTouchEvent的方法, 我们可以在获取用户的手势操作! q2.需要准备些什么? 答:一只画笔(Paint),一块画布(Canvas),一个路径(Path)记录用户绘制路线; 另外划线的时候,每次都是从上次拖动时间的发生点到本次拖动时间的发生点!那么之前绘制的 就会丢失,为了保存之前绘制的内容,我们可以引入所谓的“双缓冲”技术: 其实就是每次不是直接绘制到Canvas上,而是先绘制到Bitmap上,等Bitmap上的绘制完了, 再一次性地绘制到View上而已! 3.具体的实现流程? 答:初始化画笔,设置颜色等等一些参数;在View的onMeasure()方法中创建一个View大小的Bitmap, 同时创建一个Canvas;onTouchEvent中获得X,Y坐标,做绘制连线,最后invalidate()重绘,即调用 onDraw方法将bitmap的东东画到Canvas上!

好了,逻辑知道了,下面就上代码了: MyView.java:

/** * Created by Jay on 2015/10/15 0015. */{Canvas mCanvas; mLastX;private int mLastY;public MyView(Context context) {super(context);init();}public MyView(Context context, AttributeSet attrs) {super(context, attrs);init();}public MyView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init();}(){mPath = new Path();mPaint = new Paint(); //初始化画笔mPaint.setColor(Color.GREEN);mPaint.setAntiAlias(true);mPaint.setDither(true);mPaint.setStyle(Paint.Style.STROKE);mPaint.setStrokeJoin(Paint.Join.ROUND); //结合处为圆角mPaint.setStrokeCap(Paint.Cap.ROUND); // 设置转弯处为圆角mPaint.setStrokeWidth(20); // 设置画笔宽度}(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);int width = getMeasuredWidth();int height = getMeasuredHeight();// 初始化bitmap,CanvasmBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);mCanvas = new Canvas(mBitmap);}(Canvas canvas) {drawPath();canvas.drawBitmap(mBitmap, 0, 0, null);}(){mCanvas.drawPath(mPath, mPaint);}(MotionEvent event) {int action = event.getAction();int x = (int) event.getX();int y = (int) event.getY();switch (action){case MotionEvent.ACTION_DOWN:mLastX = x;mLastY = y;mPath.moveTo(mLastX, mLastY);break;case MotionEvent.ACTION_MOVE:int dx = Math.abs(x – mLastX);int dy = Math.abs(y – mLastY);if (dx > 3 || dy > 3)mPath.lineTo(x, y);mLastX = x;mLastY = y;break;}invalidate();return true;}}

运行效果图:

你可以根据自己的需求进行扩展,比如加上修改画笔大小,,修改画笔颜色,保存自己画的图等! 发散思维,自己动手~

2.实战示例2:擦掉美女衣服的实现

核心思路是: 利用帧布局,前后两个ImageView,前面的显示未擦掉衣服的情况,后面的显示擦掉衣服后的情况! 为两个ImageView设置美女图片后,接着为前面的ImageView设置OnTouchListener!在这里对手指 触碰点附近的20*20个像素点,设置为透明!

运行效果图:

代码实现:

Step 1:第一个选妹子的Activity相关的编写,首先是界面,一个ImageView,Button和Gallery!

activity_main.xml:

==”match_parent”android:orientation=”vertical”><ImageView=”320dp” /><Button=”wrap_content”android:text=”脱光她!” /><Gallery==>

接着是我们Gallery的Adapter类,这里我们重写下BaseAdapter,而里面就显示一个图片比较简单, 就不另外写一个布局了!

MeiziAdapter.java:

/** * Created by Jay on 2015/10/16 0016. */{private Context mContext;private int[] mData;public MeiziAdapter() {}public MeiziAdapter(Context mContext,int[] mData) {this.mContext = mContext;this.mData = mData;}() {return mData.length;}@Overridepublic Object getItem(int position) {return mData[position];}(int position) {return position;}@Overridepublic View getView(int position, View convertView, ViewGroup parent) {ImageView imgMezi = new ImageView(mContext);imgMezi.setImageResource(mData[position]);//创建一个ImageViewimgMezi.setScaleType(ImageView.ScaleType.FIT_XY);//设置imgView的缩放类型imgMezi.setLayoutParams(new Gallery.LayoutParams(250, 250)); //为imgView设置布局参数TypedArray typedArray = mContext.obtainStyledAttributes(R.styleable.Gallery);imgMezi.setBackgroundResource(typedArray.getResourceId(R.styleable.Gallery_android_galleryItemBackground, 0));return imgMezi;}}

最后到我们的Activity,也很简单,无非是为gallery设置onSelected事件,点击按钮后把,当前选中的 Position传递给下一个页面!

因为它抚平了心底的不安;当你尝到了极品的美食,

8.3.2 绘图类实战示例

相关文章:

你感兴趣的文章:

标签云: