IOS有个很有趣味的特性:背景图片可以响应陀螺仪方向的变化,去改变X、Y轴上的值,从而让整个界面看着充满着灵性。具体步骤是:解锁苹果产品,在IOS7以上,摆动手势,观察桌面背景图片的变化。

刚好,我们的产品现在遇到了一个场景:标题栏以下,占据40%空间的是一张png图片,背景是一片星空,如果不给点交互,感觉太死板了

这时候想,如果把IOS这个特性移植到本场景中,作用对象是背景那个星空,那多美啊~

二话不说,跪求美工大哥把png图片的前景和背景分离,拿到两张图片,开搞~

实现之后的效果产品大哥也觉得很赞,就把这套方案共享出来了,调用很简单,一共三句:声明、注册、解注册。

本模块工作原理:监听加速器里的陀螺仪传感器,获取其在x、y轴上的偏移数据,换算成一个垂直、水平上的位移值,赋值给视图的x、y属性。

先来看下效果,比较渣,建议下载APK demo体验;源码地址:http://git.oschina.net/yso/IOSParallelView

一句话讲解陀螺仪xyz方向:以portrait屏幕方向为例,手机的左下角为原点,x轴:水平方向,越右越大;y轴:垂直方向,越高越大;z轴:屏幕对着你的方向,越近越大;

下面来说下具体的实现步骤:

准备工作

1:设置一个视图响应陀螺仪事件,最大移动的距离为30dp(举个例子);

2:设置视图宽高为:原始宽高 +2倍的30dp(用于左移和右移到极限都能看到图片)

3:把图片往屏幕的左上角扯30dp距离,(通过设置 x、y为-30dp)

ps:因此,我们设置x、y的范围是-60dp(再往左上角扯30dp)~0dp(往右下角扯了60dp)

接下来开始响应陀螺仪事件了

1:将陀螺仪在x、y轴上的数据拿到,互换x、y参数位置,传递给调用方

 //为什么要互换 x,y;是因为陀螺仪在y轴上的左右倾斜数据,最终会反应在图片在水平位置上的变化;同理x轴上下倾斜反应在垂直位置上的变化
//为调用端统一坐标,我们在这里就做了调换,调用端按照正常的坐标系使用即可

2:调用端60dp* 拿到偏移数据*修正常量(0.02f挺好),变成在水平、垂直上的偏移量(我们规定为-30dp~30dp,总不能无限偏移吧。。)

3:将结果减去30dp(为什么-30dp是因为我们x、y初始就是-30dp,不是0),赋值在视图的x、y属性上。

4:没了。

调用超级简单,贴上代码

初始化里传入Context、要移动的视图、单向移动的最大距离;

在onResume里面注册传感器事件,开始监听陀螺仪

在onPause里面注销传感器事件

public class MainActivity extends AppCompatActivity {
ParallelViewHelper parallelViewHelper; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
parallelViewHelper = new ParallelViewHelper(this, findViewById(R.id.main_image_background));
} @Override
protected void onResume() {
super.onResume();
parallelViewHelper.start();
} @Override
protected void onPause() {
super.onPause();
parallelViewHelper.stop();
}
}

已知问题:

不能响应屏幕改变事件、不能在横屏上工作。因为现在的APK大部分都定死了方向为portrait,我就不做这方面的优化了。

解决思路:响应activity的onConfigChange事件,拿到屏幕旋转方向。

或者创建一个监听系统方向变化的类OrientationEventListener,在事件中拿到屏幕旋转的角度。

老规矩有啥建议欢迎一起交流~

