android - 如何使用 YouTube API 在 Android 中静音 YouTube 视频的音量

Question

我已经创建了一个运行良好的 Android 应用程序，但问题是我想在静音状态下播放 YouTube 视频，因为我们将在后台播放歌曲。那么是否可以在我的应用程序中播放静音的 YouTube 视频？ 并隐藏所有 YouTube 播放器控件，视频自动播放。

Answer 1

你可以使用这个奇妙的 android-youtube-player图书馆。基本上这个库不允许你设置音量，所以你必须创建自己的布局(并管理自己的音量)来膨胀 youtube 播放器的用户界面。 这是我创建的自定义 UI。

一旦您关注了 Quick start guide您可以创建自定义 UI。

layout_custom_youtube_player.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    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" >

    <View
        android:id="@+id/viewYoutubeCustomUI"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clickable="true"
        android:focusable="true"
        android:background="@android:color/black" />

    <TextView
        android:id="@+id/textViewYoutubeTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Title"
        android:visibility="gone"
        android:textSize="20sp"
        android:textColor="@android:color/white"
        android:layout_alignParentTop="true"
        android:layout_centerInParent="true" />

    <ImageButton
        android:id="@+id/imageButtonMuteUnMute"
        android:layout_width="@dimen/_30sdp"
        android:layout_height="@dimen/_30sdp"
        android:paddingTop="@dimen/_5sdp"
        android:paddingRight="@dimen/_5sdp"
        android:scaleType="fitCenter"
        android:tint="@color/colorPrimary"
        app:srcCompat="@drawable/ic_volume_off_white_24dp"
        android:background="@color/transparent"
        android:layout_alignParentRight="true" />


    <ProgressBar
        android:id="@+id/progressbarYoutube"
        style="?android:attr/progressBarStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="gone"
        android:layout_centerVertical="true"
        android:layout_centerInParent="true" />

    <ImageButton
        android:id="@+id/imageButtonPlayPause"
        android:layout_width="@dimen/_70sdp"
        android:layout_height="@dimen/_70sdp"
        android:scaleType="fitCenter"
        app:srcCompat="@drawable/ic_play_circle_outline_white_24dp"
        android:background="@color/transparent"
        android:tint="@color/colorPrimary"
        android:layout_centerVertical="true"
        android:layout_centerInParent="true"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:weightSum="3">

        <com.pierfrancescosoffritti.androidyoutubeplayer.core.ui.views.YouTubePlayerSeekBar
            android:id="@+id/youTubePlayerSeekBar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            app:fontSize="@dimen/_12sdp"
            app:color="@color/colorPrimary" />

        <ImageButton
            android:id="@+id/imageButtonEnterExitFullscreen"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@color/transparent"
            app:srcCompat="@drawable/ic_enter_fullscreen_white_24dp"
            android:layout_gravity="center"
            android:tint="@color/colorPrimary"
            android:paddingLeft="@dimen/_5sdp"
            android:paddingRight="@dimen/_5sdp"
            android:layout_weight="1" />
    </LinearLayout>
</RelativeLayout>

CustomYoutubePlayerUIController.java

package com.mcsoft.custom_youtube_handler;

import android.content.Context;
import android.os.Handler;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageButton;
import android.widget.TextView;

import com.mcsoft.R;
import com.mcsoft.helper.SharedPreferencesHandler;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.PlayerConstants;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.YouTubePlayer;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.listeners.AbstractYouTubePlayerListener;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.listeners.YouTubePlayerFullScreenListener;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.utils.YouTubePlayerTracker;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.player.views.YouTubePlayerView;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.ui.views.YouTubePlayerSeekBar;
import com.pierfrancescosoffritti.androidyoutubeplayer.core.ui.views.YouTubePlayerSeekBarListener;

import androidx.annotation.NonNull;
import androidx.core.content.ContextCompat;

public class CustomYoutubePlayerUIController extends AbstractYouTubePlayerListener implements YouTubePlayerFullScreenListener
{
    private final View playerUi;
    public static final int DELAY_TIME_SHOW_PLAY_PAUSE_BUTTON = 3000;
    private Context context;
    private YouTubePlayer youTubePlayer;
    private YouTubePlayerView youTubePlayerView;

    // viewYoutubeCustomUI is used to intercept clicks on the WebView, I don't want the user to be able to click the WebView directly.
    private View viewYoutubeCustomUI;
    private View progressbarYoutube;
    private YouTubePlayerSeekBar youTubePlayerSeekBar;
    private final YouTubePlayerTracker playerTracker;
    private boolean fullscreen = false;
    private boolean isMuted = true;
    private SharedPreferencesHandler sharedPreferencesHandler;

    public CustomYoutubePlayerUIController (Context context, View customPlayerUi, YouTubePlayer youTubePlayer, YouTubePlayerView youTubePlayerView) {
        this.playerUi = customPlayerUi;
        this.context = context;
        this.youTubePlayer = youTubePlayer;
        this.youTubePlayerView = youTubePlayerView;
        sharedPreferencesHandler = new SharedPreferencesHandler(context);
        playerTracker = new YouTubePlayerTracker();
        this.youTubePlayer.addListener(playerTracker);
        initViews(customPlayerUi);
    }

