1. 目的
熟悉Android studio的基本应用，编写第一个应用界面并且能在手机或模拟器中成功运行，思考该应用的其他变形。
2. 技术
- 素材导入
- 定义图标初始位置
- 点击动画
3. 技术的使用
- 将图片资源导入
mipmap路径 - 最上层的图片代码在最后写，将
TextVeiw所有内容删除，将androidx.constraintlaout.widget.ConstraintLaout改为RelativeLayout。图标大小使用ImageView设置参数
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:src="@mipmap/h"
android:layout_centerInParent="true"
android:layout_marginTop="5dp"/>
- 增加点击效果即在对应点击的图片代码中添加
android:onClick="imgClicked"
- 为其他图片增加下滑动画，需要为它们各设一个id
android:id="@+id/iv_b"
- 再利用一个数组保存所有id号，再用一个数组保存所有id号的视图
private int[] resID = {R.id.iv_b, R.id.iv_c, R.id.iv_d, R.id.iv_e, R.id.iv_f, R.id.iv_g, R.id.iv_h};
private List<ImageView> imageViews = new ArrayList<>();
- 将id号对应的图片视图读取出来 放到ImageViews里
android:id="@+id/iv_b"
- 定义一个变量 用来记录按钮的状态
private boolean isOpen = false;
- 判断是打开还是关闭
public void imgClicked(View view) {
if (isOpen == true) {
close();
//应该关闭 收回列表
} else {
open();
//应该打开 展开列表
}
isOpen = !isOpen;
}
- 菜单开关方法
private void close() {
for (int i = 0; i < imageViews.size(); i++) {
//取出一个图片视图
ImageView iv = imageViews.get(i);
//给图片添加移动动画
ObjectAnimator oa = ObjectAnimator.ofFloat(iv,"translationY",(i + 1) * 200f,0f);
oa.setDuration(1000);
oa.start();
}
}
private void open() {
for (int i = 0; i < imageViews.size(); i++) {
//取出一个图片视图
ImageView iv = imageViews.get(i);
//给图片添加移动动画
ObjectAnimator oa = ObjectAnimator.ofFloat(iv,"translationY", 0f,(i + 1) * 200f);
oa.setDuration(1000);
oa.setInterpolator(new BounceInterpolator());
oa.start();
}
}
4. 实际使用
1564330737447.gif
