TV App: Apple TV va Android TV uchun ishlab chiqish asoslari

TV App nima

TV App — aqlli televizor platformalarida ishlash uchun mo'ljallangan ilova: Apple TV (tvOS) va Android TV (Google TV). Mobil ilovadan asosiy farq — o'zaro ta'sir usuli. Foydalanuvchi ekranga tegmaydi, balki pult yordamida interfeysni boshqaradi. Barcha elementlar yo'naltirilgan navigatsiya (D-pad) orqali mavjud bo'lishi kerak: yuqori, past, chap, o'ng va tanlash tugmasi.

TV App ishlab chiqish xususiyatlari: ekran o'lchami — Full HD (1920x1080) dan 4K (3840x2160) gacha xhdpi zichligi (Android) yoki @3x (Apple) bilan. Over-scan kompensatsiyasi uchun chekkalardan 5% xavfsiz zona majburiy (tasvirning bir qismi televizor tomonidan kesilishi mumkin). Sensorli ekran yo'q — barcha o'zaro ta'sirlar pult yoki gamepad orqali. Fokus har doim faol elementni ajratib ko'rsatadi. Energiya iste'moli batareya bilan cheklanmagan, ammo ilova uyqu rejimiga o'tishni to'g'ri boshqarishi kerak. Statista (2026) ma'lumotlariga ko'ra, global smart TV bozori yangi televizorlarning 80% dan ortig'ini tashkil qiladi, Apple TV va Android TV esa 250 milliondan ortiq qurilmalarni qamrab oladi.

TV ilovalarining toifalari: video xizmatlar (Netflix, YouTube, Apple TV+), musiqa (Spotify, Apple Music), o'yinlar (Apple Arcade, Google Play Games), fitness (Apple Fitness+, Peloton), ta'lim, yangiliklar, ob-havo, fotosurat. Eng mashhur toifa — video striming, smart TV dan foydalanish vaqtining 70% ni egallaydi.

Apple TV (tvOS): arxitektura

tvOS — Apple TV qurilmasi uchun Apple operatsion tizimi, iOS ga asoslangan. Birinchi chiqarish — 2015 yil Apple TV 4-avlod bilan birga. tvOS iOS bilan XNU yadrosini, Foundation freymvorklarini, UIKit (moslashtirilgan versiyada) va App Sandbox xavfsizlik mexanizmini baham ko'radi. Ishlab chiqish Swift yordamida SwiftUI yoki UIKit bilan amalga oshiriladi.

tvOS ning asosiy komponentlari:

