https://developers.google.com/youtube/android/player/
YouTubeはWebViewでも再生できるといえば再生はできるのですが、動作がのろかったり画像が荒かったりしたので、調べてみたところ、AndroidアプリにはYouTube APIというものが使えるということがわかりました。
このYouTube APIを使って、YouTubeの動画を再生してみました。
普通にアクティビティでYouTube APIを使うだけならば、他のサイトでもやり方を紹介されているので、より実用性が高いだろうと考えてフラグメント上でYouTubeを再生できるようにしてみます。
アプリをGoogle Developers Consoleに登録して、APIキーを取得
Registering your application | YouTube Android Player API | Google Developers
https://developers.google.com/youtube/android/player/register
YouTube APIを使うためには、Google Developers Consoleにアプリを登録して、APIキーを取得する必要があります。
１）KeyStoreを作成
こちらの資料が参考になりました。
Android Studioでアプリ公開用KeyStoreを作成して本番ビルドする
http://qiita.com/konifar/items/6c6b73deae9085a69666
Key store pathと、Aliasは以下のようにしました。
Key store path: /Users/username/StudioProjects/FragmentDeYoutube/my.keystore Alias: FragmentDeYoutube
２）SHA1フィンガープリントを出力
ターミナルを開いてコマンドを入力します。
$ keytool -exportcert -alias FragmentDeYoutube -keystore /Users/username/StudioProjects/FragmentDeYoutube/my.keystore -list -v Enter keystore password: Alias name: FragmentDeYoutube 〜〜〜 SHA1: XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX SHA256: XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX:XX: Signature algorithm name: SHA1withRSA Version: 3 〜〜〜SHA1の値を使います。
３）Google Developers ConsoleでAPIキーを取得
Registering your application | YouTube Android Player API | Google Developers
https://developers.google.com/youtube/android/player/register?hl=ja
Google Developers Console（https://console.developers.google.com/）は、ちょっとわかりずらいですが、以下の遷移でAPIキー作成できます。
プロジェクトを作成 -> APIと認証 -> API -> YouTube Data API -> APIを有効にする -> 認証情報 -> 公開 API へのアクセス 新しいキーを作成 -> Androidキー
フォームが表示されるので以下のように入力します。
リクエストを受け入れる Android アプリの証明書フィンガープリントとパッケージ名 (省略可)入力が完了すると、APIキーが確認できるようになります。
SHA1 証明書フィンガープリントとパッケージ名（セミコロンで区切る）を 1 行に 1 組ずつ入力してください。 例: 45:B5:E4:6F:36:AD:0A:98:94:B4:02:66:2B:12:17:F2:56:26:A0:E0;com.example
YouTube Android Player APIライブラリを組み込む
YouTube Android Player API - Download | YouTube Android Player API | Google Developers
https://developers.google.com/youtube/android/player/downloads/?hl=ja
上記ページからファイルをダウンロードして、プロジェクトにライブラリを組み込みます。
YouTubeAndroidPlayerApi-1.2.1.zipを使います。
ダウンロードして、解凍後、libs/YouTubeAndroidPlayerApi.jarをプロジェクトの app/libs/ ディレクトリにコピーします。
$ cp /Users/username/Desktop/YouTubeAndroidPlayerApi-1.2.1/libs/YouTubeAndroidPlayerApi.jar /Users/username/StudioProjects/FragmentDeYoutube/app/libs/build.gradleを編集。compile files('libs/YouTubeAndroidPlayerApi.jar')を追記します。
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:22.2.0'
compile files('libs/YouTubeAndroidPlayerApi.jar')
}
これで、YouTube APIを使ってアプリを作る準備が出来ました。
サンプルコード
YouTubePlayerSupportFragment | YouTube Android API | Google Developers
https://developers.google.com/youtube/android/player/reference/com/google/android/youtube/player/YouTubePlayerSupportFragment?hl=ja
上記のように、YouTubePlayerSupportFragment が class android.support.v4.app.Fragment を継承しているので、v4ライブラリの Fragment の作法にのっとって実装していきます。
以下、サンプルコードです。
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" | |
| xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" | |
| android:layout_height="match_parent" | |
| android:paddingLeft="@dimen/activity_horizontal_margin" | |
| android:paddingRight="@dimen/activity_horizontal_margin" | |
| android:paddingTop="@dimen/activity_vertical_margin" | |
| android:paddingBottom="@dimen/activity_vertical_margin" | |
| android:id="@+id/main" | |
| tools:context=".MainActivity"> | |
| <TextView android:text="@string/hello_world" android:layout_width="wrap_content" | |
| android:layout_height="wrap_content" /> | |
| </RelativeLayout> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?xml version="1.0" encoding="utf-8"?> | |
| <manifest xmlns:android="http://schemas.android.com/apk/res/android" | |
| package="xxxx.xxxx.xxxx.fragmentdeyoutube" > | |
| <uses-permission android:name="android.permission.INTERNET" /> | |
| <application | |
| android:allowBackup="true" | |
| android:icon="@mipmap/ic_launcher" | |
| android:label="@string/app_name" | |
| android:theme="@style/AppTheme" > | |
| <activity | |
| android:name=".MainActivity" | |
| android:label="@string/app_name" > | |
| <intent-filter> | |
| <action android:name="android.intent.action.MAIN" /> | |
| <category android:name="android.intent.category.LAUNCHER" /> | |
| </intent-filter> | |
| </activity> | |
| </application> | |
| </manifest> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| apply plugin: 'com.android.application' | |
| android { | |
| compileSdkVersion 22 | |
| buildToolsVersion "22.0.1" | |
| defaultConfig { | |
| applicationId "xxxx.xxxx.xxxx.fragmentdeyoutube" | |
| minSdkVersion 15 | |
| targetSdkVersion 22 | |
| versionCode 1 | |
| versionName "1.0" | |
| } | |
| buildTypes { | |
| release { | |
| minifyEnabled false | |
| proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' | |
| } | |
| } | |
| } | |
| dependencies { | |
| compile fileTree(dir: 'libs', include: ['*.jar']) | |
| compile 'com.android.support:appcompat-v7:22.2.0' | |
| compile files('libs/YouTubeAndroidPlayerApi.jar') | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| package xxxx.xxxx.xxxx.fragmentdeyoutube; | |
| import android.support.v4.app.FragmentManager; | |
| import android.support.v7.app.ActionBarActivity; | |
| import android.os.Bundle; | |
| import android.view.Menu; | |
| import android.view.MenuItem; | |
| public class MainActivity extends ActionBarActivity { | |
| @Override | |
| protected void onCreate(Bundle savedInstanceState) { | |
| super.onCreate(savedInstanceState); | |
| setContentView(R.layout.activity_main); | |
| // フラグメント起動 （v4の作法で） | |
| YoutubeFragment fragment = new YoutubeFragment(); | |
| FragmentManager manager = getSupportFragmentManager(); | |
| manager.beginTransaction() | |
| .replace(R.id.main, fragment) | |
| .addToBackStack(null) | |
| .commit(); | |
| } | |
| @Override | |
| public boolean onCreateOptionsMenu(Menu menu) { | |
| // Inflate the menu; this adds items to the action bar if it is present. | |
| getMenuInflater().inflate(R.menu.menu_main, menu); | |
| return true; | |
| } | |
| @Override | |
| public boolean onOptionsItemSelected(MenuItem item) { | |
| // Handle action bar item clicks here. The action bar will | |
| // automatically handle clicks on the Home/Up button, so long | |
| // as you specify a parent activity in AndroidManifest.xml. | |
| int id = item.getItemId(); | |
| //noinspection SimplifiableIfStatement | |
| if (id == R.id.action_settings) { | |
| return true; | |
| } | |
| return super.onOptionsItemSelected(item); | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?xml version="1.0" encoding="utf-8"?> | |
| <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" | |
| android:layout_width="match_parent" | |
| android:layout_height="match_parent" > | |
| <FrameLayout | |
| android:id="@+id/youtube_layout" | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:layout_centerHorizontal="true" | |
| android:visibility="visible" /> | |
| </RelativeLayout> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| package xxxx.xxxx.xxxx.fragmentdeyoutube; | |
| import android.os.Bundle; | |
| import android.support.v4.app.Fragment; | |
| import android.support.v4.app.FragmentTransaction; | |
| import android.util.Log; | |
| import android.view.LayoutInflater; | |
| import android.view.View; | |
| import android.view.ViewGroup; | |
| import android.widget.Toast; | |
| import com.google.android.youtube.player.YouTubeInitializationResult; | |
| import com.google.android.youtube.player.YouTubePlayer; | |
| import com.google.android.youtube.player.YouTubePlayer.OnInitializedListener; | |
| import com.google.android.youtube.player.YouTubePlayer.Provider; | |
| import com.google.android.youtube.player.YouTubePlayerSupportFragment; | |
| public class YoutubeFragment extends Fragment { | |
| // API キー | |
| private static final String API_KEY = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"; | |
| // YouTubeのビデオID | |
| private static String VIDEO_ID = "EGy39OMyHzw"; | |
| @Override | |
| public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { | |
| View rootView = inflater.inflate(R.layout.you_tube_api, container, false); | |
| // YouTubeフラグメントインスタンスを取得 | |
| YouTubePlayerSupportFragment youTubePlayerFragment = YouTubePlayerSupportFragment.newInstance(); | |
| // レイアウトにYouTubeフラグメントを追加 | |
| FragmentTransaction transaction = getChildFragmentManager().beginTransaction(); | |
| transaction.add(R.id.youtube_layout, youTubePlayerFragment).commit(); | |
| // YouTubeフラグメントのプレーヤーを初期化する | |
| youTubePlayerFragment.initialize(API_KEY, new OnInitializedListener() { | |
| // YouTubeプレーヤーの初期化成功 | |
| @Override | |
| public void onInitializationSuccess(Provider provider, YouTubePlayer player, boolean wasRestored) { | |
| if (!wasRestored) { | |
| player.setPlayerStyle(YouTubePlayer.PlayerStyle.DEFAULT); | |
| player.loadVideo(VIDEO_ID); | |
| player.play(); | |
| } | |
| } | |
| // YouTubeプレーヤーの初期化失敗 | |
| @Override | |
| public void onInitializationFailure(Provider provider, YouTubeInitializationResult error) { | |
| // YouTube error | |
| String errorMessage = error.toString(); | |
| Toast.makeText(getActivity(), errorMessage, Toast.LENGTH_LONG).show(); | |
| Log.d("errorMessage:", errorMessage); | |
| } | |
| }); | |
| return rootView; | |
| } | |
| } |