    private void initViews(View playerUi)
    {
        youTubePlayerSeekBar = playerUi.findViewById(R.id.youTubePlayerSeekBar);
        youTubePlayer.addListener(youTubePlayerSeekBar);
        viewYoutubeCustomUI = playerUi.findViewById(R.id.viewYoutubeCustomUI);
        progressbarYoutube = playerUi.findViewById(R.id.progressbarYoutube);

        final ImageButton imageButtonPlayPause = playerUi.findViewById(R.id.imageButtonPlayPause);
        ImageButton imageButtonEnterExitFullscreen = playerUi.findViewById(R.id.imageButtonEnterExitFullscreen);
        final ImageButton imageButtonMuteUnMute = playerUi.findViewById(R.id.imageButtonMuteUnMute);
        TextView textViewYoutubeTitle = playerUi.findViewById(R.id.textViewYoutubeTitle);
        textViewYoutubeTitle.setVisibility(View.GONE);
        viewYoutubeCustomUI.setOnTouchListener(new View.OnTouchListener()
        {
            @Override
            public boolean onTouch(View v, MotionEvent event)
            {
                if(event.getAction() == MotionEvent.ACTION_DOWN)
                {
                    imageButtonPlayPause.setVisibility(View.VISIBLE);
                    return true;
                }
                if(event.getAction() == MotionEvent.ACTION_UP)
                {
                    new Handler().postDelayed(new Runnable() {
                        @Override
                        public void run() {
                            // hide your button here
                            imageButtonPlayPause.setVisibility(View.INVISIBLE);
                        }
                    }, DELAY_TIME_SHOW_PLAY_PAUSE_BUTTON);
                    return true;
                }
                return false;
            }
        });
        // Manage volume
        imageButtonMuteUnMute.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                if (!isMuted)
                {
                    youTubePlayer.setVolume(0);
                    imageButtonMuteUnMute.setImageDrawable(context.getDrawable(R.drawable.ic_volume_off_white_24dp));
                }
                else
                {
                    youTubePlayer.setVolume(100);
                    imageButtonMuteUnMute.setImageDrawable(context.getDrawable(R.drawable.ic_volume_up_white_24dp));
                }
                isMuted = !isMuted;
            }
        });

        youTubePlayerSeekBar.setYoutubePlayerSeekBarListener(new YouTubePlayerSeekBarListener() {
            @Override
            public void seekTo(float time) {
                youTubePlayer.seekTo(time);
            }
        });

        imageButtonPlayPause.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View view)
            {
                if (isMuted)
                {
                    youTubePlayer.setVolume(0);
                }
                else
                {
                    youTubePlayer.setVolume(100);
                }  
                if (playerTracker.getState() == PlayerConstants.PlayerState.PLAYING)
                {
                    youTubePlayer.pause();
                    imageButtonPlayPause.setImageDrawable(context.getDrawable(R.drawable.ic_play_circle_outline_white_24dp));
                }
                else
                {
                    youTubePlayer.play();
                    imageButtonPlayPause.setImageDrawable(context.getDrawable(R.drawable.ic_pause_circle_outline_white_24dp));
                }
            }
        });

        imageButtonEnterExitFullscreen.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View view)
            {
                if (fullscreen)
                {
                    youTubePlayerView.exitFullScreen();
                }
                else
                {
                    youTubePlayerView.enterFullScreen();
                }
                fullscreen = !fullscreen;
            }
        });
    }

    @Override
    public void onReady(@NonNull YouTubePlayer youTubePlayer) {
        progressbarYoutube.setVisibility(View.GONE);
    }

    @Override
    public void onStateChange(@NonNull YouTubePlayer youTubePlayer, @NonNull PlayerConstants.PlayerState state) {
        if(state == PlayerConstants.PlayerState.PLAYING || state == PlayerConstants.PlayerState.PAUSED || state == PlayerConstants.PlayerState.VIDEO_CUED)
            viewYoutubeCustomUI.setBackgroundColor(ContextCompat.getColor(context, android.R.color.transparent));
        else
        if(state == PlayerConstants.PlayerState.BUFFERING)
            viewYoutubeCustomUI.setBackgroundColor(ContextCompat.getColor(context, android.R.color.transparent));
    }

    @Override
    public void onYouTubePlayerEnterFullScreen() {
        ViewGroup.LayoutParams viewParams = playerUi.getLayoutParams();
        viewParams.height = ViewGroup.LayoutParams.MATCH_PARENT;
        viewParams.width = ViewGroup.LayoutParams.MATCH_PARENT;
        playerUi.setLayoutParams(viewParams);
    }

    @Override
    public void onYouTubePlayerExitFullScreen() {
        ViewGroup.LayoutParams viewParams = playerUi.getLayoutParams();
        viewParams.height = ViewGroup.LayoutParams.WRAP_CONTENT;
        viewParams.width = ViewGroup.LayoutParams.MATCH_PARENT;
        playerUi.setLayoutParams(viewParams);
    }
}

现在在您的 Activity 中，您必须膨胀 Youtube 布局

View customPlayerUi = youTubePlayerView.inflateCustomPlayerUi(R.layout.layout_custom_youtube_player);

youTubePlayerView.addYouTubePlayerListener(new AbstractYouTubePlayerListener() {
       @Override
       public void onReady(@NonNull YouTubePlayer youTubePlayer)
       {
          CustomYoutubePlayerUIController customPlayerUiController = new CustomYoutubePlayerUIController(context, holder.customPlayerUi, youTubePlayer, youTubePlayerView);
          youTubePlayer.addListener(customPlayerUiController);
          youTubePlayerView.addFullScreenListener(customPlayerUiController);
          if(sharedPreferencesHandler.getAutoplayYoutubeVideo())
          {
             youTubePlayer.loadVideo(videoId, 0);
          }
          else
          {
             youTubePlayer.cueVideo(videoId, 0);
          }
       }
    });

注意

如果您想从链接中提取 YouTube 的视频 ID，您可以查看 this link .

重要

使用 android-youtube-player您需要迁移您的依赖项(遵循this guide)，因为您需要将YouTubePlayerView 添加为LifecycleObserver