Material3 Compose

Biblioteka media3-ui-compose-material3 udostępnia element kompozycyjny Player, który wyświetla elementy sterujące odtwarzaczem, pasek postępu i bieżące treści multimedialne. Zarządza wewnętrznie zarówno stanem, jak i stylem Material 3. Więcej informacji o tym, której biblioteki użyć, znajdziesz w omówieniu Media3 Compose.

// The library provides styled UI components
Row {
  SeekBackButton(player)
  PlayPauseButton(player)
  SeekForwardButton(player)
}

// You can rearrange the composables into a layout that suits your needs
@Composable
fun PlayerProgressControlsLeftAligned(player: Player) {
  Row {
    PositionAndDurationText(player)
    ProgressSlider(player)
  }
}

@Composable
fun PlayerProgressControlsCenterAligned(player: Player) {
  Row {
    PositionText(player)
    ProgressSlider(player)
    DurationText(player)
  }
}

Dostosowywanie komponentów Material 3

Chociaż media3-ui-compose-material3 udostępnia komponenty zgodne z Material 3 Design, nadal masz pełną kontrolę nad motywami. Możesz dostosować spersonalizowane kolory, typografię i kształty, opakowując interfejs odtwarzacza w MaterialTheme.

Aby na przykład zmienić kolor elementu PlayPauseButton, możesz podać niestandardowy element colorScheme:

MaterialTheme(
  colorScheme =
    lightColorScheme(
      primary = Color.Red, // Change the primary color for the button
      onPrimary = Color.White,
    )
) {
  // The PlayPauseButton will now use the custom colors
  PlayPauseButton(player)
}

Dostępne komponenty Material 3

Biblioteka media3-ui-compose-material3 zawiera zestaw gotowych funkcji kompozycyjnych dla typowych elementów sterujących odtwarzaczem. Oto niektóre komponenty, których możesz używać bezpośrednio w aplikacji:

Komponent Opis
Player Odtwarzacz z elementami sterującymi, paskiem postępu, napisami i ramką treści na film lub grafikę.
PlayPauseButton Przycisk, który przełącza między odtwarzaniem a wstrzymaniem i pokazuje stany buforowania, ponownego odtwarzania i ponownej próby.
SeekBackButton Przycisk do przewijania do tyłu o określony interwał.
SeekForwardButton Przycisk do przewijania do przodu o określony interwał.
NextButton Przycisk umożliwiający przejście do następnego elementu multimedialnego.
PreviousButton Przycisk umożliwiający przejście do poprzedniego elementu multimedialnego.
RepeatButton Przycisk do przełączania trybów powtarzania.
ShuffleButton Przycisk do włączania i wyłączania trybu odtwarzania losowego.
MuteButton Przycisk do wyciszania i wyłączania wyciszenia odtwarzacza.
LiveButton Przycisk, który wskazuje, czy odtwarzanie transmisji na żywo jest na bieżąco, i który po kliknięciu przewija do bieżącego momentu.
PositionAndDurationText komponent Text, który wyświetla bieżącą pozycję i łączny czas trwania;
PositionText Komponent Text, który wyświetla bieżącą pozycję.
DurationText komponent Text, który wyświetla łączny czas trwania;
RemainingDurationText Funkcja kompozycyjna Text, która wyświetla pozostały czas.
ProgressSlider Suwak, który pokazuje postęp odtwarzania i umożliwia użytkownikowi przewijanie.
BufferingIndicator Wskaźnik postępu wyświetlany podczas buforowania odtwarzacza.

Ta lista nie jest wyczerpująca. Wszystkie dostępne komponenty znajdziesz w dokumentacji interfejsu API biblioteki.

Dwa inne gotowe elementy kompozycyjne, których prawdopodobnie będziesz potrzebować, są związane z zarządzaniem powierzchnią i znajdują się w module media3-ui-compose, ponieważ nie mają Material Theming.

Komponent Opis
ContentFrame Powierzchnia na treści multimedialne, która obsługuje zarządzanie formatem obrazu, zmianę rozmiaru, migawkę, grafikę i miejsce na napisy.
PlayerSurface Nieprzetworzona powierzchnia, która zawiera SurfaceView i TextureView w AndroidView.