android ConstraintLayoutStates - how to get a reference to constraintLayoutStates object?

Question

i am following this very short tutorial here and i would like to trigger different views based on some action. but i cant even get a reference to the ConstraintLayoutStates. Let me show you what i have so far:

dependency: implementation 'com.android.support.constraint:constraint-layout:2.0.0-alpha2'

i have an initial file i am loading which contains the layout states. it looks like this:

main_states_layout.xml:

    <ConstraintLayoutStates
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
>
        <State
                android:id="@+id/start"
                app:constraints="@layout/start_layout"/>
        <State
                android:id="@+id/loading"
                app:constraints="@layout/activity_cl_states_loading"/>
        <State
                android:id="@+id/end"
                app:constraints="@layout/activity_cl_states_end"/>
    </ConstraintLayoutStates>

when i then go into my activity to try and reference the ConstraintLayoutStates i either do not know how or it wont compile but android studio says it cant find a reference to it. any ideas ?

UPDATE: I HAVE tried to use my own constraintLayout and set the description as mentioned but the view will not update: here is what i have so far:

class MainActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.main_activity)
    stateConstraintLayout.loadLayoutDescription(R.xml.main_states_layout)

    myButton.setOnClickListener {
        stateConstraintLayout.setState(R.id.start, 110, 3000)
    }
}

//here all i want above is for the when button is clicked the view changes

lets take a look at the contents of main_activity.xml:

    <?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"
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        android:id="@+id/stateConstraintLayout"
>
    <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:id="@+id/myButton"
            android:text="press me" app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintEnd_toEndOf="parent"/>
</android.support.constraint.ConstraintLayout>

and the main_states_layout which is in the xml res folder looks like this:

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

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

    <State
            android:id="@+id/start"
            app:constraints="@layout/start_layout"/>
    <State
            android:id="@+id/loading"
            app:constraints="@layout/loading_layout"/>

</ConstraintLayoutStates>

and the start_layout simply shows text with a green background (but it never appears):

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

<android.support.constraint.ConstraintLayout
        xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:background="@color/colorPrimary"
        android:layout_height="match_parent">

    <TextView android:layout_width="wrap_content"
              android:layout_height="wrap_content"

              android:text="My started layout"
              android:textSize="21sp"
              android:textColor="@android:color/holo_orange_light"
              android:id="@+id/appCompatTextView"
              app:layout_constraintTop_toTopOf="parent"
              app:layout_constraintStart_toStartOf="parent"
              app:layout_constraintEnd_toEndOf="parent"
              app:layout_constraintHorizontal_bias="0.5"/>
</android.support.constraint.ConstraintLayout>

when the button is clicked see the code getting called in the onclicklistener but nothing updates, why ?

Answer 1

first you need check u're import synthetic

import kotlinx.android.synthetic.main.main_activity.*

after that you need same widget in your layout, like that

main activity.xml

<?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"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/stateConstraintLayout"
>
    <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:id="@+id/myButton"
            android:text="press me" app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintEnd_toEndOf="parent"
          android:visiblity="visible"/>


<TextView android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:visiblity="gone"
              android:text="My started layout"
              android:textSize="21sp"
              android:textColor="@android:color/holo_orange_light"
              android:id="@+id/appCompatTextView"
              app:layout_constraintTop_toTopOf="parent"
              app:layout_constraintStart_toStartOf="parent"
              app:layout_constraintEnd_toEndOf="parent"
              app:layout_constraintHorizontal_bias="0.5"/>
</android.support.constraint.ConstraintLayout>

start_layout.xml

<?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"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/stateConstraintLayout"
>
    <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:id="@+id/myButton"
            android:text="press me" app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintEnd_toEndOf="parent"
          android:visiblity="gone"/>

      <TextView android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:visiblity="visible"
          android:text="My started layout"
          android:textSize="21sp"
          android:textColor="@android:color/holo_orange_light"
          android:id="@+id/appCompatTextView"
          app:layout_constraintTop_toTopOf="parent"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintHorizontal_bias="0.5"/>
</android.support.constraint.ConstraintLayout>

Answer 2

simply put, you should create your own ConstraintLayout object.

ConstraintLayout constraintlayout = new ConstraintLayout

then you can use your object to access the methods like the loadLayoutDescription you have there

Answer 3

loadLayoutDescription() is a method on ConstraintLayout.

In Rebecca's example, she might be using Kotlin synthetic accessors to get to a ConstraintLayout named stateConstraintLayout. You would replace that with a reference to your desired ConstraintLayout.