Add play icon to the gesture settings videos.

1. Add a play button icon to show on top of the gesture videos when the
video is not playing.
2. Dynamically split the gesture video and description text in half
instead of using the hard coded value.
3. Hide the video view if animation is not available.
4. Delay removing the animation preview till the video starts drawing on
the surface texture.

Bug: 28565958
Change-Id: I8b954828d16286014404172d29efa4d2e00432b3

res/drawable/ic_gesture_play_button.xml

@@ -0,0 +1,25 @@
+<!--
+    Copyright (C) 2016 The Android Open Source Project
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+         http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+        android:width="24dp"
+        android:height="24dp"
+        android:viewportWidth="24.0"
+        android:viewportHeight="24.0">
+    <path
+        android:fillColor="#FFFFFFFF"
+        android:pathData="M12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM10,
+            16.5v-9l6,4.5 -6,4.5z"/>
+</vector>

res/layout/gesture_preference.xml

@@ -26,7 +26,6 @@
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_weight="1"
         android:orientation="horizontal"
         android:paddingTop="16dp"
         android:paddingBottom="16dp"
@@ -51,16 +50,18 @@
     </LinearLayout>
 
     <LinearLayout
+        android:id="@+id/gesture_detail"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_weight="1"
         android:background="@color/gestures_setting_backgroud_color"
         android:paddingEnd="?android:attr/listPreferredItemPaddingEnd"
         android:orientation="horizontal">
 
         <FrameLayout
-            android:layout_width="@dimen/gestures_settings_video_width"
+            android:id="@+id/gesture_animation_frame"
-            android:layout_height="@dimen/gestures_settings_video_height">
+            android:layout_width="0dp"
+            android:layout_height="match_parent"
+            android:layout_weight="1">
 
             <TextureView
                 android:id="@+id/gesture_video"
@@ -74,12 +75,21 @@
                 android:layout_height="match_parent"
                 android:visibility="gone"/>
 
+            <ImageView
+                android:id="@+id/gesture_play_button"
+                android:layout_width="@dimen/gestures_play_button_size"
+                android:layout_height="@dimen/gestures_play_button_size"
+                android:src="@drawable/ic_gesture_play_button"
+                android:gravity="center"
+                android:layout_gravity="center"
+                android:visibility="gone"/>
+
         </FrameLayout>
 
         <TextView
             android:id="@android:id/summary"
-            android:layout_width="@dimen/gestures_settings_summary_width"
+            android:layout_width="0dp"
-            android:layout_height="@dimen/gestures_settings_summary_height"
+            android:layout_height="match_parent"
             android:layout_weight="1"
             android:paddingTop="@dimen/gestures_settings_padding_top_bottom"
             android:paddingStart="?android:attr/listPreferredItemPaddingStart"

res/values/dimens.xml

@@ -297,10 +297,6 @@
     <dimen name="redaction_padding_start">16dp</dimen>
 
     <!-- Padding for Gestures settings screen -->
-    <dimen name="gestures_settings_title_height">56dp</dimen>
-    <dimen name="gestures_settings_video_height">206dp</dimen>
-    <dimen name="gestures_settings_video_width">206dp</dimen>
-    <dimen name="gestures_settings_summary_height">206dp</dimen>
-    <dimen name="gestures_settings_summary_width">206dp</dimen>
     <dimen name="gestures_settings_padding_top_bottom">20dp</dimen>
+    <dimen name="gestures_play_button_size">36dp</dimen>
 </resources>

src/com/android/settings/gestures/GesturePreference.java

@@ -14,6 +14,7 @@
 
 package com.android.settings.gestures;
 
+import android.content.ContentResolver;
 import android.content.Context;
 import android.content.res.TypedArray;
 import android.graphics.Bitmap;
@@ -29,6 +30,7 @@ import android.view.View;
 import android.view.Surface;
 import android.view.TextureView;
 import android.widget.ImageView;
+import android.widget.LinearLayout;
 import android.util.AttributeSet;
 import android.util.Log;
 
@@ -39,12 +41,14 @@ import com.android.settings.R;
  * This shows the title and description of the gesture along with an animation showing how to do
  * the gesture
  */
