Using an Activity/Fragment on a bottom sheet

Asked

Viewed 325 times

2

I was doing a study on the Bottom Sheet, and I built something similar to this tutorial link.

I was wondering how I could put together something similar to what the Uber app does. It is a bottom sheet, which when expanded seems to me to become a new Activity.

Does anyone know how to create something similar or has an example made?

I’m leaving the video link where it shows the exact moment of the component I seek.

inserir a descrição da imagem aqui

inserir a descrição da imagem aqui

  • What is your specific doubt?

  • The bottom sheet transition effect, where when started is a card with margin on the side and when expanded a Toolbar appears, with a layout above the card and no margin @ramaral

  • https://uber-design-herokuapp-com.global.ssl.fastly.net/7457991f6084e7507818b227c718a800.webm something like that

1 answer

1

In step "4. Using a Bottom Sheet Fragment" of the link you have made available has a code snippet that creates a Bottomsheet without the need for visual code to be present in the xml file of Activity where it will appear, the method of line 19(from step 4 of the link provided), is called to create and program your custom view that will be placed on Bottomsheet, you can create the desired layout by following the image step by step below Passo a passo para a criação do novo arquivo de layout.

and replace the "R.layout.fragment_bottom_sheet" of line 22

View contentView = View.inflate(getcontext(), R.layout.fragment_bottom_sheet, null);

By the name of your xml file, and program your view as desired, accessing the objects by findViewById(), only now before findViewById(), it is necessary to put the name of the variable of the line 22, which in the case of the example is contentView, ending then contentView.findViewById();

  • My doubt is more in the bottom sheet transition effect, where when it is started it is a card with margin on the sides and when expanded it appears a Toolbar, with a layout above the card and no margin.

  • Something like this https://uber-design-herokuapp-com.global.ssl.fastly.net/7457991f6084e7507818b227c718a800.webm

  • If your layout has a Toolbar with behavior set it will behave like in Uber

Browser other questions tagged

You are not signed in. Login or sign up in order to post.