How to create youtube's double-tap gesture on Android?

Question

I have application with exoplayer on Android. I have create youtube's double-tap gesture to jump 10 seconds forward or backward with animation! How create this semicircle with ripple effect on double tap?

Like this

How to do this?

Answer 1

I've also wanted to implement such feature, so I wrote it myself to "copy" YouTube's behavior. It's almost the same. You can find the library here including a sample app: https://github.com/vkay94/DoubleTapPlayerView

The instructions are written in the README, but due to Stackoverflow principals:

0) Requirements:

• Minimum SDK: 16 (I couldn't test versions below 21 yet)
• ExoPlayer2 library (at least 2.11.7) since the replaced view is written above ExoPlayer's PlayerView)

1) Include it to your gradle (it's hosted on jitpack.io so you've got to add it to your respositories):

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}

dependencies {
    implementation 'com.github.vkay94:DoubleTapPlayerView:1.0.0'
}

2) Add the views inside your XML:

<FrameLayout
    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" >
    
    <com.github.vkay94.dtpv.DoubleTapPlayerView
        android:id="@+id/playerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        
        app:dtpv_controller="@+id/youtube_overlay" />

    <com.github.vkay94.dtpv.youtube.YouTubeOverlay
        android:id="@+id/youtube_overlay"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="invisible"
        
        app:yt_playerView="@+id/playerView" />
</FrameLayout>

3) Set it up inside your activity:

youtube_overlay
    .performListener(object : YouTubeOverlay.PerformListener {
        override fun onAnimationStart() {
            // Do UI changes when circle scaling animation starts (e.g. hide controller views)
            youtube_overlay.visibility = View.VISIBLE
        }

        override fun onAnimationEnd() {
            // Do UI changes when circle scaling animation starts (e.g. show controller views)
            youtube_overlay.visibility = View.GONE
        }
    })
    // Uncomment this line if you haven't set yt_playerView in XML
    // .playerView(playerView)

// Uncomment this line if you haven't set dtpv_controller in XML 
// playerView.controller(youtube_overlay)

// Call this method whenever the player is released and recreated
youtube_overlay.player(simpleExoPlayer)