• Focus Engine — interfeysning faol elementini avtomatik aniqlaydigan fokus boshqaruv tizimi
• UIKit tvOS uchun — fokus boshqaruvi uchun UIFocusGuide, UIFocusEnvironment, UIFocusAnimationCoordinator
• SwiftUI — FocusState va focusable() modifikatori bilan deklarativ freymvork
• TVMLKit — JavaScript/TVML interfeyslari uchun freymvork (zamonaviy loyihalarda kam qo'llaniladi)
• StoreKit — ilova ichidagi xaridlar va obunalar
• AVFoundation — HDR va Dolby Atmos qo'llab-quvvatlashi bilan video va audio kontentni ijro etish

tvOS ilovasining hayotiy sikli iOS ga o'xshash: notRunning, foregroundActive, foregroundInactive, background. Xususiyat: ilova zaruratsiz fon ruxsatlarini so'ramasligi kerak — sistema fon jarayonini majburiy tugatishi mumkin. Navigatsiya topologiyasi UISplitViewController va UITabBarController atrofida quriladi „Bosh sahifa“, „Qidiruv“, „Kutubxona“, „Sozlamalar“ yorliqlari bilan.

Android TV: arxitektura

Android TV — televizorlar va pristavkalar uchun optimallashtirilgan Android versiyasi, birinchi marta 2014 yilda taqdim etilgan. 2020 yildan boshlab Google TV mavjud — Android TV ustida yangi interfeysli qatlam, ammo ilova ishlab chiqish Android TV SDK da amalga oshiriladi, Google TV bilan mos keladi. Asosiy til — Kotlin, UI freymvorklari — Leanback Library (klassik) va Jetpack Compose for TV (eksperimental).

Android TV ning asosiy komponentlari:

• Leanback Library — BrowseFragment, DetailsFragment, PlaybackOverlayFragment, SearchFragment, Presenter
• Android TV Input Framework — klaviaturalar, pultlar va gamepadlar yaratish
• MediaSession — media kontentni ijro etishni boshqarish
• Recommendations — NotificationManager orqali bosh ekranda tavsiyalar kanali
• Leanback Preferences — TV uslubidagi sozlamalar ekranlari

Android TV ning mobil Android dan farqlari: ilova manifestda LEANBACK_LAUNCHER toifasini majburiy e'lon qiladi; minimal layout kengligi — 1920dp; sensorli o'zaro ta'sir D-pad navigatsiyasi bilan almashtirilgan; Leanback fragmentlaridan foydalanish tavsiya etiladi; apparat tezlashtirish majburiy. Qurilish ARM64 va x86 arxitekturalarini qo'llab-quvvatlaydigan APK/AAB ni o'z ichiga oladi. 2025 yildan zamonaviy loyihalar uchun TvLazyColumn, TvButton, TvCard komponentlari bilan Jetpack Compose for TV tavsiya etiladi.

Focus Engine va fokus boshqaruvi

Focus Engine — har bir TV platformasining asosiy komponenti, interfeysning qaysi elementi faol ekanligiga javob beradi. tvOS da Focus Engine UIKit ga o'rnatilgan va avtomatik ishlaydi. D-pad tugmasi bosilganda, sistema barcha focusable-elementlarning joylashuvini tahlil qiladi, bosish yo'nalishidagi eng yaqin nomzodni hisoblaydi va fokusni animatsiya bilan unga o'tkazadi (UIFocusAnimationCoordinator).

Focus Engine qoidalari: sistema harakat o'qi bo'ylab elementlar orasidagi masofani, elementlar proyeksiyalarining kesishishini (element nomzod hisoblanadi, agar uning proyeksiyasi joriy fokus proyeksiyasini kesib o'tsa), bir xil masofadagi elementlar ustuvorligini (to'g'ri chiziq bo'ylab eng yaqini tanlanadi) hisobga oladi. Dasturchi UIFocusGuide yordamida fokusga ta'sir qilishi mumkin — ma'lum bir yo'nalishda bosilganda fokusni muayyan elementga yo'naltiradigan ko'rinmas yo'naltiruvchi to'rtburchak.

Android TV da fokus Android ning standart fokus tizimi orqali amalga oshiriladi focusable va nextFocus* (nextFocusDown, nextFocusUp, nextFocusLeft, nextFocusRight) atributlari bilan. Animatsiya StateListAnimator orqali sozlanadi. Google barcha interaktiv elementlarda focusable o'rnatishni va navigatsiyani aniq boshqarish uchun nextFocus dan foydalanishni tavsiya qiladi. Fokus animatsiyasi UX uchun muhim — fokus o'tishida 150–250 ms davomiylik bilan silliq masshtab animatsiyasi (1.0 → 1.05–1.2) sodir bo'lishi kerak.

Kod namunalari: Swift va Kotlin

Focus Engine qo'llab-quvvatlashi bilan film ro'yxatini ko'rsatadigan Apple TV uchun SwiftUI da oddiy TV ilova namunasi.

import SwiftUI

struct Movie: Identifiable {
    let id = UUID()
    let title: String
    let subtitle: String
}

struct ContentView: View {
    @FocusState private var focusedMovie: UUID?

    let movies: [Movie] = [
        Movie(title: "Inception", subtitle: "2010, Sci-Fi"),
        Movie(title: "Interstellar", subtitle: "2014, Sci-Fi"),
        Movie(title: "The Matrix", subtitle: "1999, Action"),
        Movie(title: "Blade Runner 2049", subtitle: "2017, Sci-Fi"),
    ]

    var body: some View {
        VStack(alignment: .leading, spacing: 40) {
            Text("Filmlar").font(.title).padding(.leading, 60)
            ScrollView(.horizontal, showsIndicators: false) {
                HStack(spacing: 40) {
                    ForEach(movies) { movie in
                        VStack {
                            Image(systemName: "film.fill")
                                .resizable()
                                .frame(width: 200, height: 300)
                                .cornerRadius(12)
                                .focusable()
                                .focused($focusedMovie, equals: movie.id)
                            Text(movie.title).font(.headline)
                            Text(movie.subtitle).font(.subheadline).foregroundColor(.secondary)
                        }
                        .scaleEffect(focusedMovie == movie.id ? 1.15 : 1.0)
                        .animation(.easeInOut(duration: 0.2), value: focusedMovie)
                    }
                }
                .padding(.horizontal, 60)
            }
        }
        .onAppear { focusedMovie = movies.first?.id }
    }
}

Asosiy nuqtalar: @FocusState — joriy fokusni kuzatish; .focusable() — elementni fokus uchun mavjud qiladi; .scaleEffect() — fokusda kattalashtirish animatsiyasi, TV da vizual fikr bildirish uchun muhim.

Kotlin da Leanback Library bilan Android TV uchun o'xshash namuna:

// MainActivity.kt
class MainActivity : FragmentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }
}

class MainFragment : BrowseSupportFragment() {
    private val moviePresenter = MoviePresenter()

    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)
        title = getString(R.string.app_name)
        headersState = HEADERS_ENABLED
        setupAdapter()
    }

    private fun setupAdapter() {
        val rowsAdapter = ArrayObjectAdapter(ListRowPresenter())
        val listRowAdapter = ArrayObjectAdapter(moviePresenter)
        listRowAdapter.add(Movie("Inception", "2010", R.drawable.poster_1))
        listRowAdapter.add(Movie("Interstellar", "2014", R.drawable.poster_2))
        rowsAdapter.add(ListRow(HeaderItem(0, "Movies"), listRowAdapter))
        adapter = rowsAdapter
    }
}

data class Movie(val title: String, val subtitle: String, val imageResId: Int)

class MoviePresenter : Presenter() {
    override fun onCreateViewHolder(parent: ViewGroup): ViewHolder {
        val cardView = ImageCardView(parent.context).apply {
            isFocusable = true
            setMainImageDimensions(200, 300)
        }
        return ViewHolder(cardView)
    }

    override fun onBindViewHolder(viewHolder: ViewHolder, item: Any) {
        val movie = item as Movie
        (viewHolder.view as ImageCardView).apply {
            titleText = movie.title
            contentText = movie.subtitle
        }
    }

    override fun onUnbindViewHolder(viewHolder: ViewHolder) {}
}

Asosiy nuqtalar: BrowseSupportFragment — sarlavhalar bilan Leanback ning asosiy fragmenti; Presenter — RecyclerView.Adapter ga o'xshash ViewHolder yaratish uchun abstraksiya; ImageCardView — rasm, sarlavha va taglavhali standart karta; isFocusable = true — TV elementlari uchun majburiy atribut.