title: Make carousel card fullScreen on click
body: <p>I have a carousel and I want to make the current card fullscreen on click. When the current card is fullscreen some additional data should be visible.
  I am new to Android and I have the feeling that I am doing something wrong. I have already tried to implement it via different onClickListeners and Animations (because i also need a smooth transition), but nothing worked.</p>
  <p>Does anyone has a suggestion on how to achieve this? (please see my carousel layout implementation below)</p>
  <pre><code>&lt;androidx.constraintlayout.motion.widget.MotionLayout xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;
              android:id=&quot;@+id/motion_layout_carousel&quot;
              android:layout_width=&quot;match_parent&quot;
              android:layout_height=&quot;wrap_content&quot;
              android:visibility=&quot;invisible&quot;
              app:layout_constraintTop_toBottomOf=&quot;@+id/player_image_with_elements&quot;
              app:layout_constraintLeft_toLeftOf=&quot;parent&quot;
              app:layout_constraintRight_toRightOf=&quot;parent&quot;
              app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
              app:layoutDescription=&quot;@xml/demo_020_carousel_scene&quot;&gt;
  
              &lt;LinearLayout
                  android:id=&quot;@+id/imageView0&quot;
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  android:layout_marginEnd=&quot;5dp&quot;
                  android:orientation=&quot;vertical&quot;
                  android:scaleType=&quot;centerCrop&quot;
                  app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
                  app:layout_constraintEnd_toStartOf=&quot;@+id/imageView1&quot;
                  app:layout_constraintTop_toTopOf=&quot;parent&quot;&gt;
  
                  &lt;include
                      layout=&quot;@layout/match_statistic&quot;
                      android:background=&quot;@drawable/layout_rounded&quot;
                      android:layout_width=&quot;match_parent&quot;
                      android:layout_height=&quot;wrap_content&quot; /&gt;
              &lt;/LinearLayout&gt;
  
              &lt;LinearLayout
                  android:id=&quot;@+id/imageView1&quot;
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  android:layout_marginEnd=&quot;5dp&quot;
                  android:orientation=&quot;vertical&quot;
                  android:scaleType=&quot;centerCrop&quot;
                  app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
                  app:layout_constraintEnd_toStartOf=&quot;@+id/imageView2&quot;
                  app:layout_constraintTop_toTopOf=&quot;parent&quot;&gt;
  
                  &lt;include
                      layout=&quot;@layout/match_statistic&quot;
                      android:background=&quot;@drawable/layout_rounded&quot;
                      android:layout_width=&quot;match_parent&quot;
                      android:layout_height=&quot;wrap_content&quot; /&gt;
              &lt;/LinearLayout&gt;
  
              &lt;LinearLayout
                  android:id=&quot;@+id/imageView2&quot;
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  android:orientation=&quot;vertical&quot;
                  android:scaleType=&quot;centerCrop&quot;
                  app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
                  app:layout_constraintEnd_toEndOf=&quot;parent&quot;
                  app:layout_constraintHorizontal_bias=&quot;0.5&quot;
                  app:layout_constraintStart_toStartOf=&quot;parent&quot;
                  app:layout_constraintTop_toTopOf=&quot;parent&quot;&gt;
  
                  &lt;include
                      layout=&quot;@layout/match_statistic&quot;
                      android:background=&quot;@drawable/layout_rounded&quot;
                      android:layout_width=&quot;match_parent&quot;
                      android:layout_height=&quot;wrap_content&quot; /&gt;
              &lt;/LinearLayout&gt;
  
              &lt;LinearLayout
                  android:id=&quot;@+id/imageView3&quot;
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  android:layout_marginStart=&quot;5dp&quot;
                  android:orientation=&quot;vertical&quot;
                  android:scaleType=&quot;centerCrop&quot;
                  app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
                  app:layout_constraintStart_toEndOf=&quot;@+id/imageView2&quot;
                  app:layout_constraintTop_toTopOf=&quot;parent&quot;&gt;
  
                  &lt;include
                      layout=&quot;@layout/match_statistic&quot;
                      android:background=&quot;@drawable/layout_rounded&quot;
                      android:layout_width=&quot;match_parent&quot;
                      android:layout_height=&quot;wrap_content&quot; /&gt;
              &lt;/LinearLayout&gt;
  
              &lt;LinearLayout
                  android:id=&quot;@+id/imageView4&quot;
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  android:layout_marginStart=&quot;5dp&quot;
                  android:orientation=&quot;vertical&quot;
                  android:scaleType=&quot;centerCrop&quot;
                  app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
                  app:layout_constraintStart_toEndOf=&quot;@+id/imageView3&quot;
                  app:layout_constraintTop_toTopOf=&quot;parent&quot;&gt;
  
                  &lt;include
                      layout=&quot;@layout/match_statistic&quot;
                      android:background=&quot;@drawable/layout_rounded&quot;
                      android:layout_width=&quot;match_parent&quot;
                      android:layout_height=&quot;wrap_content&quot; /&gt;
              &lt;/LinearLayout&gt;
  
              &lt;androidx.constraintlayout.widget.Guideline
                  android:id=&quot;@+id/guideline&quot;
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  android:orientation=&quot;vertical&quot;
                  app:layout_constraintGuide_begin=&quot;50dp&quot; /&gt;
  
              &lt;androidx.constraintlayout.widget.Guideline
                  android:id=&quot;@+id/guideline2&quot;
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  android:orientation=&quot;vertical&quot;
                  app:layout_constraintGuide_end=&quot;50dp&quot; /&gt;
  
              &lt;androidx.constraintlayout.helper.widget.Carousel
                  android:id=&quot;@+id/carousel&quot;
                  android:layout_width=&quot;wrap_content&quot;
                  android:layout_height=&quot;wrap_content&quot;
                  app:carousel_backwardTransition=&quot;@+id/backward&quot;
                  app:carousel_firstView=&quot;@+id/imageView2&quot;
                  app:carousel_forwardTransition=&quot;@+id/forward&quot;
                  app:carousel_nextState=&quot;@+id/next&quot;
                  app:carousel_previousState=&quot;@+id/previous&quot;
                  app:carousel_touchUpMode=&quot;carryVelocity&quot;
                  app:carousel_touchUp_dampeningFactor=&quot;0.8&quot;
                  app:constraint_referenced_ids=&quot;imageView0,imageView1,imageView2,imageView3,imageView4&quot; /&gt;
          &lt;/androidx.constraintlayout.motion.widget.MotionLayout&gt;
  </code></pre>