# การติดตั้ง ByteArk Player SDK for Flutter

ByteArk Player SDK for Flutter เผยแพร่ผ่าน pub.dev (opens new window) คุณสามารถเพิ่มเป็น Dependency ของโปรเจกต์ Flutter ได้โดยตรง

# ความต้องการของระบบ

รายการ	เวอร์ชัน
Flutter	3.22.0 ขึ้นไป
Dart SDK	3.5.0 ขึ้นไป
iOS Deployment Target	iOS 14.0 ขึ้นไป
iOS Build Tools	Xcode 17 ขึ้นไป (Swift 6.3)
Android Min SDK	API 21 (Android 5.0) ขึ้นไป
Android compileSdk	35
Android Gradle Plugin (AGP)	8.6 ขึ้นไป
Gradle	8.14 ขึ้นไป
Kotlin	1.9 ขึ้นไป
JDK	17

# เพิ่ม Dependency

แก้ไขไฟล์ pubspec.yaml ของโปรเจกต์

dependencies:
  byteark_player_flutter: ^2.0.0

1
2

จากนั้นรันคำสั่ง

flutter pub get

หรือใช้ flutter pub add

flutter pub add byteark_player_flutter

# ตั้งค่าฝั่ง iOS

เปิดไฟล์ ios/Podfile ตั้งค่า platform และเพิ่ม Source repository ของ ByteArk

platform :ios, '14.0'
source 'https://github.com/CocoaPods/Specs.git'
source 'https://github.com/byteark/byteark-player-sdk-ios-specs.git'
source 'https://github.com/byteark/lighthouse-sdk-native-ios-specs.git'

1
2
3
4
5

จากนั้นรันคำสั่ง

cd ios && pod install --repo-update

หากต้องการใช้ Picture-in-Picture หรือ Background Audio ให้เปิด Background Mode ใน Xcode project's Capabilities — เลือก "Audio, AirPlay, and Picture in Picture"

# ตั้งค่าฝั่ง Android

ตรวจสอบ android/app/build.gradle ให้ minSdk อยู่ที่ 21 ขึ้นไป และ compileSdk เป็น 35

android {
  compileSdk 35
  defaultConfig {
    minSdk 21
  }
}

1
2
3
4
5
6
7

SDK ต้องการ Android Gradle Plugin 8.6+, Gradle 8.14+, Kotlin 1.9+ และ JDK 17 โปรดตรวจสอบให้ Toolchain ของโปรเจกต์ตรงตามเวอร์ชันเหล่านี้

ใน AndroidManifest.xml ของแอป เพิ่ม Permission ที่จำเป็น

<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.FOREGROUND_SERVICE"/>
<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>

1
2
3
4

ภายในแท็ก <application> ให้ตั้งค่า AppCompat theme และประกาศ Service ของ Player

<meta-data
    android:name="io.flutter.embedding.android.NormalTheme"
    android:resource="@style/Theme.AppCompat"/>
<service
    android:name="com.byteark.bytearkplayercore.handler.exoplayer.service.ByteArkPlayerService"
    android:enabled="true"
    android:exported="true">
  <intent-filter>
    <action android:name="androidx.media3.session.MediaLibraryService"/>
    <action android:name="android.media.browse.MediaBrowserService"/>
  </intent-filter>
</service>

1
2
3
4
5
6
7
8
9
10
11
12
13

ปรับให้ MainActivity สืบทอดจาก FlutterFragmentActivity (ในไฟล์ android/app/src/main/.../MainActivity.kt)

import io.flutter.embedding.android.FlutterFragmentActivity
class MainActivity: FlutterFragmentActivity()

1
2
3

SDK เผยแพร่ผ่าน Private package registry ของ ByteArk ให้เพิ่ม Access token (ที่ ByteArk จัดเตรียมให้) ลงในไฟล์ android/local.properties

gitLabByteArkPlayerPrivateToken=[YOUR_PRIVATE_TOKEN]
gitLabByteArkLighthousePrivateToken=[YOUR_PRIVATE_TOKEN]

1
2

# ตั้งค่าฝั่ง Web

เพิ่มสคริปต์ของ ByteArk Player Web และ CSS สำหรับปรับขนาด ลงในไฟล์ web/index.html

<head>
  <!-- ... แท็กเดิมของคุณ ... -->
  <script defer src="https://byteark-sdk.cdn.byteark.com/player/v2/byteark-player.min.js"></script>
  <style>
    .video-js { width: 100% !important; height: 100% !important; }
  </style>
</head>
<body>
  <script src="flutter_bootstrap.js" async></script>
</body>

1
2
3
4
5
6
7
8
9
10

# ขอ License Key

ByteArk Player SDK ต้องการ License key แยกสำหรับ iOS และ Android รวมถึง Token สำหรับ Private registry ข้างต้น กรุณาติดต่อ sales@byteark.com เพื่อขอ License key และ Access token สำหรับใช้งานในโปรเจกต์ของคุณ

License key จะถูกใช้ตอนสร้าง ByteArkPlayerConfig ผ่าน ByteArkPlayerLicenseKey

final config = ByteArkPlayerConfig(
  licenseKey: ByteArkPlayerLicenseKey(
    android: "<ANDROID_LICENSE_KEY>",
    iOS: "<IOS_LICENSE_KEY>",
  ),
  playerItem: playerItem,
);

1
2
3
4
5
6
7

← คู่มือแนะนำการใช้งาน ByteArk Player SDK for Flutter การใช้งาน ByteArk Player SDK for Flutter →