牙叔教程简单易懂
QQ来电界面
分析界面
首先排除左上角那两个箭头,不要它;
布局用vertical纵向布局;
上面放头像,下面放挂机接听按钮;
背景是头像模糊的头像;
布局分析完了,下面开始写界面
模糊头像
也可以说是毛玻璃效果
原本的头像
模糊后的头像
裁剪图片
头像是正方形的,背景是长方形的,所以要裁剪图片,比例就按照屏幕比例来;
以头像的高为标准,按照屏幕比例计算对应的宽度;
然后把位于中间的图片裁剪下来;
背景变暗
QQ来电界面的背景,看上去有点暗,因此我们加一层黑色透明遮罩;
虽然不太像QQ那种效果,不过也差不多;能用就行,要求不高;
整体布局
上面红色区域放头像,下面黄色区域放接听拒接
添加头像
头像是上下布局,使用vertical;
图片+文字
添加底部电话
底部布局一分为二
添加左侧拒接电话
左侧是纵向布局,使用vertical,并且靠近底部,不是居中,也不是靠上;
靠近底部使用属性
gravity="center
bottom"
电话还要加一个圆角矩形的背景
添加右侧接听
右侧就一个图片,再加一个圆角矩形背景
模仿的初步成果
去掉多余的背景色
看着像是那么回事
雷电模拟器的效果
本来圆形的头像变成了圆角矩形;
本来圆角矩形的接听,变成了圆形;
我们来修改一下,使两种测试设备,看上去风格保持一致;
为什么不一样
原因有以下几点
设备分辨率不一样
界面xml里面的属性有的使用dp,有的使用px
知道原因以后,我们把单位统一改成dp,这样风格就一样了
为什么模拟器背景是灰色的,而不是黑色的
为了排查这个问题,我们把多余的代码都删掉,只留下背景相关的代码;
突然想到,我是在手机上截图的,模拟器用的也是手机截图,所以我们把裁剪图片的代码,合并到脚本里面;
大功告成!!!
环境
手机:小米11pro
MIUI:13.0.12
Android版本:12
Autojs版本:9.1.22
名人名言
思路是最重要的,其他的百度,bing,stackoverflow,github,安卓文档,autojs文档,最后才是群里问问---牙叔教程
声明
部分内容来自网络本教程仅用于学习,禁止用于其他用途