Recipes

BasicViewTransformer

This is a InsetViewTransformer that insets the content view slightly behind the bottom sheet as it's open.

GIF

public class InsetViewTransformer extends BaseViewTransformer {
    @Override
    public void transformView(float translation, float maxTranslation, float peekedTranslation, BottomSheetLayout parent, View view) {
        float progress = Math.min(translation / peekedTranslation, 1);
        float scale = (1 - progress) + progress * 0.9f;
        view.setScaleX(scale);
        view.setScaleY(scale);

        if (translation == 0 || translation == parent.getHeight()) {
            parent.setBackgroundColor(0);
            ensureLayer(view, View.LAYER_TYPE_NONE);
        } else {
            parent.setBackgroundColor(view.getResources().getColor(<whatever you want>));
            ensureLayer(view, View.LAYER_TYPE_HARDWARE);
        }

        float translationToTop = -(view.getHeight() * (1 - scale)) / 2;
        view.setTranslationY(translationToTop + progress * 20 * view.getContext().getResources().getDisplayMetrics().density);
    }

    private void ensureLayer(View view, int layerType) {
        if (view.getLayerType() != layerType) {
            view.setLayerType(layerType, null);
        }
    }
}

Shadow and elevation

The Material Design spec specifies that bottom sheets should have an elevation of 16dp. The commons components all have this, but this is something that has to be implements on a per-view basis and can't be handled by BottomSheetLayout directly. Here is how we do it in our sheet views:

// In your view class, override this method
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    // Necessary for showing elevation on 5.0+
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        setOutlineProvider(new Util.ShadowOutline(w, h));
    }
}

// ShadowOutline implementation
@TargetApi(21)
static class ShadowOutline extends ViewOutlineProvider {

    int width;
    int height;

    ShadowOutline(int width, int height) {
        this.width = width;
        this.height = height;
    }

    @Override
    public void getOutline(View view, Outline outline) {
        outline.setRect(0, 0, width, height);
    }
}

Now you'll have an appropriate shadow when you set elevation!