分类导航

Android 发布时间：2022-04-28 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了Android动画效果之自定义ViewGroup添加布局动画（五），大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

前言：

前面几篇文章介绍了补间动画、逐帧动画、属性动画，大部分都是针对View来实现的动画，那么该如何为了一个ViewGroup添加动画呢？今天结合自定义viewGroup来学习一下布局动画。本文将通过对自定义图片选择控件设置动画为例来学习布局动画。

自定义一个显示多行图片的ViewGroup：

这里不再对自定义控件做解说，想了解的可以看下以下几篇文章
•Android自定义控件之基本原理（一）
•Android自定义控件之自定义属性（二）
•Android自定义控件之自定义组合控件（三）
•Android自定义控件之自定义viewGroup实现标签云（四）

声明几个属性值：

  <declare-styleable name="GridImageViewGroup">
  <attr name="childVerticalSpace" format="dimension"/>
  <attr name="childHorizontalSpace" format="dimension"/>
  <attr name="columnNum" format="Integer"/>
 </declare-styleable>

GridImageViewGroup.java 代码

public class GridImageViewGroup extends ViewGroup {
 privatE int childVerticalSpace = 0;
 privatE int childHorizontalSpace = 0;
 privatE int columnNum = 3;
 privatE int childWidth = 0;
 privatE int childHeight = 0;


 public GridImageViewGroup(Context context,AttributeSet attrs) {
  super(context,attrs);
  TypedArray attributes = context.obtainStyledAttributes(attrs,R.styleable.GridImageViewGroup);
  if (attributes != null) {
   childVerticalSpace = attributes.getDimensionPixelSize(R.styleable.GridImageViewGroup_childVerticalSpace,0);
   childHorizontalSpace = attributes.getDimensionPixelSize(R.styleable.GridImageViewGroup_childHorizontalSpace,0);
   columnNum = attributes.geTint(R.styleable.GridImageViewGroup_columnNum,3);
   attributes.recycle();
  }
 }

 @Override
 protected void onMeasure(int widthMeasureSpec,int heightMeasureSpeC) {
  super.onMeasure(widthMeasureSpec,heightMeasureSpec);
  int rw = MeasureSpec.getSize(widthMeasureSpec);
  int rh = MeasureSpec.getSize(heightMeasureSpec);
  int childCount = getChildCount();
  if (childCount > 0) {
   childWidth = (rw - (columnNum - 1) * childHorizontalSpacE) / columnNum;

   childHeight = childWidth;

   int vw = rw;
   if (childCount < columnNum) {
    vw = childCount * (childHeight + childVerticalSpacE);
   }
   int rowCount = childCount / columnNum + (childCount % columnNum != 0 ? 1 : 0);

   int vh = rowCount * childHeight + (rowCount > 0 ? rowCount - 1 : 0) * childVerticalSpace;

   setMeasuredDimension(vw,vh);
  }
 }

 @Override
 protected void onLayout(Boolean changed,int l,int t,int r,int b) {
  int left = 0;
  int top = 0;
  int count = getChildCount();
  for (int i = 0; i < count; i++) {
   View child = getChildAt(i);
   left = (i % columnNum) * (childWidth + childHorizontalSpacE);
   top = (i / columnNum) * (childHeight + childVerticalSpacE);
   child.layout(left,top,left + childWidth,top + childHeight);
  }
 }

在xml中引用：

<com.whoislcj.animation.GridImageViewGroup
   android:id="@+id/image_layout"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:layout_margin="10dp"
   android:animateLayoutChanges="true"
   lee:childHorizontalSpace="10dp"
   lee:childVerticalSpace="10dp"
   lee:columnNum="3"/>

在Activity中调用：

private void initViews() {
  mImageViewGroup = (GridImageViewGroup) findViewById(R.id.image_layout);
  ImageView imageView = new ImageView(this);
  imageView.setImageresource(R.mipmap.add_imagE);
  imageView.setOnClickListener(new View.onClickListener() {
   @Override
   public void onClick(View v) {
    addImageView();
   }
  });
  mImageViewGroup.addView(imageView);
 }

 public void addImageView() {
  final ImageView imageView = new ImageView(MainActivity4.this);
  imageView.setImageresource(R.mipmap.lottery);
  imageView.setOnClickListener(new View.onClickListener() {
   @Override
   public void onClick(View v) {
    mImageViewGroup.removeView(imageView);
   }
  });
  mImageViewGroup.addView(imageView,0);
 }

实现效果如下：

Android动画效果之自定义ViewGroup添加布局动画（五）

布局动画产生的背景：

凡事总要问个明白，为何要引入布局动画呢？其实通过上面的实现效果可以看出，在添加和删除图片时都显得很突兀，不知道该用什么语言形容了，总之就是感觉不舒服。其实我平时在开发中调用View.setVisibility()方法时也会有这种感受，这也是布局动画产生的一个背景吧。

布局动画：

布局动画是指ViewGroup在布局时产生的动画效果。实现布局动画有如下几种方式
第一种方式：在xml中，对ViewGrope设置android:animateLayoutChanges="true"属性：

<com.whoislcj.animation.GridImageViewGroup
   android:id="@+id/image_layout"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:layout_margin="10dp"
   android:animateLayoutChanges="true"
   lee:childHorizontalSpace="10dp"
   lee:childVerticalSpace="10dp"
   lee:columnNum="3"/>

就这么简单的一句话实现的效果就可以实现了，看看效果如何

Android动画效果之自定义ViewGroup添加布局动画（五）

这种方式虽然简单但是实现的布局动画比较单一，下面看第二种方式。

第二种方式：LayoutTransition实现

 LayoutTransition mLayoutTransition = new LayoutTransition();

