Unresolved reference to constraintLayout variable in Kotlin code in android app-CodePudding

I am following this tutorial to create an android app with space animation stuff. In the step titled "Transition Manager" you're instructed to add the following code to your MainActivity.kt file: `

constraintSet1.clone(constraintLayout) //1
constraintSet2.clone(this, R.layout.activity_main) //2

departButton.setOnClickListener { //3
  //apply the transition
  TransitionManager.beginDelayedTransition(constraintLayout) //4
  val constraint = if (!isOffscreen) constraintSet1 else constraintSet2
  isOffscreen = !isOffscreen
  constraint.applyTo(constraintLayout) //5
}

` When this code is added the variable "constraintLayout" throws up an unresolved reference error

I think constraintLayout is supposed to be pointing to something in the xml and something is failing to make that happen, I just don't know what.

The kotlin code after adding the above block is: `

package com.raywenderlich.android.razegalactic

import android.os.Bundle
import android.support.constraint.*
import android.support.v7.app.AppCompatActivity
import android.transition.TransitionManager
import kotlinx.android.synthetic.main.keyframe1.*


/**
 * Main Screen
 */
class MainActivity : AppCompatActivity() {
  private val constraintSet1 = ConstraintSet()
  private val constraintSet2 = ConstraintSet()

  private var isOffscreen = true

  override fun onCreate(savedInstanceState: Bundle?) {


    super.onCreate(savedInstanceState)
    setContentView(R.layout.keyframe1)

    switch1.setOnCheckedChangeListener { _, isChecked ->
      switch1.setText(if (isChecked) R.string.round_trip else R.string.one_way)


    constraintSet1.clone(constraintLayout) //1
    constraintSet2.clone(this, R.layout.activity_main) //2

    departButton.setOnClickListener { //3
      //apply the transition
      TransitionManager.beginDelayedTransition(constraintLayout) //4
      val constraint = if (!isOffscreen) constraintSet1 else constraintSet2
      isOffscreen = !isOffscreen
      constraint.applyTo(constraintLayout) //5
      }
    }
  }
}

