last - com.android.support:design 26

Cómo implementar Hojas de Fondo usando la nueva biblioteca de soporte de diseño 23.2

Question

Google lanzó la nueva actualización para admitir la biblioteca 23.2 en el sentido de que agregaron la función de hoja inferior. ¿Alguien puede decir cómo implementar esa hoja inferior usando esa biblioteca?

Answer 1

Puede seguir el tutorial en tutsplus.com https://code.tutsplus.com/articles/how-to-use-bottom-sheets-with-the-design-support-library--cms-26031

<android.support.design.widget.CoordinatorLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.gms.maps.MapView
android:id="@+id/map_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:uiCompass="true"
app:uiMapToolbar="false" />
 <android.support.v4.widget.NestedScrollView
        android:id="@+id/bottom_sheet"
        android:layout_width="match_parent"
app:behavior_peekHeight="100dp"
app:behavior_hideable="true"
        android:layout_height="350dp"
        android:clipToPadding="true"
        android:background="@android:color/holo_orange_light"
        app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
        >
 
        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/ipsum"
            android:padding="16dp"
            android:textSize="16sp"/>
 
    </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Si desea que se pueda descartar el deslizamiento, asegúrese de agregar la app:behavior_hideable="true" en la etiqueta.

Dentro de tu actividad puedes decir:

 BottomSheetBehavior mBottomSheetBehavior = BottomSheetBehavior.from(findViewById(R.id.bottom_sheet));
mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_HIDDEN);
findViewById(R.id.button).setOnClickListener(p-> mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED));

Answer 2

Puede seguir las instrucciones proporcionadas aquí: http://android-developers.blogspot.com/2016/02/android-support-library-232.html

" Al adjuntar un comportamiento de hoja inferior a un niño Vista de un coordinadorLayout (es decir, agregar la aplicación: layout_behavior =" android.support.design.widget.BottomSheetBehavior "), automáticamente obtendrá la detección táctil adecuada para la transición entre cinco estado ... "

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="@color/white">
<!-- Your Widgets -->
<FrameLayout
android:id="@+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff0000"
app:behavior_hideable="true"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Test" />
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>

Luego de tu actividad:

View bottomSheet = findViewById(R.id.bottom_sheet);
BottomSheetBehavior bottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);
bottomSheetBehavior.setState(<desired state>);

Answer 3

gradle: primer uso compile ''com.android.support:design:23.2.0''

en su diseño

<include layout="@layout/content_sheet" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/fab_margin"
android:src="@android:drawable/ic_dialog_email" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/bottom_sheet"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
style="@style/Widget.Design.BottomSheet.Modal">
<CalendarView
android:layout_width="match_parent"
android:layout_height="match_parent"></CalendarView>
</FrameLayout>

en java

 CoordinatorLayout coordinatorLayout= (CoordinatorLayout) findViewById(R.id.cl_main);
final View bottomSheet = coordinatorLayout.findViewById(R.id.bottom_sheet);
final BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet);
behavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
@Override
public void onStateChanged(@NonNull View bottomSheet, int newState) {
}
@Override
public void onSlide(@NonNull View bottomSheet, float slideOffset) {
// React to dragging events
}
});
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
behavior.setState(BottomSheetBehavior.STATE_EXPANDED );
}
});

Answer 4

usa el diseño como abajo

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout>
<android.support.design.widget.CollapsingToolbarLayout>
<ImageView/>
<android.support.v7.widget.Toolbar/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout>
//.....
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<FrameLayout
android:id="@+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:behavior_hideable="true"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
//your bottom sheet layout
</LinearLayout>
</FrameLayout>
<android.support.design.widget.FloatingActionButton/>
</android.support.design.widget.CoordinatorLayout>

en Actividad

CoordinatorLayout coordinatorLayout = (CoordinatorLayout) findViewById(R.id.main_content);
// The View with the BottomSheetBehavior
View bottomSheet = coordinatorLayout.findViewById(R.id.bottom_sheet);
final BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet);
behavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
@Override
public void onStateChanged(@NonNull View bottomSheet, int newState) {
// React to state change
Log.e("onStateChanged", "onStateChanged:" + newState);
if (newState == BottomSheetBehavior.STATE_EXPANDED) {
fab.setVisibility(View.GONE);
} else {
fab.setVisibility(View.VISIBLE);
}
}
@Override
public void onSlide(@NonNull View bottomSheet, float slideOffset) {
// React to dragging events
Log.e("onSlide", "onSlide");
}
});
behavior.setPeekHeight(100);