Las clases de interfaces de navegación multimedia que proporciona la biblioteca de androidx.Leanback Incluye clases para mostrar información adicional sobre un elemento multimedia, como una descripción. o revisiones. También incluyen clases para realizar acciones con respecto a ese artículo, como comprarlo o reproducir su contenido.
En esta guía, se explica cómo crear una clase de presentador para los detalles de los elementos multimedia y cómo extender
la clase DetailsSupportFragment
para implementar una vista de detalles
para un elemento multimedia cuando el usuario lo selecciona.
Nota: En el ejemplo de implementación que se muestra aquí, se usa una actividad adicional para lo siguiente:
contienen DetailsSupportFragment
. Sin embargo, es posible
evita crear una segunda actividad reemplazando BrowseSupportFragment
por DetailsSupportFragment
dentro de la misma actividad usando
transacciones de fragmentos. Para obtener más información sobre cómo usar fragmentos de transacciones, consulta Cómo crear un fragmento.
Cómo crear un presentador de detalles
En el framework de navegación de medios proporcionado por el kit de herramientas de la IU de Leanback, usas presentador
objetos para controlar la visualización de datos en la pantalla, incluidos los detalles de los elementos multimedia.
Para ello, el framework
proporciona el elemento AbstractDetailsDescriptionPresenter
una clase casi completa del presentador
para el elemento multimedia
más detalles. Todo lo que debes hacer es implementar onBindDescription()
para vincular los campos de vista a tus objetos de datos, como se muestra en el
siguiente muestra de código:
Kotlin
class DetailsDescriptionPresenter : AbstractDetailsDescriptionPresenter() { override fun onBindDescription(viewHolder: AbstractDetailsDescriptionPresenter.ViewHolder, itemData: Any) { val details = itemData as MyMediaItemDetails // In a production app, the itemData object contains the information // needed to display details for the media item: // viewHolder.title.text = details.shortTitle // Here we provide static data for testing purposes: viewHolder.apply { title.text = itemData.toString() subtitle.text = "2014 Drama TV-14" body.text = ("Lorem ipsum dolor sit amet, consectetur " + "adipisicing elit, sed do eiusmod tempor incididunt ut labore " + " et dolore magna aliqua. Ut enim ad minim veniam, quis " + "nostrud exercitation ullamco laboris nisi ut aliquip ex ea " + "commodo consequat.") } } }
Java
public class DetailsDescriptionPresenter extends AbstractDetailsDescriptionPresenter { @Override protected void onBindDescription(ViewHolder viewHolder, Object itemData) { MyMediaItemDetails details = (MyMediaItemDetails) itemData; // In a production app, the itemData object contains the information // needed to display details for the media item: // viewHolder.getTitle().setText(details.getShortTitle()); // Here we provide static data for testing purposes: viewHolder.getTitle().setText(itemData.toString()); viewHolder.getSubtitle().setText("2014 Drama TV-14"); viewHolder.getBody().setText("Lorem ipsum dolor sit amet, consectetur " + "adipisicing elit, sed do eiusmod tempor incididunt ut labore " + " et dolore magna aliqua. Ut enim ad minim veniam, quis " + "nostrud exercitation ullamco laboris nisi ut aliquip ex ea " + "commodo consequat."); } }
Cómo extender el fragmento de detalles
Cuando uses la clase DetailsSupportFragment
para mostrar
los detalles de tu elemento multimedia, extiende esa clase para proporcionar contenido adicional, como una vista previa
y las acciones para el elemento multimedia. También puedes proporcionar contenido adicional, como una lista de
elementos multimedia relacionados.
El siguiente código de ejemplo demuestra cómo usar la clase presentadora que se muestra en el en la sección anterior para agregar una vista previa de la imagen y acciones para el elemento multimedia que se está viendo. En este ejemplo, También muestra la adición de una fila de elementos multimedia relacionados, que aparece debajo de la lista de detalles.
Kotlin
private const val TAG = "MediaItemDetailsFragment" class MediaItemDetailsFragment : DetailsSupportFragment() { private lateinit var rowsAdapter: ArrayObjectAdapter override fun onCreate(savedInstanceState: Bundle?) { Log.i(TAG, "onCreate") super.onCreate(savedInstanceState) buildDetails() } private fun buildDetails() { val selector = ClassPresenterSelector().apply { // Attach your media item details presenter to the row presenter: FullWidthDetailsOverviewRowPresenter(DetailsDescriptionPresenter()).also { addClassPresenter(DetailsOverviewRow::class.java, it) } addClassPresenter(ListRow::class.java, ListRowPresenter()) } rowsAdapter = ArrayObjectAdapter(selector) val res = activity.resources val detailsOverview = DetailsOverviewRow("Media Item Details").apply { // Add images and action buttons to the details view imageDrawable = res.getDrawable(R.drawable.jelly_beans) addAction(Action(1, "Buy $9.99")) addAction(Action(2, "Rent $2.99")) } rowsAdapter.add(detailsOverview) // Add a related items row val listRowAdapter = ArrayObjectAdapter(StringPresenter()).apply { add("Media Item 1") add("Media Item 2") add("Media Item 3") } val header = HeaderItem(0, "Related Items") rowsAdapter.add(ListRow(header, listRowAdapter)) adapter = rowsAdapter } }
Java
public class MediaItemDetailsFragment extends DetailsSupportFragment { private static final String TAG = "MediaItemDetailsFragment"; private ArrayObjectAdapter rowsAdapter; @Override public void onCreate(Bundle savedInstanceState) { Log.i(TAG, "onCreate"); super.onCreate(savedInstanceState); buildDetails(); } private void buildDetails() { ClassPresenterSelector selector = new ClassPresenterSelector(); // Attach your media item details presenter to the row presenter: FullWidthDetailsOverviewRowPresenter rowPresenter = new FullWidthDetailsOverviewRowPresenter( new DetailsDescriptionPresenter()); selector.addClassPresenter(DetailsOverviewRow.class, rowPresenter); selector.addClassPresenter(ListRow.class, new ListRowPresenter()); rowsAdapter = new ArrayObjectAdapter(selector); Resources res = getActivity().getResources(); DetailsOverviewRow detailsOverview = new DetailsOverviewRow( "Media Item Details"); // Add images and action buttons to the details view detailsOverview.setImageDrawable(res.getDrawable(R.drawable.jelly_beans)); detailsOverview.addAction(new Action(1, "Buy $9.99")); detailsOverview.addAction(new Action(2, "Rent $2.99")); rowsAdapter.add(detailsOverview); // Add a related items row ArrayObjectAdapter listRowAdapter = new ArrayObjectAdapter( new StringPresenter()); listRowAdapter.add("Media Item 1"); listRowAdapter.add("Media Item 2"); listRowAdapter.add("Media Item 3"); HeaderItem header = new HeaderItem(0, "Related Items", null); rowsAdapter.add(new ListRow(header, listRowAdapter)); setAdapter(rowsAdapter); } }
Cómo crear una actividad de detalles
Fragmentos como DetailsSupportFragment
deben contenerse
dentro de una actividad que se usará para la visualización. Cómo crear una actividad para tus detalles
independiente de la actividad de navegación, te permite invocar la vista de detalles con una
Intent
Esta
explica cómo crear una actividad para que contenga tu implementación de la vista de detalles para
tus elementos multimedia.
Crea la actividad de detalles con un diseño que haga referencia a tu implementación de
DetailsSupportFragment
:
<!-- file: res/layout/details.xml --> <fragment xmlns:android="http://schemas.android.com/apk/res/android" android:name="com.example.android.mediabrowser.MediaItemDetailsFragment" android:id="@+id/details_fragment" android:layout_width="match_parent" android:layout_height="match_parent" />
A continuación, crea una clase de actividad que use el diseño que se muestra en el ejemplo de código anterior:
Kotlin
class DetailsActivity : FragmentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.details) } }
Java
public class DetailsActivity extends FragmentActivity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.details); } }
Finalmente, agrega esta nueva actividad al manifiesto. Recuerda aplicar el tema Leanback para asegurarte para que la interfaz de usuario sea coherente con la actividad de navegación de medios.
<application> ... <activity android:name=".DetailsActivity" android:exported="true" android:theme="@style/Theme.Leanback"/> </application>
Cómo definir un objeto de escucha para elementos en los que se hizo clic
Después de implementar DetailsSupportFragment
, haz lo siguiente:
modificar tu vista principal de navegación de medios para moverte a la vista de detalles cuando un usuario haga clic en un contenido multimedia
elemento. Para habilitar este comportamiento, agrega una
OnItemViewClickedListener
a la
BrowseSupportFragment
que activa un intent para iniciar el elemento
la actividad de detalles.
En el siguiente ejemplo, se muestra cómo implementar un objeto de escucha para iniciar la vista de detalles cuando un usuario Hace clic en un elemento multimedia en la actividad principal de navegación de medios:
Kotlin
class BrowseMediaActivity : FragmentActivity() { ... override fun onCreate(savedInstanceState: Bundle?) { ... // Create the media item rows buildRowsAdapter() // Add a listener for selected items browseFragment.onItemViewClickedListener = OnItemViewClickedListener { _, item, _, _ -> println("Media Item clicked: ${item}") val intent = Intent(this@BrowseMediaActivity, DetailsActivity::class.java).apply { // Pass the item information extras.putLong("id", item.getId()) } startActivity(intent) } } }
Java
public class BrowseMediaActivity extends FragmentActivity { ... @Override protected void onCreate(Bundle savedInstanceState) { ... // Create the media item rows buildRowsAdapter(); // Add a listener for selected items browseFragment.OnItemViewClickedListener( new OnItemViewClickedListener() { @Override public void onItemClicked(Object item, Row row) { System.out.println("Media Item clicked: " + item.toString()); Intent intent = new Intent(BrowseMediaActivity.this, DetailsActivity.class); // Pass the item information intent.getExtras().putLong("id", item.getId()); startActivity(intent); } }); } }