引导页 聚焦效果

引导页 聚焦效果

大家好,又见面了,我是全栈君,祝每个程序员都可以多学几门语言。

偶尔在知乎上看到 豌豆荚工作氛围和企业文化都比較好,有归属感,多写写博客,希望能被豌豆荚发现大笑

如题,引导页 聚焦效果,用于标注某个区域的功能,假设感觉有点意思,请给个赞。如图:

引导页 聚焦效果

设计思路:

1、得到想聚焦View的位置location;

2、遮罩层(一个圆圈,其它地方半透),用SurfaceView实现,包括两张图片,一张圆形,一张半透的方形。

引导页 聚焦效果      引导页 聚焦效果

先在Canvas上画出镂空圆孔,然后在该圆形图片的上下左右4个矩形区域画上那张半透的方形图片,就组成了遮罩层;

3、依照View的location,能够计算得到圆形图片的位置;

4、监听遮罩层的OnTouch事件,每次touch,将依据下一个locaton,重绘SurfaceView;

5、当没有下一个location时,再次点击,遮罩层消失。

源代码分析:

包括3部分,GuideIndexActivity.java、GuideView.java、MainActivity.java。

注:可改动去掉GuideIndexActivity.java,将GuideView在Activity中显示。

MainActivity.java:

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
	}

	public void showGuide(View v) {
		Button hereBtn = (Button) findViewById(R.id.btn_here);
		TextView godlikeTv = (TextView) findViewById(R.id.tv_godlike);
		ImageView launcherIv = (ImageView) findViewById(R.id.iv_launcher);
		Intent intent = new Intent(MainActivity.this, GuideIndexActivity.class);

		intent.putExtra("ArrayPoints",
				guidePoints(hereBtn, godlikeTv, launcherIv));
		startActivity(intent);
	}
	
	private String guidePoints(View... views) {
		int size = views.length;
		JSONArray array = new JSONArray();
		for (int i = 0; i < size; i++) {
			array.put(viewPoint(views[i]));
		}
		return array.toString();
	}
	
	private JSONObject viewPoint(View view) {
		JSONObject json = new JSONObject();
		int[] location = new int[2];
		view.getLocationOnScreen(location);
		try {
				json.put("x", location[0] + view.getWidth() / 2);
				json.put("y", location[1] + view.getHeight() / 2);
		} catch (JSONException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		return json;
	}
}


JSONObject viewPoint(View view) 获取到某View的位置。

String guidePoints(View… views)  将全部的View的位置信息转为JSONArray字符串。

GuideView.java:

public class GuideView extends SurfaceView implements SurfaceHolder.Callback {
	private SurfaceHolder holder;
	private Bitmap focus = BitmapFactory.decodeResource(getResources(),
			R.drawable.bg_guide_focus);
	private Bitmap bg = BitmapFactory.decodeResource(getResources(),
			R.drawable.bg_guide);
	private float focusW, focusH;
	private Context mContext;
	private int ScreenWidth;
	private int ScreenHeight;
	private JSONArray arrayPoints;
	private int step = 0;
	private boolean flag = false;

	public GuideView(Context context) {
		super(context);
		this.mContext = context;
		this.focusH = focus.getHeight();
		this.focusW = focus.getWidth();
		this.holder = this.getHolder();
		Display mDisplay = ((Activity) context).getWindowManager()
				.getDefaultDisplay();
		ScreenWidth = mDisplay.getWidth();
		ScreenHeight = mDisplay.getHeight();
		holder.addCallback(this);
		getHolder().setFormat(PixelFormat.TRANSLUCENT);
	}

	public GuideView(Context context, AttributeSet attributeSet) {
		super(context, attributeSet);
		this.mContext = context;
		this.focusH = focus.getHeight();
		this.focusW = focus.getWidth();
		this.holder = this.getHolder();
		Display mDisplay = ((Activity) context).getWindowManager()
				.getDefaultDisplay();
		ScreenWidth = mDisplay.getWidth();
		ScreenHeight = mDisplay.getHeight();
		holder.addCallback(this);
		getHolder().setFormat(PixelFormat.TRANSLUCENT);
	}

	public void setArrayPoint(JSONArray arrayPoints) {
		this.setVisibility(View.VISIBLE);
		this.arrayPoints = arrayPoints;
		flag = true;
		invalidate();
	}

	@Override
	public void surfaceChanged(SurfaceHolder arg0, int arg1, int arg2, int arg3) {
		// TODO Auto-generated method stub

	}

	@Override
	public void surfaceCreated(SurfaceHolder arg0) {
		// TODO Auto-generated method stub
		if (flag) {
			doDraw(step);
		}
	}

