De forma predeterminada, las pestañas personalizadas se inician como una actividad en ventana completa. Cómo comenzar en Chrome 107, puedes usar pestañas personalizadas parciales para especificar una altura de inicio diferente en modo Retrato, de modo que los usuarios puedan realizar varias tareas a la vez interactuando con la app mientras ver contenido web. Los usuarios pueden expandir la pestaña Personalizar a pantalla completa arrastrando la barra de herramientas manejarás hacia arriba y restaurarás la altura de inicio inicial arrastrando el con la manija hacia abajo.
![Captura de pantalla de la pestaña parcial de una hoja inferior](https://developer.chrome.com/static/docs/android/custom-tabs/guide-partial-custom-tabs/image/example-partial-tab-ff19cab6a28dd.png?authuser=19&hl=es)
Para pantallas grandes o dispositivos en modo horizontal a partir de Chrome 120, puedes especificar, un ancho de inicio máximo para mostrar una pestaña personalizada parcial en un lado de la hoja de cálculo. Si estableces un punto de interrupción, podrás decidir cuándo iniciar un evento personalizado parcial Usa Tab en una hoja inferior o lateral.
![Captura de pantalla de una hoja lateral Pestaña parcial](https://developer.chrome.com/static/docs/android/custom-tabs/guide-partial-custom-tabs/image/example-partial-tab-sidesheet.jpg?authuser=19&hl=es)
Requisitos
Para poder usar pestañas personalizadas parciales, debes hacer lo siguiente:
Inicia una nueva sesión del navegador con una
CustomTabsServiceConnection
. y la pasas al intent de pestañas personalizadas oiniciar la actividad de la pestaña personalizada con
startActivityForResult()
Combina ambos enfoques si deseas un inicio rápido en caso de que el servicio aún no se estableció conexión.
Cómo configurar la hoja inferior
Para convertir una pestaña personalizada en una parcial, define la altura de inicio inicial
en píxeles llamando al CustomTabBuilder
setInitialActivityHeightPx()
. Por defecto, se puede modificar el tamaño de la pestaña personalizada parcial, pero puedes pasar
ACTIVITY\_HEIGHT\_FIXED
para inhabilitar este comportamiento:
new CustomTabsBuilder().setInitialActivityHeightPx(
400,
ACTIVITY_HEIGHT_FIXED
);
Configuración de la hoja lateral
Para configurar el comportamiento de la hoja lateral, define el ancho inicial en píxeles
llamando al archivo de clase CustomTabBuilder
setInitialActivityWidthPx()
.
Por defecto, se puede modificar el tamaño de la pestaña personalizada parcial, pero puedes pasar
ACTIVITY\_HEIGHT\_FIXED
para inhabilitar este comportamiento:
CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder(session)
.setInitialActivityHeightPx(400)
.setInitialActivityWidthPx(400);
.setActivitySideSheetBreakpointDp(800);
La pestaña personalizada se comportará como una hoja lateral si el ancho de la pantalla es mayor que
el valor del punto de interrupción establecido por
setActivitySideSheetBreakpointDp().
Si el ancho de la pantalla es superior a x
, la pestaña personalizada se comportará como lateral.
hoja; de lo contrario, se comportará como una hoja inferior. Si no hay un punto de interrupción
especificado, establece la implementación del navegador como el valor predeterminado 840dp
.
Si x
se establece como <600dp
, la implementación del navegador debería establecerse como la configuración predeterminada
600dp
Cómo iniciar una pestaña personalizada parcial con una sesión existente
CustomTabsSession customTabsSession;
// ...
CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder(customTabsSession)
.setInitialActivityHeightPx(500)
.setInitialActivityWidthPx(400);
.setActivitySideSheetBreakpointDp(800);
.setCloseButtonPosition(CustomTabsIntent.CLOSE_BUTTON_POSITION_END)
// ...
.build();
customTabsIntent.launchUrl(context, Uri.parse(url))
Cómo iniciar una pestaña personalizada parcial a través de startActivityForResult
private ActivityResultLauncher<String> mCustomTabLauncher = registerForActivityResult(new ActivityResultContract<String, Integer>() {
@Override
public Integer parseResult(int statusCode, @Nullable Intent intent) {
return statusCode;
}
@NonNull
@Override
public Intent createIntent(@NonNull Context context, String url) {
CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder(customTabsSession)
.setInitialActivityHeightPx(500)
.setInitialActivityWidthPx(400);
.setActivitySideSheetBreakpointDp(800);
.setCloseButtonPosition(CustomTabsIntent.CLOSE_BUTTON_POSITION_END)
.setToolbarCornerRadiusDp(10);
Intent customTabsIntent = builder.build().intent;
customTabsIntent.setData(Uri.parse(url));
return customTabsIntent;
}
}, new ActivityResultCallback<Integer>() {
@Override
public void onActivityResult(Integer statusCode) {
// ...
}
});
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
Button selectButton = findViewById(R.id.select_button);
selectButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
mCustomTabLauncher.launch(customTabsIntent.intent);
}
});
}
A continuación, obtén información para medir la participación de los usuarios en tus pestañas personalizadas.