  //设置每个动画持续的时间
  mLayoutTransition.setStagger(LayoutTransition.CHANGE_APPEARING,50);
  mLayoutTransition.setStagger(LayoutTransition.CHANGE_DISAPPEARING,50);
  mLayoutTransition.setStagger(LayoutTransition.APPEARING,50);
  mLayoutTransition.setStagger(LayoutTransition.DISAPPEARING,50);

  PropertyValuesHolder appearingScaleX = PropertyValuesHolder.ofFloat("scaleX",0.5f,1.0f);
  PropertyValuesHolder appearingScaleY = PropertyValuesHolder.ofFloat("scaleY",1.0f);
  PropertyValuesHolder appearingAlpha = PropertyValuesHolder.ofFloat("alpha",0f,1f);
  ObjectAnimator mAnimatorAppearing = ObjectAnimator.ofPropertyValuesHolder(this,appearingAlpha,appearingScaleX,appearingScaleY);
  //为LayoutTransition设置动画及动画类型
  mLayoutTransition.setAnimator(LayoutTransition.APPEARING,mAnimatorAppearing);


  PropertyValuesHolder disappearingAlpha = PropertyValuesHolder.ofFloat("alpha",1f,0f);
  PropertyValuesHolder disappearingRotationY = PropertyValuesHolder.ofFloat("rotationY",0.0f,90.0f);
  ObjectAnimator mAnimatorDisappearing = ObjectAnimator.ofPropertyValuesHolder(this,disappearingAlpha,disappearingRotationY);
  //为LayoutTransition设置动画及动画类型
  mLayoutTransition.setAnimator(LayoutTransition.DISAPPEARING,mAnimatorDisappearing);


  ObjectAnimator mAnimatorChangeDisappearing = ObjectAnimator.ofFloat(null,"alpha",0f);
  //为LayoutTransition设置动画及动画类型
  mLayoutTransition.setAnimator(LayoutTransition.CHANGE_DISAPPEARING,mAnimatorChangeDisappearing);

  ObjectAnimator mAnimatorChangeAppearing = ObjectAnimator.ofFloat(null,0f);
  //为LayoutTransition设置动画及动画类型
  mLayoutTransition.setAnimator(LayoutTransition.CHANGE_APPEARING,mAnimatorChangeAppearing);

  //为mImageViewGroup设置mLayoutTransition对象
  mImageViewGroup.setLayoutTransition(mLayoutTransition);

上面通过自定义LayoutTransition 修改系统提高的默认动画效果，如果不需要自定义的动画效果的话，不@L_829_25@mLayoutTransition.setAnimator(LayoutTransition.DISAPPEARING,mAnimatorDisappearing);就行了。
LayoutTransition 提供了以下几种过渡类型：
•APPEARING ―― 元素在容器中显现时需要动画显示。
•CHANGE_APPEARING ―― 由于容器中要显现一个新的元素，其它元素的变化需要动画显示。
•DISAPPEARING ―― 元素在容器中消失时需要动画显示。
•CHANGE_DISAPPEARING ―― 由于容器中某个元素要消失，其它元素的变化需要动画显示。

看下修改过的动画效果：

Android动画效果之自定义ViewGroup添加布局动画（五）

第三种方式：通过设置LayoutAnimation来实现布局动画

 AlphaAnimation alphaAnimation = new AlphaAnimation(0f,1f);
  alphaAnimation.setDuration(200);
  LayoutAnimationController animationController = new LayoutAnimationController(alphaAnimation,0.5f);
  animationController.setOrder(LayoutAnimationController.order_nORMAL);
  mImageViewGroup.setLayoutAnimation(animationController);

显示顺序有以下几种：
• order_nORMAL;//顺序显示
• ORDER_REVERSE;//反显示
• ORDER_RANDOM//随机显示

也可以通过xml实现

<?xml version="1.0" encoding="utf-8"?>
<layoutAnimation
 xmlns:android="http://scheR_946_11845@as.android.com/apk/res/android"
 android:delay="0.5"
 android:animationOrder="normal"
 android:animation="@anim/alpha"
 />

ViewGroup xml添加android:layoutAnimation属性

 <com.whoislcj.animation.GridImageViewGroup
   android:id="@+id/image_layout"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:layout_margin="10dp"
   android:layoutAnimation="@anim/layoutanimation"
   lee:childHorizontalSpace="10dp"
   lee:childVerticalSpace="10dp"
   lee:columnNum="3"/>

由于这种方式采用的是补间动画，个人不再推荐使用这种方式，原因很简单实现的动画效果相对单一。

总结：

本篇学习了布局动画，自此Android的动画学习也将告一段落了，接下来准备总结一下学习动画的过程中遇见的编程知识，比如链式编程，TreadLocal等。

大佬总结

以上是大佬教程为你收集整理的Android动画效果之自定义ViewGroup添加布局动画（五）全部内容，希望文章能够帮你解决Android动画效果之自定义ViewGroup添加布局动画（五）所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。

标签：

上一篇: Android自定义View实现打字机效果下一篇:java – 具有ArrayList和ListVie...

猜你在找的Android相关文章

对自己的文件使用keystore签名 2022-04-28
Android的onCreateOptionsMenu()创建菜单Menu详解 2019-10-14
CSS3 Media Queries(响应式布局可以让你定制不同的分辨率和设备) 2019-10-14
JQueryMobile + PhoneGap 经验总结 2019-10-14
响应式布局设置--@media only screen and 2019-10-14
-webkit-min-device-pixel-ratio的常见值对照 2019-10-14
Android 打包签名从生成keystore到完成签名 -- 转 2019-10-14
Android App启动错误的问题（connection to the server was unsuccessful） 2019-10-14
关于使用微信登录第三方APP的实现（Android版） 2019-10-14
android 为应用程序创建桌面快捷方式技巧分享 2019-10-14