	@Override
	public void surfaceDestroyed(SurfaceHolder arg0) {
		// TODO Auto-generated method stub
	}

	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// TODO Auto-generated method stub
		if (flag) {
			if (step <= arrayPoints.length()) {
				doDraw(step);
			} else {
				((Activity) mContext).finish();
				focus.recycle();
				bg.recycle();
			}
		}
		return super.onTouchEvent(event);
	}

	private void doDraw(int step) {
		// TODO Auto-generated method stub
		Canvas canvas = getHolder().lockCanvas();
		canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
		Rect src = new Rect(0, 0, bg.getWidth(), bg.getHeight());
		if(step < arrayPoints.length()){
		Point point = new Point();
		try {
			JSONObject json = arrayPoints.getJSONObject(step);
			point.x = json.getInt("x");
			point.y = json.getInt("y");
		} catch (JSONException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		int left = (int) (point.x - focusW / 2);
		int top = (int) (point.y - focusH / 2);
		int right = (int) (left + focusW);
		int bottom = (int) (top + focusH);
		canvas.drawBitmap(focus, left, top, null);
		Rect dstTop = new Rect(0, 0, ScreenWidth, top);
		Rect dstBottom = new Rect(0, bottom, ScreenWidth, ScreenHeight);
		Rect dstLeft = new Rect(0, top, left, bottom);
		Rect dstRight = new Rect(right, top, ScreenWidth, bottom);
		canvas.drawBitmap(bg, src, dstTop, null);
		canvas.drawBitmap(bg, src, dstBottom, null);
		canvas.drawBitmap(bg, src, dstLeft, null);
		canvas.drawBitmap(bg, src, dstRight, null);
		switch (step) {
		case 0:
			// first to do something
			break;
		case 1:
			// second to do something
			break;
		case 2:
			// third to do something
			break;
		default:
			break;
		}
		}else if(step == 3){
			
		}
		this.step++;
		getHolder().unlockCanvasAndPost(canvas);
	}

	class Point {
		int x;
		int y;
	}

GuideIndexActivity.java:

public class GuideIndexActivity extends Activity{
	private GuideView guideView;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		guideView = new GuideView(this);
		setContentView(guideView);
	}
	
	@Override
	protected void onResume() {
		// TODO Auto-generated method stub
		JSONArray arrayPoints;
		try {
			arrayPoints = new JSONArray(getIntent().getStringExtra("ArrayPoints"));
			guideView.setArrayPoint(arrayPoints);
		} catch (JSONException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		super.onResume();
	}
}

源代码下载地址:
http://download.csdn.net/detail/toyuexinshangwan/7603509

转载请标明:
http://blog.csdn.net/toyuexinshangwan/article/details/37508619

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/118348.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • linux局域网不同网段ip互通,linux环境中,两个不同网段的机器互通「建议收藏」

    linux局域网不同网段ip互通,linux环境中,两个不同网段的机器互通「建议收藏」环境如下:host1单网卡eth0172.24.100.15/16host2双网卡eth0172.24.100.14/16eth1192.168.122.214/24host3单网卡eth0192.168.122.215/24整个环境如下图:要求:让host1和host3互通,也就是host1能ping通host3,host3也能ping通host1解决:第一,在hos…

  • 查看CentOS的系统版本[通俗易懂]

    查看CentOS的系统版本[通俗易懂]记录一下以免忘记:CentOS查看版本有如下:cat/etc/redhat-releaseuname-acat/etc/issue#这个好像7以上看不了cat/proc/version#这个是和内核有关的数据getconfLONG_BITorgetconfWORD_BIT#查看版本位数是64位还是32位…

  • xshell连接虚拟机步骤_虚拟机网络设置

    xshell连接虚拟机步骤_虚拟机网络设置1、打开虚拟机,查看虚拟机的ip地址2、打开Xshell软件,点击“新建”3、填写属性,输入登录的用户名和密码(或者在填写属性的时候,点击用户身份验证,输入登录用户名和密码)4、连接成功Xshell6版本的链接https://download.csdn.net/download/qq_45130472/12352471…

  • rgbd slam_深度感知摄像头

    rgbd slam_深度感知摄像头‘’工欲善其事必先利其器‘’我们先从能够获取RGBD数据的相机开始谈起。首先我们来看一看其分类。一、根据其工作原理主要分为三类:1.双目方案:(1)原理:http://blog.csdn.net/shenziheng1/article/details/52883536(2)产品:ZED:https://www.stereolabs.com/Tango:http://

  • 走完同一条街,回到两个世界

    宿舍楼下就那么寥寥几棵树,知了一直在叫啊叫的不停.小时候跟着它们一起叫,用杆子粘着活好的面去黏它们,虽然从来都捉不到,现在,它们还在叫,我却已经过了跟它们玩的年纪.暑假回家呆了几天,上班,坐公交,下班,坐公交.在公司里清清爽爽几乎忘了这是夏天,下班了一出门喘口气都要流汗,还要被挤进密不透风的电梯里狠狠压缩一下,电梯也很累,每个楼层都要停一下,打开门叹口气接着往下走,满满一电梯的脑袋

  • C++\QT常见面试题[通俗易懂]

    C++\QT常见面试题[通俗易懂]1.C与C++的区别2.深拷贝和浅拷贝的区别3.指针和引用的区别4.什么是面向对象,面向对象的三大特征是什么?5.static关键字的用法6.const关键字的用法7.什么是函数重载8.创建的对象有几种方式,有什么区别9.什么是构造函数10.什么是this指针11.抽象类是什么12.什么是封装、继承、多态13.私有继承,保护继承和公有继承的区别14.友元函数15.new和delete16.C++STL容器有哪些17.什么是面向对象编程的开放封闭原则?18.内联函数与宏的区

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号