Android View以编程方式setVerticalBias与ConstraintLayout中的Transition

时间:2017-08-16 17:19:27

标签: android android-layout android-view android-transitions android-constraintlayout

我需要在ConstraintLayout中垂直移动一些视图,最好使用过渡效果(以避免“跳过”)。

布局只是一个带有几个小部件(没有层次结构)的约束布局,所有小部件都被约束到父级。

我的布局文件:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
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"
android:gravity="center"
android:orientation="vertical"
android:id="@+id/myLayout"
tools:context="com.example.quant.icarus.MainActivity">

<SurfaceView
    android:id="@+id/surfaceView1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" />

<Button
    android:id="@+id/button1"
    android:layout_width="125dp"
    android:layout_height="48dp"
    android:alpha="0.5"
    android:background="@drawable/button_border"
    android:textColor="@color/ret_text"
    app:layout_constraintVertical_bias="0.97"
    app:layout_constraintHorizontal_bias="0.2"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:text="some text" />

<Button
    android:id="@+id/button2"
    android:layout_width="125dp"
    android:layout_height="48dp"
    android:alpha="0.5"
    app:layout_constraintVertical_bias="0.97"
    app:layout_constraintHorizontal_bias="0.8"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:text="some text" />

<SeekBar
    android:id="@+id/prog_bar"
    android:layout_width="210dp"
    android:layout_height="40dp"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:thumb="@drawable/seekbar_thumb"
    android:max="100"
    android:progress="0"
    android:rotation="270" />

<TextView
    android:id="@+id/prog_text"
    android:layout_width="wrap_content"
    android:layout_height="20dp"
    app:layout_constraintVertical_bias="0.1"
    app:layout_constraintLeft_toLeftOf="@+id/prog_bar"
    app:layout_constraintRight_toRightOf="@+id/prog_bar"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:text="some text"/>

<View
    android:id="@+id/viewToMove1"
    android:layout_width="40dp"
    android:layout_height="1dp"
    app:layout_constraintVertical_bias="0.2"
    app:layout_constraintHorizontal_bias="0.34"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:background="@color/ret_text" />

<View
    android:id="@+id/viewToMove2"
    android:layout_width="40dp"
    android:layout_height="1dp"
    app:layout_constraintVertical_bias="0.35"
    app:layout_constraintHorizontal_bias="0.34"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:background="@color/ret_text" />

<View
    android:layout_width="1dp"
    android:layout_height="30dp"
    app:layout_constraintVertical_bias="0.35"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:background="@color/ret_text" />

<View
    android:layout_width="1dp"
    android:layout_height="30dp"
    app:layout_constraintVertical_bias="0.65"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:background="@color/ret_text" />

</android.support.constraint.ConstraintLayout>

两个视图vewToMove1和viewToMove2将以编程方式重新定位。但是,当我尝试以下操作时,我遇到了2个问题。 1)某些其他元素在屏幕上的位置不正确,但视图会移动 - 跳过。 2)如果我尝试过渡,则移动的视图根本不会移动(其他元素的位置仍然不正确。

以下是相关的Java代码。

public class MainActivity extends AppCompatActivity {

    ConstraintSet cSet = new ConstraintSet();
    ConstraintLayout cLayout;

    @Override
    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        }

    @Override
    protected void onResume() {
        super.onResume();

        //Thread which updates views.
        TimerTask move_views = new TimerTask(){
            @Override
            public void run() {

                //some code here...

                runOnUiThread(new Runnable() {
                    @Override
                    public void run() {

                        cLayout = (ConstraintLayout) findViewById(R.id.myLayout);//can this be put in onCreate or need to wait until render complete?
                        cSet.clone(cLayout);

                        //TransitionManager.beginDelayedTransition(cLayout);//adding this removes View movement.

                        cSet.setVerticalBias(R.id.viewToMove1,0.43f);//updated in the above thread.
                        cSet.setVerticalBias(R.id.viewToMove2,0.68f);

                        cSet.applyTo(cLayout);

                    }
                });

            }
        };

        Timer move_views_timer = new Timer();
        move_views_timer.scheduleAtFixedRate(move_views,10,10);//time in milliseconds
    }


}

我无法弄清楚为什么其他一些观点会受到此操作的影响,以及为什么转换不起作用。

我有一个想法:在克隆约束之前,我是否需要等待布局完成加载(某种回调)?我该怎么做?

2 个答案:

答案 0 :(得分:2)

从未弄清楚原始方法出了什么问题,但这对我有用(当然对更清洁的解决方案开放):

Animation a = new Animation() {
    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        ConstraintLayout.LayoutParams lparams = (ConstraintLayout.LayoutParams) myViewToMove1.getLayoutParams();
        lparams.verticalBias = 0.43f;
        myViewToMove1.setLayoutParams(lparams);
    }
};
a.setDuration(8); // in ms
a.setFillAfter(true);
myViewToMove1.startAnimation(a);

为每个视图定义一个新动画。 PS:基于另一个SO问题的答案,我找不到了。

答案 1 :(得分:2)

所以在搜索了一段时间之后我找到了一个答案,它允许你做一个平滑的过渡以及改变偏见。你的答案是部分正确但不正确的100%。

首先你需要两个约束集1,它将具有所需的效果,而另一个将重置这些效果。

private ConstraintSet applyConstraint=new ConstraintSet();
private ConstraintSet resetConstraint = new ConstraintSet();

然后你需要在这两个ConstraintSet上设置约束ConstraintLayout。设置ConstraintLayout我的意思是找到它的id并将其设置为ConstraintSet

applyConstraint.clone(constraintLayout);
resetConstraint.clone(constraintLayout);

然后你需要在我们的例子中指定更改它是设置垂直偏差。

public void applyEffect(){
    TransitionManager.beginDelayedTransition(constraintLayout);//For smooth transition.
    applyConstraint.setVerticalBias(R.id.camera_button,0.43f);
    applyConstraint.applyTo(constraintLayout);
}

要恢复效果,请使用resetConstraint

public void resetEffect(){
    TransitionManager.beginDelayedTransition(constraintLayout);
    resetConstraint.applyTo(constraintLayout);
}