android 布局动画效果图,ConstraintLayout布局初试之环形动画效果

虽然ConstraintLayout发布已经有几年了，但是笔者还一直未用过。只知道它非常强大，相比以往的布局其不存在view的嵌套，对于解析器及图形渲染就更快，效率自然就高了！“纸上得来终觉浅，绝知此事须(要)躬行”

先引用一篇文章：https://www.jianshu.com/p/17ec9bd6ca8a ，写的可谓意简言赅，文章内容我就不多演示，本文仅展示ConstraintLayout部分功能。

上效果图：

Java代码package com.lee.lgt;

import android.app.Activity;

import android.os.Bundle;

import android.os.Handler;

import android.os.Message;

import android.support.constraint.ConstraintLayout.LayoutParams;

import android.view.Window;

import android.widget.TextView;

public class MainActivity extends Activity {

private LayoutParams params;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

requestWindowFeature(Window.FEATURE_NO_TITLE);

setContentView(R.layout.activity_main);

final TextView tv = findViewById(R.id.TextView4);

Handler handler = new Handler() {

@Override

public void handleMessage(Message msg) {

super.handleMessage(msg);

params.circleAngle += 5f;

tv.setLayoutParams(params);

removeMessages(msg.what);

sendEmptyMessageDelayed((int) params.circleAngle % 360, 10);

}

};

if (tv.getLayoutParams() instanceof LayoutParams) {

params = (LayoutParams) tv.getLayoutParams();

handler.sendEmptyMessageDelayed((int) params.circleAngle, 1000);

}

}

}

xml代码<?xml  version="1.0" encoding="utf-8"?>

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity">

android:id="@+id/TextView1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:background="@color/colorAccent"

android:text="111"

android:textColor="@android:color/white"

app:layout_constraintBottom_toBottomOf="parent"

app:layout_constraintHorizontal_weight="1"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintRight_toLeftOf="@id/TextView2"

app:layout_constraintTop_toTopOf="parent" />

android:id="@+id/TextView2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:background="@color/colorPrimary"

android:text="222"

android:textColor="@android:color/white"

app:layout_constraintHorizontal_weight="3"

app:layout_constraintLeft_toRightOf="@id/TextView1"

app:layout_constraintRight_toLeftOf="@id/TextView3"

app:layout_constraintTop_toTopOf="@id/TextView1" />

android:id="@+id/TextView3"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:background="@color/colorPrimaryDark"

android:text="333"

android:textColor="@android:color/white"

app:layout_constraintHorizontal_weight="5"

app:layout_constraintLeft_toRightOf="@id/TextView2"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintTop_toTopOf="@id/TextView1" />

android:id="@+id/TextView4"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:background="@color/colorPrimaryDark"

android:text="444"

android:textColor="@android:color/white"

app:layout_constraintCircle="@id/TextView1"

app:layout_constraintCircleAngle="150"

app:layout_constraintCircleRadius="50dp"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintTop_toTopOf="parent" />

android:id="@+id/TextView5"

android:layout_width="0dp"

android:layout_height="wrap_content"

android:layout_marginTop="30dp"

android:background="@color/colorAccent"

android:text="555"

android:textColor="@android:color/white"

app:layout_constraintHorizontal_weight="2"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintRight_toLeftOf="@id/TextView6"

app:layout_constraintTop_toBottomOf="@id/TextView4" />

android:id="@+id/TextView6"

android:layout_width="0dp"

android:layout_height="wrap_content"

android:background="@color/colorPrimary"

android:text="666"

android:textColor="@android:color/white"

app:layout_constraintHorizontal_weight="3"

app:layout_constraintLeft_toRightOf="@id/TextView5"

app:layout_constraintRight_toLeftOf="@id/TextView7"

app:layout_constraintTop_toTopOf="@id/TextView5" />

android:id="@+id/TextView7"

android:layout_width="0dp"

android:layout_height="wrap_content"

android:background="@color/colorPrimaryDark"

android:text="777"

android:textColor="@android:color/white"

app:layout_constraintHorizontal_weight="5"

app:layout_constraintLeft_toRightOf="@id/TextView2"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintTop_toTopOf="@id/TextView5" />

android:id="@+id/TextView8"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginTop="30dp"

android:background="@color/colorAccent"

android:text="888"

android:textColor="@android:color/white"

app:layout_constraintHorizontal_bias="0.2"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintTop_toBottomOf="@id/TextView5" />

android:id="@+id/TextView9"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginTop="30dp"

android:background="@color/colorPrimary"

android:text="999"

android:textColor="@android:color/white"

app:layout_constraintHorizontal_bias="0.5"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintTop_toBottomOf="@id/TextView5" />

android:id="@+id/TextViewA"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginTop="30dp"

android:background="@color/colorPrimaryDark"

android:text="999"

android:textColor="@android:color/white"

app:layout_constraintHorizontal_bias="0.9"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintTop_toBottomOf="@id/TextView5" />

总共就2层搞定所有需求，是不是感觉强大呢？