Improve transformer activity layout

On Samsung S21 with light theme the debug labels weren't showing up because the player view was visible (with a black background) while the transformation was in progress, matching the debug label text color. Hide the player view until the transformation is complete to fix this.

Also tweak the layout slightly to add space between the card border and the labels.

#mse-bug-week

PiperOrigin-RevId: 428455824

demos/transformer/src/main/java/com/google/android/exoplayer2/transformerdemo/TransformerActivity.java

@@ -149,6 +149,7 @@ public final class TransformerActivity extends AppCompatActivity {
       throw new IllegalStateException(e);
     }
     informationTextView.setText(R.string.transformation_started);
+    playerView.setVisibility(View.GONE);
     Handler mainHandler = new Handler(getMainLooper());
     ProgressHolder progressHolder = new ProgressHolder();
     mainHandler.post(
@@ -285,6 +286,7 @@ public final class TransformerActivity extends AppCompatActivity {
         getString(
             R.string.transformation_completed, transformationStopwatch.elapsed(TimeUnit.SECONDS)));
     progressViewGroup.setVisibility(View.GONE);
+    playerView.setVisibility(View.VISIBLE);
     playMediaItem(MediaItem.fromUri("file://" + filePath));
     Log.d(TAG, "Output file path: file://" + filePath);
   }

demos/transformer/src/main/res/layout/transformer_activity.xml

@@ -34,10 +34,7 @@
       android:layout_width="wrap_content"
       android:layout_height="match_parent"
       android:orientation="vertical"
-      android:paddingLeft="8dp"
-      android:paddingRight="8dp"
-      android:paddingTop="8dp"
-      android:paddingBottom="8dp" />
+      android:padding="8dp" />
 
   </com.google.android.material.card.MaterialCardView>
 
@@ -61,8 +58,6 @@
           android:id="@+id/debug_text_view"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
-          android:paddingLeft="4dp"
-          android:paddingRight="4dp"
           android:textSize="10sp"
           tools:ignore="SmallSp"/>
 
@@ -70,28 +65,26 @@
           android:id="@+id/progress_view_group"
           android:layout_height="match_parent"
           android:layout_width="match_parent"
+          android:padding="8dp"
           android:orientation="vertical">
 
           <com.google.android.material.progressindicator.LinearProgressIndicator
             android:id="@+id/progress_indicator"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:paddingLeft="16dp"
-            android:paddingRight="16dp"
-            android:paddingTop="16dp"
-            android:paddingBottom="16dp"
+            android:layout_marginBottom="8dp"
             android:layout_gravity="center" />
 
           <TextView
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
+            android:layout_marginBottom="8dp"
             android:text="@string/debug_preview" />
 
           <com.google.android.exoplayer2.ui.AspectRatioFrameLayout
             android:id="@+id/debug_aspect_ratio_frame_layout"
             android:layout_width="match_parent"
-            android:layout_height="match_parent"
-            android:paddingTop="16dp">
+            android:layout_height="match_parent">
 
             <TextView
               android:layout_width="match_parent"

demos/transformer/src/main/res/values/strings.xml

@@ -17,7 +17,7 @@
 <resources xmlns:xliff="urn:oasis:names:tc:xliff:document:1.2">
   <string name="app_name" translatable="false">Transformer Demo</string>
   <string name="configuration" translatable="false">Configuration</string>
-  <string name="choose_file_title" translatable="false">Choose File</string>
+  <string name="choose_file_title" translatable="false">Choose file</string>
   <string name="remove_audio" translatable="false">Remove audio</string>
   <string name="remove_video" translatable="false">Remove video</string>
   <string name="flatten_for_slow_motion" translatable="false">Flatten for slow motion</string>
@@ -30,7 +30,7 @@
   <string name="transform" translatable="false">Transform</string>
   <string name="hdr_editing" translatable="false">[Experimental] HDR editing</string>
   <string name="debug_preview" translatable="false">Debug preview:</string>
-  <string name="debug_preview_not_available" translatable="false">No debug preview available</string>
+  <string name="debug_preview_not_available" translatable="false">No debug preview available.</string>
   <string name="transformation_started" translatable="false">Transformation started</string>
   <string name="transformation_timer" translatable="false">Transformation started %d seconds ago.</string>
   <string name="transformation_completed" translatable="false">Transformation completed in %d seconds.</string>