【android】移植IOS视图响应陀螺仪交互行为的更多相关文章

  1. 提供给Android和iOS开发人员的UWP移植向导

    (此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:前几天微软发布了一个针对Android和iOS开发人员理解Windows Apps概念 ...

  2. js和android及ios交互

    Android中Java和JavaScript交互 这种交互,Hybrid App 会用的比较多一点, 本文将介绍如何实现Java代码和Javascript代码的相互调用. Android提供了一个很 ...

  3. Android与IOS异同点对照(1)------ 显示

    Android与IOS作为当前世界上最流行的两大移动端操作系统,都拥有无数的粉丝. 那么对于Android或者IOS的开发人员来说,这两个系统都拥有什么同样或者不同的地方那?如今让我们一起来了解一下A ...

  4. iOS 视图控制器转场详解

    iOS 视图控制器转场详解 前言的前言 唐巧前辈在微信公众号「iOSDevTips」以及其博客上推送了我的文章后,我的 Github 各项指标有了大幅度的增长,多谢唐巧前辈的推荐.有些人问我相关的问题 ...

  5. GitHub Android 最火开源项目Top20 GitHub 上的开源项目不胜枚举,越来越多的开源项目正在迁移到GitHub平台上。基于不要重复造轮子的原则,了解当下比较流行的Android与iOS开源项目很是必要。利用这些项目,有时能够让你达到事半功倍的效果。

    1. ActionBarSherlock(推荐) ActionBarSherlock应该算得上是GitHub上最火的Android开源项目了,它是一个独立的库,通过一个API和主题,开发者就可以很方便 ...

  6. ArcGIS Runtime SDKs v10.2.4最新(Android、iOS、OSX和.NET)

    ArcGIS Runtime SDKs v10.2.4最新,它包含:Android.iOS.OS X和.NET四大平台,用户和开发人员可以登录Esri最新的SDK安装包.或者通过云盘下载(http:/ ...

  7. iOS与JS开发交互总结

    hybrid.jpg 前言 Web 页面中的 JS 与 iOS Native 如何交互是每个 iOS 猿必须掌握的技能.而说到 Native 与 JS 交互,就不得不提一嘴 Hybrid. Hybri ...

  8. View Programming Guide for iOS ---- iOS 视图编程指南(二)---View and Window Architecture

    View and Window Architecture 视图和窗口架构 Views and windows present your application’s user interface and ...

  9. View Programming Guide for iOS ---- iOS 视图编程指南(一)

    Next About Windows and Views 关于窗口和视图 In iOS, you use windows and views to present your application’s ...

随机推荐

  1. hive与hbase的联系与区别

    hive与hbase的联系与区别: 共同点: 1.hbase与hive都是架构在hadoop之上的.都是用hadoop作为底层存储. 他们的底层是要通过mapreduce分布式计算的,hbase.hi ...

  2. Tomcat连接参数的优化,主要是针对吞吐量做优化

    Tomcat连接参数的优化,主要是针对吞吐量做优化: 修改conf/server.xml文件,把原来 <Connector port="8080" protocol=&quo ...

  3. WAS的部署

    一.设置JAM参数 1.登录WAS的控制台 https://192.168.0.91:9043/ibm/console

  4. 内存监测工具 DDMS --> Heap

    无论怎么小心,想完全避免bad code是不可能的,此时就需要一些工具来帮助我们检查代码中是否存在会造成内存泄漏的地方.Android tools中的DDMS就带有一个很不错的内存监测工具Heap(这 ...

  5. IOS实例方法和类方法的区别

    类方法和实例方法   实例方法是— 类开头是+ 实例方法是用实例对象访问,类方法的对象是类而不是实例,通常创建对象或者工具类. 在实例方法里,根据继承原理发送消息给self和super其实都是发送给s ...

  6. AndroidのListView之滑动列表项(点击事件和滑动事件共存)

    这里正好在项目有这么一个bt的需求,如下图ListView的item可以响应点击事件也可以响应item的左右滑动事件,两个事件可以相互独立互不影响. 听说iphone的list选项就有这样bt的功能, ...

  7. ubuntu的两种网络连接模式

    ubuntu的网络连接分成两种类型,一种是modern 模式, 这种模式的配置通过ifconfig命令来进行配置,重启之后失效,这种模式就是在destop 下右上角的网络连接.如图所示 modern模 ...

  8. Linux 启动文件、设置环境变量的位置

    系统级启动文件  ==================================== 1./etc/rc  主启动文件,不要修改它 2./etc/rc.conf  决定启动哪些系统自带的守护进程 ...

  9. jQuery中的ajax用法案例

    什么是 AJAX? AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML). 简短地说,在不重载整个网页的情况下,AJAX 通过后台加载 ...

  10. javascript飞机大战-----007爆炸效果

    要检验什么时候碰撞,我们必须了解什么时候不相撞.以上四种情况是不相撞的时候 首先在引擎里面写好什么时候碰撞什么时候不碰撞 /* 游戏引擎 */ var Engine = { //刚开始的游戏状态 ga ...