diff --git a/base/src/main/java/io/github/xwz/base/activities/VideoPlayerActivity.java b/base/src/main/java/io/github/xwz/base/activities/VideoPlayerActivity.java
index d600749..a402a1b 100644
--- a/base/src/main/java/io/github/xwz/base/activities/VideoPlayerActivity.java
+++ b/base/src/main/java/io/github/xwz/base/activities/VideoPlayerActivity.java
@@ -46,6 +46,7 @@
 import io.github.xwz.base.player.EventLogger;
 import io.github.xwz.base.player.HlsRendererBuilder;
 import io.github.xwz.base.player.VideoPlayer;
+import io.github.xwz.base.views.PlaybackControls;
 import io.github.xwz.base.views.VideoPlayerView;
 
 /**
@@ -67,7 +68,7 @@ public abstract class VideoPlayerActivity extends BaseActivity implements Surfac
 
     private EventLogger eventLogger;
     private MediaSession mediaSession;
-    private MediaController mediaController;
+    private PlaybackControls mediaController;
     private DurationLogger timeLogger;
 
     private VideoPlayerView videoPlayerView;
@@ -117,7 +118,7 @@ public void onCreate(Bundle savedInstanceState) {
         setContentView(R.layout.video_player_activity);
         View root = findViewById(R.id.root);
 
-        mediaController = new MediaController(this);
+        mediaController = new PlaybackControls(this);
         mediaController.setAnchorView(root);
         videoPlayerView = new VideoPlayerView(this, mediaController, root);
 
diff --git a/base/src/main/java/io/github/xwz/base/views/PlaybackControls.java b/base/src/main/java/io/github/xwz/base/views/PlaybackControls.java
new file mode 100644
index 0000000..840d047
--- /dev/null
+++ b/base/src/main/java/io/github/xwz/base/views/PlaybackControls.java
@@ -0,0 +1,91 @@
+package io.github.xwz.base.views;
+
+import android.content.Context;
+import android.view.KeyEvent;
+import android.view.View;
+import android.widget.ImageButton;
+import android.widget.MediaController;
+
+public class PlaybackControls extends MediaController {
+    private MediaPlayerControl mPlayer;
+    private View mRoot;
+    private ImageButton mPauseButton;
+
+
+    public PlaybackControls(Context context) {
+        super(context);
+    }
+
+    @Override
+    public void setMediaPlayer(MediaPlayerControl player) {
+        mPlayer = player;
+        super.setMediaPlayer(player);
+    }
+
+    @Override
+    public void setAnchorView(View view) {
+        super.setAnchorView(view);
+        mRoot = this.getChildAt(0);
+        //mPauseButton = (ImageButton) mRoot.findViewById();
+    }
+
+    public boolean dispatchKeyEvent(KeyEvent event, int timeout) {
+        int keyCode = event.getKeyCode();
+        final boolean uniqueDown = event.getRepeatCount() == 0
+                && event.getAction() == KeyEvent.ACTION_DOWN;
+        if (keyCode == KeyEvent.KEYCODE_HEADSETHOOK
+                || keyCode == KeyEvent.KEYCODE_MEDIA_PLAY_PAUSE
+                || keyCode == KeyEvent.KEYCODE_SPACE) {
+            if (uniqueDown) {
+                doPauseResume();
+                show(timeout);
+                if (mPauseButton != null) {
+                    mPauseButton.requestFocus();
+                }
+            }
+            return true;
+        } else if (keyCode == KeyEvent.KEYCODE_MEDIA_PLAY) {
+            if (uniqueDown && !mPlayer.isPlaying()) {
+                mPlayer.start();
+                updatePausePlay();
+                show(timeout);
+            }
+            return true;
+        } else if (keyCode == KeyEvent.KEYCODE_MEDIA_STOP
+                || keyCode == KeyEvent.KEYCODE_MEDIA_PAUSE) {
+            if (uniqueDown && mPlayer.isPlaying()) {
+                mPlayer.pause();
+                updatePausePlay();
+                show(timeout);
+            }
+            return true;
+        } else if (keyCode == KeyEvent.KEYCODE_VOLUME_DOWN
+                || keyCode == KeyEvent.KEYCODE_VOLUME_UP
+                || keyCode == KeyEvent.KEYCODE_VOLUME_MUTE
+                || keyCode == KeyEvent.KEYCODE_CAMERA) {
+            // don't show the controls for volume adjustment
+            return super.dispatchKeyEvent(event);
+        } else if (keyCode == KeyEvent.KEYCODE_BACK || keyCode == KeyEvent.KEYCODE_MENU) {
+            if (uniqueDown) {
+                hide();
+            }
+            return true;
+        }
+
+        show(timeout);
+        return super.dispatchKeyEvent(event);
+    }
+
+    private void updatePausePlay() {
+        super.setMediaPlayer(mPlayer);
+    }
+
+    private void doPauseResume() {
+        if (mPlayer.isPlaying()) {
+            mPlayer.pause();
+        } else {
+            mPlayer.start();
+        }
+        updatePausePlay();
+    }
+}
diff --git a/base/src/main/java/io/github/xwz/base/views/VideoPlayerView.java b/base/src/main/java/io/github/xwz/base/views/VideoPlayerView.java
index f2968ba..53414fb 100644
--- a/base/src/main/java/io/github/xwz/base/views/VideoPlayerView.java
+++ b/base/src/main/java/io/github/xwz/base/views/VideoPlayerView.java
@@ -53,7 +53,7 @@ public class VideoPlayerView {
 
     private final Context mContext;
 
-    private final MediaController mediaController;
+    private final PlaybackControls mediaController;
     private MediaController.MediaPlayerControl mPlayer;
 
     private static final List<Integer> PLAY_PAUSE_EVENTS = Arrays.asList(
@@ -70,7 +70,7 @@ public class VideoPlayerView {
             KeyEvent.KEYCODE_CAMERA
     );
 
-    public VideoPlayerView(Context context, MediaController controller, View root) {
+    public VideoPlayerView(Context context, PlaybackControls controller, View root) {
         mContext = context;
         mediaController = controller;
         shutterView = root.findViewById(R.id.shutter);
@@ -92,6 +92,7 @@ public VideoPlayerView(Context context, MediaController controller, View root) {
         card.setFocusableInTouchMode(true);
         card.setInfoVisibility(View.VISIBLE);
         card.setExtraVisibility(View.VISIBLE);
+        card.setInfoAreaBackgroundColor(context.getResources().getColor(R.color.black_900));
         Point size = new Point(context.getResources().getDimensionPixelSize(R.dimen.card_width),
                 context.getResources().getDimensionPixelSize(R.dimen.card_height));
         nextEpisode = new EpisodeCardView(context, card, size, false);
@@ -122,7 +123,7 @@ private boolean handleKeyEvents(View v, int keyCode, KeyEvent event) {
             doPauseResume();
             return true;
         } else if (PLAYER_EVENTS.contains(keyCode)) {
-            return mediaController.dispatchKeyEvent(event);
+            return mediaController.dispatchKeyEvent(event, 0);
         }
         return false;
     }