博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
几行代码实现ofo首页小黄人眼睛加速感应转动
阅读量:6823 次
发布时间:2019-06-26

本文共 3782 字,大约阅读时间需要 12 分钟。

最新版的ofo 小黄车的首页小黄人眼睛随重力而转动,感觉有点炫酷,学习一下吧,以下代码是在xamarin android下实现

ofo首页效果图:
这里写图片描述
xamarin android实现效果:
这里写图片描述
实现思路:
这个眼睛转动随加速度,使用的是FrameLayout图层叠加布局的,然后再进行dimen适配,随着加速度的变化,两个眼睛TranslationY方法进行View的移动。一下代码是在xamarin android下实现的,大概效果差不多,屏幕适配没弄。
素材图片:
github中自己复制吧:

先来看看MainActivity布局文件:

效果实现主要代码:

using Android.App;using Android.Widget;using Android.OS;using Android.Hardware;using Android.Views;using Android.Content;using Android.Runtime;using System;namespace ofo_eye_demo{    [Activity(Label = "ofo_eye_demo", MainLauncher = true, Icon = "@drawable/icon")]    public class MainActivity : Activity,ISensorEventListener    {        private SensorManager sensorManager;        private Sensor defaultSensor;        private View lefteye, righteye;        private float normalSpace, x, y;        protected override void OnCreate(Bundle bundle)        {            base.OnCreate(bundle);             SetContentView(Resource.Layout.Main);            lefteye = FindViewById(Resource.Id.lefteye);            righteye = FindViewById(Resource.Id.righteye);            normalSpace = Resources.GetDimension(Resource.Dimension.dimen20);            sensorManager = GetSystemService(Context.SensorService) as  SensorManager;            defaultSensor = sensorManager.GetDefaultSensor(SensorType.Accelerometer);            /*                 Accelerometer = 1,//加速度                 MagneticField = 2,//磁力                 Orientation = 3,//方向                 Gyroscope = 4,//陀螺仪                 Light = 5,//光线感应                 Pressure = 6,//压力                 Temperature = 7,//温度                 Proximity = 8,//接近                Gravity = 9,//重力                LinearAcceleration = 10,//线性加速度                RotationVector = 11,//旋转矢量                RelativeHumidity = 12,//湿度                AmbientTemperature = 13,//温度                */        }        protected override void OnResume()        {            base.OnResume();            sensorManager.RegisterListener(this,defaultSensor,SensorDelay.Ui);        }        protected override void OnPause()        {            base.OnPause();            sensorManager.UnregisterListener(this);        }        public void OnAccuracyChanged(Sensor sensor, [GeneratedEnum] SensorStatus accuracy)        {            //throw new NotImplementedException();        }        public void OnSensorChanged(SensorEvent e)        {            /*          加速度传感器说明:          加速度传感器又叫G-sensor,返回x、y、z三轴的加速度数值。          该数值包含地心引力的影响,单位是m/s^2。          将手机平放在桌面上,x轴默认为0,y轴默认0,z轴默认9.81。          将手机朝下放在桌面上,z轴为-9.81。          将手机向左倾斜,x轴为正值。          将手机向右倾斜,x轴为负值。          将手机向上倾斜,y轴为负值。          将手机向下倾斜,y轴为正值。          加速度传感器可能是最为成熟的一种mems产品,市场上的加速度传感器种类很多。          手机中常用的加速度传感器有BOSCH(博世)的BMA系列,AMK的897X系列,ST的LIS3X系列等。          这些传感器一般提供±2G至±16G的加速度测量范围,采用I2C或SPI接口和MCU相连,数据精度小于16bit。        */            if (e.Sensor.Type == SensorType.Accelerometer)            {                x -= 6.0f * e.Values[0];                y += 6.0f * e.Values[1];                //越界处理                if (x < -normalSpace)                {                    x = -normalSpace;                }                if (x > 0)                {                    x = 0;                }                if (y > 0)                {                    y = 0;                }                if (y < -normalSpace)                {                    y = -normalSpace;                }                lefteye.TranslationY = y;                lefteye.TranslationX = x;                lefteye.Rotation = x;                righteye.TranslationX = x;                righteye.TranslationY = y;                righteye.Rotation = x;            }    }}}

参考文章:

代码并没有很多,下载:
作者:张林
标题:几行代码实现ofo首页小黄人眼睛加速感应转动
原文地址:
转载随意注明出处

你可能感兴趣的文章
rem2
查看>>
转载:空指针的深入理解(C/C++)
查看>>
Oracle 云计算
查看>>
51-Python字典常见的用法
查看>>
初赛小知识之网络协议
查看>>
python 内存中写入文件(read读取不到文件解决)
查看>>
maven pom.xml详解
查看>>
BZOJ2705: [SDOI2012]Longge的问题
查看>>
Ubuntu 下的常用 apt 命令
查看>>
<Programming Ruby 1.9 The Pragmatic Programmer>读书笔记
查看>>
log4j:WARN No appenders could be found for logger (...)解决办法
查看>>
研发部阶段性工作汇总
查看>>
10.28T4 二分
查看>>
ASP.NET中url传递中文的解决方案
查看>>
js6
查看>>
[PLC]ST语言四:INV_MEP_MEF_PLS_PLF_MC_MCR
查看>>
[Docker]Harbor部署私有镜像仓库
查看>>
漂亮!Javascript代码模仿淘宝宝贝搜索结果的分页显示效果
查看>>
为现代JavaScript开发做好准备
查看>>
mstsc的事 随笔
查看>>