The main xml is as follows: `

<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:id="@ id/ConstraintLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    android:orientation="vertical"
    tools:context=".MainActivity">


  <ImageView
      android:id="@ id/flightsIcon"
      android:layout_width="30dp"
      android:layout_height="30dp"
      android:src="@drawable/rocket_icon"
      app:layout_constraintBottom_toBottomOf="@ id/spaceStationIcon"
      app:layout_constraintEnd_toStartOf="@ id/roverIcon"
      app:layout_constraintStart_toEndOf="@ id/spaceStationIcon"
      app:layout_constraintTop_toTopOf="@ id/spaceStationIcon" />


  <ImageView
      android:id="@ id/spaceStationIcon"
      android:layout_width="30dp"
      android:layout_height="30dp"
      android:layout_marginTop="15dp"
      android:src="@drawable/space_station_icon"
      app:layout_constraintEnd_toStartOf="@ id/flightsIcon"
      app:layout_constraintHorizontal_chainStyle="spread"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toTopOf="parent" />

  <ImageView
      android:id="@ id/roverIcon"
      android:layout_width="30dp"
      android:layout_height="30dp"
      android:src="@drawable/rover_icon"
      app:layout_constraintBottom_toBottomOf="@ id/flightsIcon"
      app:layout_constraintEnd_toEndOf="parent"

      app:layout_constraintStart_toEndOf="@ id/flightsIcon"
      app:layout_constraintTop_toTopOf="@ id/flightsIcon" />

  <TextView
      android:id="@ id/spaceStationLabel"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginTop="15dp"
      android:text="@string/space_stations"
      app:layout_constraintEnd_toEndOf="@ id/spaceStationIcon"
      app:layout_constraintStart_toStartOf="@ id/spaceStationIcon"
      app:layout_constraintTop_toBottomOf="@ id/spaceStationIcon" />

  <TextView
      android:id="@ id/textView1"
      android:layout_width="124dp"
      android:layout_height="98dp"
      android:layout_marginEnd="40dp"
      android:background="@color/colorPrimary"
      android:gravity="center"
      android:paddingEnd="20dp"
      android:text="@string/dca"
      android:textColor="@android:color/white"
      app:layout_constraintBottom_toBottomOf="@ id/doubleArrowsIcon"
      app:layout_constraintEnd_toEndOf="@ id/doubleArrowsIcon"
      app:layout_constraintTop_toTopOf="@ id/doubleArrowsIcon" />

  <TextView
      android:id="@ id/roverLabel"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginTop="15dp"
      android:text="@string/rovers"
      app:layout_constraintEnd_toEndOf="@ id/roverIcon"
      app:layout_constraintStart_toStartOf="@ id/roverIcon"
      app:layout_constraintTop_toBottomOf="@ id/roverIcon" />

  <TextView
      android:id="@ id/textView2"
      android:layout_width="124dp"
      android:layout_height="98dp"
      android:layout_marginStart="40dp"
      android:background="@color/colorPrimary"
      android:gravity="center"
      android:paddingStart="20dp"
      android:text="@string/mars"
      android:textColor="@android:color/white"
      app:layout_constraintBottom_toBottomOf="@ id/doubleArrowsIcon"
      app:layout_constraintStart_toStartOf="@ id/doubleArrowsIcon"
      app:layout_constraintTop_toTopOf="@ id/doubleArrowsIcon" />

  <TextView
      android:id="@ id/flightsLabel"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginTop="15dp"
      android:text="@string/flights"
      app:layout_constraintEnd_toEndOf="@ id/flightsIcon"
      app:layout_constraintStart_toStartOf="@ id/flightsIcon"
      app:layout_constraintTop_toBottomOf="@ id/flightsIcon" />

  <ImageView
      android:id="@ id/doubleArrowsIcon"
      android:layout_width="60dp"
      android:layout_height="60dp"
      android:layout_marginBottom="40dp"
      android:src="@drawable/double_arrows"
      app:layout_constraintBottom_toTopOf="@ id/guideline1"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toStartOf="parent" />

  <Switch
      android:id="@ id/switch1"
      android:layout_width="160dp"
      android:layout_height="wrap_content"
      android:layout_marginStart="8dp"
      android:layout_marginTop="200dp"
      android:background="@color/colorAccent"
      android:checked="false"
      android:padding="8dp"
      android:switchPadding="24dp"
      android:text="@string/one_way"
      android:textColor="@android:color/white"
      app:layout_constraintStart_toStartOf="@ id/guideline2"
      app:layout_constraintTop_toTopOf="parent" />

  <TextView
      android:id="@ id/textView3"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginStart="8dp"
      android:layout_marginTop="8dp"
      android:background="@color/colorAccent"
      android:padding="8dp"
      android:text="@string/traveller"
      android:textColor="@android:color/white"
      app:layout_constraintStart_toStartOf="@ id/guideline2"
      app:layout_constraintTop_toBottomOf="@ id/switch1" />

  <ImageView
      android:id="@ id/rocketIcon"
      android:layout_width="30dp"
      android:layout_height="30dp"
      android:layout_marginEnd="8dp"
      android:src="@drawable/rocket_icon"
      app:layout_constraintCircle="@id/galaxyIcon"
      app:layout_constraintCircleAngle="270"
      app:layout_constraintCircleRadius="100dp" />

  <ImageView
      android:id="@ id/galaxyIcon"
      android:layout_width="90dp"
      android:layout_height="90dp"
      android:src="@drawable/galaxy"
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintHorizontal_bias="0.498"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toTopOf="@ id/guideline1"
      app:layout_constraintVertical_bias="0.495" />

  <Button
      android:id="@ id/departButton"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:text="@string/depart"
      android:textColor="@android:color/white"
      app:backgroundTint="@color/colorPrimary"
      app:layout_constraintBottom_toBottomOf="parent"
      tools:layout_editor_absoluteX="158dp" />

  <android.support.constraint.Guideline
      android:id="@ id/guideline1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:orientation="horizontal"
      app:layout_constraintGuide_begin="0dp" />

  <android.support.constraint.Guideline
      android:id="@ id/guideline2"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:orientation="vertical"
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintGuide_percent="1" />


</android.support.constraint.ConstraintLayout>

` can anyone tell me what I might be missing or how this can be fixed? Thanks in advance.

CodePudding user response：

You're suppose to reference a view from the xml before you can use it.

Do this, also if the name of the layout the MainActivity is suppose to use is main.xml, it should be the one your setContentView use not some other layout.

lateinit var cosntraintLayout: ConstraintLayout

override fun onCreate(savedInstanceState: Bundle?) {

    super.onCreate(savedInstanceState)
    setContentView(R.layout.main) // <- main.xml
    cosntraintLayout = findViewById<ConstraintLayout>(R.id.ConstraintLayout) // <- add this line
  
    ...
    ...
}

switch1 and departButton will also throw the same error, but I'll leave it for you to figure it out based on the code I provided.