如何在 Android 中實現畫中畫 (PIP) 功能?


Android 上的 PiP 功能允許使用者透過在使用其他應用程式的同時觀看影片或參與其他內容來輕鬆地進行多工處理。此創新功能確保您始終可以控制您的裝置,即使您正在享受媒體娛樂。包含影片或內容的小型浮動視窗支援這些活動,並透過使任務更容易同時管理來增強使用者體驗。

要向 Android 應用程式新增畫中畫功能,開發人員需要利用 Android 框架中提供的特定 API 和功能。PiP 透過在應用程式中提供無縫的多工處理來增強使用者體驗。本綜合指南將逐步介紹在 Android 應用程式中輕鬆實現 PiP 所需的步驟和技術。

畫中畫 (PIP)

PiP,也稱為畫中畫,是一個方便的功能,允許使用者在裝置上進行多工處理。他們可以在訪問其他應用程式的同時,在一個單獨的小視窗或疊加層中檢視和互動媒體內容。

使用者現在可以使用 PiP 功能更有效地進行多工處理,這允許他們在一個緊湊且可調整大小的視窗中繼續觀看影片——無論是電影還是視訊通話,該視窗始終位於其他應用程式視窗的頂部。

PiP 視窗提供了充足的自定義空間,允許使用者在螢幕上移動,根據自己的方便調整視窗大小,甚至與之互動。這導致在裝置上執行其他任務時能夠無縫且不間斷地使用媒體內容。

方法

使用 Java 在 Android 應用程式中實現畫中畫 (PiP) 可以透過多種方式完成。本文介紹了三種常用的實現 PiP 功能的方法。

  • 在媒體播放器中使用畫中畫模式

  • 使用自定義影片播放器實現畫中畫模式

  • 使用 WebView 實現畫中畫模式

在媒體播放器中使用畫中畫模式

此方法涉及建立 MediaSessionCompat 物件並使用 MediaPlayer 處理媒體播放。您設定媒體控制元件和操作,註冊 MediaSessionCompat.Callback 來處理 PiP 回撥,並使用 setPictureInPictureParams() 方法進入畫中畫模式。

演算法

  • 建立一個 MediaSessionCompat 物件並使用 MediaPlayer 或其他媒體播放器處理媒體播放。

  • 設定媒體控制元件和播放操作。

  • 註冊 MediaSessionCompat.Callback 來處理與 PiP 相關的回撥。

  • 使用 setPictureInPictureParams() 方法進入畫中畫模式。

示例

import android.app.Activity;
import android.media.MediaPlayer;
import android.os.Bundle;
import android.support.v4.media.session.MediaSessionCompat;
import android.util.Log;
import android.view.View;
import android.widget.Button;

public class MainActivity extends Activity {
   private MediaPlayer mediaPlayer;
   private MediaSessionCompat mediaSession;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      // Create a MediaSessionCompat object
      mediaSession = new MediaSessionCompat(this, "MyMediaSession");

      // Set up media controls and actions
      MediaSessionCompat.Callback callback = new MediaSessionCompat.Callback() {
         @Override
         public void onPictureInPictureModeChanged(boolean isInPictureInPictureMode) {
            if (isInPictureInPictureMode) {
               // Update UI for Picture-in-Picture mode
            } else {
               // Update UI when PiP mode is exited
            }
         }
         // Other media callbacks...
      };
      mediaSession.setCallback(callback);

      // Initialize MediaPlayer
      mediaPlayer = MediaPlayer.create(this, R.raw.video);

      Button pipButton = findViewById(R.id.pip_button);
      pipButton.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            // Enter Picture-in-Picture mode
            PictureInPictureParams.Builder builder = new PictureInPictureParams.Builder();
            enterPictureInPictureMode(builder.build());
         }
      });
   }

   @Override
   protected void onDestroy() {
      super.onDestroy();
      // Release resources
      mediaPlayer.release();
      mediaSession.release();
   }
}

輸出

使用自定義影片播放器實現畫中畫模式

在這裡,您使用 SurfaceView 或 TextureView 實現一個自定義影片播放器來顯示影片。您在自定義播放器中處理影片播放和控制元件,並使用 enterPictureInPictureMode() 方法管理到 PiP 模式轉換。

演算法

  • 使用 SurfaceView 或 TextureView 實現一個自定義影片播放器來顯示影片。

  • 在自定義播放器中處理影片播放和控制元件。

  • 使用 enterPictureInPictureMode() 方法管理到 PiP 模式的轉換。

示例

import android.app.Activity;
import android.content.res.Configuration;
import android.os.Bundle;
import android.util.Rational;
import android.view.View;
import android.widget.Button;

public class MainActivity extends Activity {
   private CustomVideoPlayerView playerView;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      playerView = findViewById(R.id.player_view);

      Button pipButton = findViewById(R.id.pip_button);
      pipButton.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            enterPictureInPictureMode();
         }
      });
   }

   @Override
   protected void onPictureInPictureModeChanged(boolean isInPictureInPictureMode, Configuration newConfig) {
      super.onPictureInPictureModeChanged(isInPictureInPictureMode, newConfig);

      if (isInPictureInPictureMode) {
         // Update UI for Picture-in-Picture mode
         playerView.hideControls();
      } else {
         // Update UI when PiP mode is exited
         playerView.showControls();
      }
   }
}

輸出

使用 WebView 實現畫中畫模式

此方法涉及使用 WebView.loadUrl() 在 WebView 中載入影片或媒體內容。您為影片播放實現必要的 WebView 回撥,檢測影片何時應進入 PiP 模式,並呼叫 enterPictureInPictureMode() 以啟動到畫中畫模式的轉換。

演算法

  • 使用 WebView.loadUrl() 在 WebView 中載入影片或媒體內容。

  • 為影片播放實現必要的 WebView 回撥。

  • 檢測影片何時應進入 PiP 模式並呼叫 enterPictureInPictureMode()。

示例

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends Activity {
   private WebView webView;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      webView = findViewById(R.id.webview);
      webView.setWebChromeClient(new WebChromeClient());
      webView.setWebViewClient(new WebViewClient());
      WebSettings webSettings = webView.getSettings();
      webSettings.setJavaScriptEnabled(true);

      Button pipButton = findViewById(R.id.pip_button);
      pipButton.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            enterPictureInPictureMode();
         }
      });

      webView.loadUrl("https://www.example.com/video");
   }

   @Override
   protected void onStop() {
      super.onStop();
      webView.onPause();
      webView.pauseTimers();
   }

   @Override
   protected void onResume() {
      super.onResume();
      webView.resumeTimers();
      webView.onResume();
   }

   @Override
   protected void onDestroy() {
      super.onDestroy();
      webView.destroy();
   }
}

輸出

結論

開發人員可以使用畫中畫 (PiP) 來改善 Android 中的使用者體驗。此功能允許使用者進行多工處理並在使用其他應用程式時在一個小的疊加層中檢視媒體內容。透過使用媒體播放器、自定義影片播放器或 WebView 方法實現 PiP,開發人員為使用者提供了無縫且便捷的多工處理體驗。最終,這將提高其 Android 應用程式的可用性和參與度。

更新於: 2023-07-26

835 次檢視

開啟你的 職業生涯

透過完成課程獲得認證

開始學習
廣告