美文网首页
ConstraintSet 使用

ConstraintSet 使用

作者: 陽光亽活力 | 来源:发表于2023-04-26 09:37 被阅读0次

    动态修改

    1、状态开始的状态


    image.png
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/rootPortalConstraintLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/bg_page"
        android:orientation="vertical">
    
        <Button
            android:id="@+id/button1"
            android:layout_width="200dp"
            android:layout_height="50dp"
            android:layout_marginTop="200dp"
            android:text="Button1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
        <Button
            android:id="@+id/button2"
            android:layout_width="200dp"
            android:layout_height="50dp"
            android:layout_marginTop="200dp"
            android:text="Button2"
            app:layout_constraintEnd_toEndOf="parent"
    -----------------变化处--------------------------------
            app:layout_constraintStart_toStartOf="parent"
    -------------------------------------------------
            app:layout_constraintTop_toBottomOf="@+id/button1" />
    
    </androidx.constraintlayout.widget.ConstraintLayout>
    

    2、变换后的状态


    image.png
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/rootPortalConstraintLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/bg_page"
        android:orientation="vertical">
    
        <Button
            android:id="@+id/button1"
            android:layout_width="200dp"
            android:layout_height="50dp"
            android:layout_marginTop="200dp"
            android:text="Button1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
        <Button
            android:id="@+id/button2"
            android:layout_width="200dp"
            android:layout_height="50dp"
            android:layout_marginTop="200dp"
            android:text="Button2"
            app:layout_constraintEnd_toEndOf="parent"
    -------------------不同之处------------------------------
            app:layout_constraintStart_toEndOf="@+id/button1"
    -------------------------------------------------
            app:layout_constraintTop_toBottomOf="@+id/button1" />
    
    </androidx.constraintlayout.widget.ConstraintLayout>
    

    动态实现

            ConstraintLayout constraintLayout = view.findViewById(R.id.constraint);
    
            ConstraintSet constraintSet = new ConstraintSet();
            constraintSet.clone(constraintLayout);
            constraintSet.clear(R.id.constraint);
    ----------------------动态改变-----------
            // app:layout_constraintStart_toEndOf="@+id/button1"
            constraintSet.connect(R.id.button2, ConstraintSet.START, R.id.button1, ConstraintSet.END);
    -----------------------------------------------
            // app:layout_constraintTop_toBottomOf="@+id/button1"
            constraintSet.connect(R.id.button2, ConstraintSet.TOP, R.id.button1, ConstraintSet.BOTTOM);
            // app:layout_constraintEnd_toEndOf="parent"
            constraintSet.connect(R.id.button2, ConstraintSet.END, ConstraintSet.PARENT_ID, ConstraintSet.END);
            //app:layout_constraintBottom_toBottomOf="parent"
            constraintSet.connect(R.id.button2, ConstraintSet.BOTTOM, ConstraintSet.PARENT_ID, ConstraintSet.BOTTOM);
    
            //距左边10px
            //constraintSet.connect(R.id.button2, ConstraintSet.START, R.id.button1, ConstraintSet.END,10);
    
            constraintSet.applyTo(constraintLayout);
    
    
    二、通过两个布局实现动画,在屏幕旋转,点击特效等使用有奇效。

    关键字:

    TransitionManager
     ConstraintSet constraintSet = new ConstraintSet();
            if (isClick) {
                isClick = false;
                constraintSet.clone(getContext(), R.layout.portal_service);
                Transition transition = new ChangeBounds();
                transition.setInterpolator(new AnticipateOvershootInterpolator(1.0f));
                transition.setDuration(1000);
                TransitionManager.beginDelayedTransition(getBinding().rootPortalConstraintLayout, transition);
                constraintSet.applyTo(getBinding().rootPortalConstraintLayout);
            } else {
                isClick = true;
                constraintSet.clone(getContext(), R.layout.portal_service_v);
                Transition transition = new ChangeBounds();
                transition.setInterpolator(new AnticipateOvershootInterpolator(1.0f));
                transition.setDuration(1000);
                TransitionManager.beginDelayedTransition(getBinding().rootPortalConstraintLayout, transition);
                constraintSet.applyTo(getBinding().rootPortalConstraintLayout);
            }
            constraintSet.applyTo(getBinding().rootPortalConstraintLayout);
    

    更多使用参考API

    相关文章

      网友评论

          本文标题:ConstraintSet 使用

          本文链接:https://www.haomeiwen.com/subject/qocvjdtx.html