Bottom Sheet Menu Full Block Explanation - Free AIA

28 Jan 2019, 07:03 PM
Kodular Components

The Bottom Sheet component is used to display a dialog box or you can say a small Pop-up dialog where you can add contents from a Layout section like an Horizontal Arrangement or you can just add a single Component like Button or Check box. Bottom Sheets are normally used to create a menu with options or as a simple text information dialog box. Bottom Sheet is a non-visible component and it's located at the bottom of the screen. You can change its properties from the properties panel on the right side.

For example you can create a Bottom Sheet Menu like the image below.

1. Creating a Bottom Sheet Menu
In the component palette, click on the category User interface and drag the Bottom Sheet component into the design viewer.

Lets see what type  of blocks are available in Bottom Sheet Component.\

Note : 
  • Before you use any of the blocks mentioned below, the contents of the Bottom Sheet must be set using either Register Component As Dialog or Register Layout As Dialog

2. Register Bottom Sheet Menu - on screen initialization you have to assign the required components to act as a bottom sheet menu,  you can set a component like button or a layout component like horizontal arrangement to make a bottom sheet menu. In this case i have used a Button2 and a Horizontal_Arrangement1 component.

3. Show Dialog - "show dialog" is used to Display the Bottom Sheet on the Screen which we you have assigned on screen initialization. 

4. Closed - This block is used to Indicates that the Bottom Sheet Menu has been dismissed and closed. For example you can show any alert message if Bottom Sheet menu is closed.

5. Opened - This block is used when any bottom sheet menu was opened and now visible on the Screen. For example you can show any alert message if Bottom Sheet menu is opened.

6A. Dim background - This block is used to add Dimming Effect when The Bottom Sheet is visible. See the Preview image from Kodular given above. It supports only True & False statement

6B. Show Status Bar - show statusbar block is used to show or hide status bar when you open a bottom sheet menu. It also supports only True & False statement

  1. The Component or Layout used in Register Component As Dialog or Register Layout As Dialog should be visible on the screen, you must set the visibility to true, so when the screen initializes, it will be hidden automatically from the Screen. 
  2. The Component or Layout must have its Height property set to Automatic. Otherwise it wont work properly like other options.
Learn more in details at - Kodular Documentation Website

Click on the Button Below to Download AIA File

Download AIA

Terms and Conditions

This Project is Developed By Tech CVR

  1. You cant sell this aia to any person. if you want to sell it then you have to contact the original creator of this aia at - or using email at
  2. You cant post videos about this software on youtube or write any blog or article or any social media platform without the original creators permission
  3. You cant modify the terms and conditions.

This project is also licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License. To view a copy of this license, visit or send a letter to Creative Commons, PO Box 1866, Mountain View, CA 94042, USA.

Search by Tags
Bottom Sheet MenuFree AIAKodular ComponentsAIA

Bottom Navigation Full Block Explanation - Free AI...

Kodular Components

Bottom Navigation - Learn every block details and how to implement it in your app

30 Jan 2019