Description

Very useful extension to add a navigation sidebar in your application. It can work as a sidemenu to effectively manage your screens and to display images and information.

 

Methods

  • AfterSelecting: Event handler after item selection from the sidebar, returns the position and value of the item.
  • Hide: Method for hiding the sidebar with animation. Parameters: String interpolator: String with the selected animation to hide the sidebar. Currently available: Default or LinearInterpolator, AccelerateDecelerateInterpolator, AccelerateInterpolator and BounceInterpolator. Note: For default interpolator, pass an empty text.
  • Show: Method for showing the sidebar with animation. Parameters: String interpolator: String with the selected animation to show the sidebar. Currently available: Default or LinearInterpolator, AccelerateDecelerateInterpolator, AccelerateInterpolator and BounceInterpolator. Note: For default interpolator, pass an empty text.
  • Start: Method for starting the sidebar, it should be use when initializing the screen. Parameters: 1) List listItem: List with the values to be displayed in the sidebar as a menu. 2) List icons: List with the icons that will be displayed with the items (). 3) List colorIcons: List with the colors in hexcode format for the icons. 4) String imagen: Text with name or location of the image to be displayed in the sidebar. 5) String selectColor: Text with the color in hexcode format when an item is selected. String interpolator: String with the selected animation to show the sidebar (Currently available: Default or LinearInterpolator, AccelerateDecelerateInterpolator, AccelerateInterpolator and BounceInterpolator). Note: listItem, icons and colorIcons lists should be the same size. For default interpolator, pass an empty text.

Properties

  • Interpolators:
    • AccelerateDecelerateInterpolator: Returns a String with the AccelerateDecelerateInterpolator, useful in Hide, Show and Start blocks.

  • AccelerateInterpolator: Returns a String with the AccelerateInterpolator, useful in Hide, Show and Start blocks.
  • BounceInterpolator: Returns a String with the BounceInterpolator, useful in Hide, Show and Start blocks.
  • LinearInterpolator: Pass an empty text in Hide, Show and Start blocks to select the default interpolator.

 

 

  • AlphaIcon: Specifies the Alpha or opacity for the Icon to be displayed in the sidebar. Also available in Designer Properties. Use number between 0 and 1. Default: 0.56.
  • AlphaText: Specifies the Alpha or opacity for the Text to be displayed in the sidebar. Also available in Designer Properties. Use number between 0 and 1. Default: 0.87
  • ColorBG: Specifies the color of the sidebar’s background in HexCode format. Also available in Designer Properties. Default: #FFFFFF.
  • ColorIcons: Specifies and returns the color of the icons to be displayed in the sidebar in HexCode format. Also available in Designer Properties. Default: #000000
  • Development: Flag for letting the extension know when your using it in development. Check it at Designer Properties when developing and uncheck it for deployment.
  • Elevation: Specifies the shadow effect between the sidebar and the back screen. Also available in Designer Properties. Default: 16
  • SetAvatar: Specifies the name or location of the image to be displayed in the sidebar as an avatar.
  • SetTextName: Specifies the text to be displayed as a name in the sidebar.
  • SetTexteMail: Specifies the email to be displayed as a name in the sidebar.
  • TextColor: Specifies the color of the text to be displayed in the sidebar in HexCode format. Also available in Designer Properties. Default: #000000
  • TypeFontIcon: Specifies the font of the icons to be displayed in the sidebar. Also available in Designer Properties.
  • TypeFontText: Specifies the font of the text to be displayed in the sidebar. Also available in Designer Properties.
  • WidthSidebar: Specifies the width size of the sidebar. Also available in Designer Properties. Use number between 0 and 1. Default: 0.8

 

Best practice

It is a good practice to start the sidebar when initializing the screen and when the screen orientation changes, by setting its arguments: listItem, icons, colorIcons, imagen, selectColor and interpolator.

 

When you want to display the sidebar use the Show Method. In this example, when the user clicks on the btnMenu, the sidebar will appear with a BounceInterpolator animation.

 

When the user selects an item in the sidebar, you can use the AfterSelecting Event Handler to know the position and the value of the selected item. Also, if you want to hide the sidebar, you can use the Hide method. In this example, when the user selects the “Reminder” item, the extension hides the sidebar with an AccelerateDecelerateInterpolator animation and notifies the user: “Have a nice day”.

 

Price

For the last update with major and minor bugs fixed, please consider donating USD$ 10 or more at: https://www.paypal.me/andrescotes/

Changelog

 

Terms and Conditions

  • THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  • This is is the only authorized place to download this extension. It is not allowed to host this extension somewhere else and offer it for others to download, be it on another website or market place or similar. The reason is, everybody should be able to have the opportunity to donate something in case you like my work. You are allowed to provide a link to this site, so others can download the extension here. You will find the most up to date version always here including documentation and usage examples. Thank you for your kind understanding.

Downloads

.AIX: Link (Free version)

Test .AIA: Link.

Roboto Medium Font: Link

MaterialIcons-Regular.zip: Link

WhatsApp chat