Skip to main content
Version: v8

ion-app

App is a container element for an Ionic application. There should only be one <ion-app> element per project. An app can have many Ionic components including menus, headers, content, and footers. The overlay components get appended to the <ion-app> when they are presented.

Using ion-app enables the following behaviors:

  • Keyboard Lifecycle Events without the need for any native plugins
  • Hardware Back Button Listeners for customizing the hardware back button behavior on Android devices
  • Status bar support in Capacitor or Cordova which allows users to scroll to the top of the view by tapping the status bar
  • Scroll assist utilities which scroll the content so focused text inputs are not covered by the on-screen keyboard
  • Ripple effect when activating buttons on Material Design mode
  • Other tap and focus utilities which make the experience of using an Ionic app feel more native

Programmatic Focus

Ionic offers focus utilities for components with the ion-focusable class. These utilities automatically manage focus for components when certain keyboard keys, like Tab, are pressed. Components can also be programmatically focused in response to user actions using the setFocus method from ion-app.

Properties

No properties available for this component.

Events

No events available for this component.

Methods

setFocus

DescriptionUsed to set focus on an element that uses ion-focusable. Do not use this if focusing the element as a result of a keyboard event as the focus utility should handle this for us. This method should be used when we want to programmatically focus an element as a result of another user action. (Ex: We focus the first element inside of a popover when the user presents it, but the popover is not always presented as a result of keyboard action.)
SignaturesetFocus(elements: HTMLElement[]) => Promise<void>

CSS Shadow Parts

No CSS shadow parts available for this component.

CSS Custom Properties

No CSS custom properties available for this component.

Slots

No slots available for this component.