-public class GesturePreference extends SwitchPreference {
+public final class GesturePreference extends SwitchPreference {
     private static final String TAG = "GesturePreference";
+    private final Context mContext;
+
     private Uri mVideoPath;
-    private Context mContext;
     private MediaPlayer mMediaPlayer;
     private MediaMetadataRetriever mMediaMetadata;
+    private boolean animationAvailable;
 
     public GesturePreference(Context context, AttributeSet attrs) {
         super(context, attrs);
@@ -56,12 +60,15 @@ public class GesturePreference extends SwitchPreference {
                 0, 0);
         try {
             int animation = attributes.getResourceId(R.styleable.GesturePreference_animation, 0);
-            mVideoPath = Uri.parse(
+            mVideoPath = new Uri.Builder().scheme(ContentResolver.SCHEME_ANDROID_RESOURCE)
-                "android.resource://" + context.getPackageName() + "/" + animation);
+                    .authority(context.getPackageName())
+                    .appendPath(String.valueOf(animation))
+                    .build();
             mMediaMetadata = new MediaMetadataRetriever();
             mMediaMetadata.setDataSource(mContext, mVideoPath);
+            animationAvailable = true;
         } catch (Exception e) {
-            // resource not available, show blank view
+            Log.w(TAG, "Animation resource not found. Will not show animation.");
         } finally {
             attributes.recycle();
         }
@@ -72,6 +79,21 @@ public class GesturePreference extends SwitchPreference {
         super.onBindViewHolder(holder);
         final TextureView video = (TextureView) holder.findViewById(R.id.gesture_video);
         final ImageView imageView = (ImageView) holder.findViewById(R.id.gesture_image);
+        final ImageView playButton = (ImageView) holder.findViewById(R.id.gesture_play_button);
+        final View detailView = holder.findViewById(R.id.gesture_detail);
+        final View animationFrame = holder.findViewById(R.id.gesture_animation_frame);
+
+        if (!animationAvailable) {
+            animationFrame.setVisibility(View.GONE);
+            return;
+        }
+
+        Bitmap bitmap = mMediaMetadata.getFrameAtTime(0);
+        if (bitmap != null) {
+            imageView.setImageDrawable(new BitmapDrawable(bitmap));
+        }
+        imageView.setVisibility(View.VISIBLE);
+        playButton.setVisibility(View.VISIBLE);
 
         video.setOnTouchListener(new View.OnTouchListener() {
             @Override
@@ -80,9 +102,10 @@ public class GesturePreference extends SwitchPreference {
                     if (mMediaPlayer != null) {
                         if (mMediaPlayer.isPlaying()) {
                             mMediaPlayer.pause();
+                            playButton.setVisibility(View.VISIBLE);
                         } else {
                             mMediaPlayer.start();
-                            imageView.setVisibility(View.GONE);
+                            playButton.setVisibility(View.GONE);
                         }
                     }
                     return true;
@@ -93,7 +116,9 @@ public class GesturePreference extends SwitchPreference {
 
         video.setSurfaceTextureListener(new TextureView.SurfaceTextureListener() {
             @Override
-            public void onSurfaceTextureAvailable(SurfaceTexture surfaceTexture, int width, int height) {
+            public void onSurfaceTextureAvailable(SurfaceTexture surfaceTexture, int width,
+                    int height) {
+                animationFrame.setLayoutParams(new LinearLayout.LayoutParams(width, width));
                 mMediaPlayer = MediaPlayer.create(mContext, mVideoPath);
                 if (mMediaPlayer != null) {
                     mMediaPlayer.setSurface(new Surface(surfaceTexture));
@@ -107,7 +132,8 @@ public class GesturePreference extends SwitchPreference {
             }
 
             @Override
-            public void onSurfaceTextureSizeChanged(SurfaceTexture surfaceTexture, int width, int height) {
+            public void onSurfaceTextureSizeChanged(SurfaceTexture surfaceTexture, int width,
+                    int height) {
             }
 
             @Override
@@ -123,17 +149,12 @@ public class GesturePreference extends SwitchPreference {
 
             @Override
             public void onSurfaceTextureUpdated(SurfaceTexture surfaceTexture) {
+                if (mMediaPlayer.isPlaying() && imageView.getVisibility() == View.VISIBLE) {
+                    imageView.setVisibility(View.GONE);
+                }
             }
         });
 
-        if (mMediaPlayer == null) {
-            Bitmap bitmap = mMediaMetadata.getFrameAtTime(0);
-            if (bitmap != null) {
-                imageView.setImageDrawable(new BitmapDrawable(bitmap));
-            }
-            imageView.setVisibility(View.VISIBLE);
-        }
-
     }
 
 }