ionic-framework
Version:
130 lines (128 loc) • 3.46 kB
TypeScript
/**
* Config lets you change multiple or a single value in an apps mode configuration. Things such as tab placement, icon changes, and view animations can be set here.
*
* ```ts
* @App({
* template: `<ion-nav [root]="root"></ion-nav>`
* config: {
* backButtonText: 'Go Back',
* iconMode: 'ios',
* modalEnter: 'modal-slide-in',
* modalLeave: 'modal-slide-out',
* tabbarPlacement: 'bottom',
* pageTransition: 'ios',
* }
* })
* ```
*
* Config can be overwritting at multiple levels, allowing deeper configuration. Taking the example from earlier, we can override any setting we want based on a platform.
* ```ts
* @App({
* template: `<ion-nav [root]="root"></ion-nav>`
* config: {
* tabbarPlacement: 'bottom',
* platforms: {
* ios: {
* tabbarPlacement: 'top',
* }
* }
* }
* })
* ```
*
* We could also configure these values at a component level. Take `tabbarPlacement`, we can configure this as a property on our `ion-tabs`.
*
* ```html
* <ion-tabs tabbar-placement="top">
* <ion-tab tab-title="Dash" tab-icon="pulse" [root]="tabRoot"></ion-tab>
* </ion-tabs>
* ```
*
* The property will override anything else set in the apps.
*
* The last way we could configure is through URL query strings. This is useful for testing while in the browser.
* Simply add `?ionic<PROPERTYNAME>=<value>` to the url.
*
* ```bash
* http://localhost:8100/?ionicTabbarPlacement=bottom
* ```
*
* A config value can come from anywhere and be anything, but there are a default set of values.
*
* ``` javascript
* // iOS
* activator: 'highlight',
* actionSheetEnter: 'action-sheet-slide-in',
* actionSheetLeave: 'action-sheet-slide-out',
* actionSheetCancelIcon: '',
* actionSheetDestructiveIcon: '',
* backButtonText: 'Back',
* backButtonIcon: 'ion-ios-arrow-back',
* iconMode: 'ios',
* menuType: 'reveal',
* modalEnter: 'modal-slide-in',
* modalLeave: 'modal-slide-out',
* pageTransition: 'ios-transition',
* pageTransitionDelay: 16,
* popupEnter: 'popup-pop-in',
* popupLeave: 'popup-pop-out',
* tabbarPlacement: 'bottom',
* // MD
* activator: 'ripple',
* actionSheetEnter: 'action-sheet-md-slide-in',
* actionSheetLeave: 'action-sheet-md-slide-out',
* actionSheetCancelIcon: 'ion-md-close',
* actionSheetDestructiveIcon: 'ion-md-trash',
* backButtonText: '',
* backButtonIcon: 'ion-md-arrow-back',
* iconMode: 'md',
* menuType: 'overlay',
* modalEnter: 'modal-md-slide-in',
* modalLeave: 'modal-md-slide-out',
* pageTransition: 'md-transition',
* pageTransitionDelay: 120,
* popupEnter: 'popup-md-pop-in',
* popupLeave: 'popup-md-pop-out',
* tabbarHighlight: true,
* tabbarPlacement: 'top',
* tabSubPages: true,
* ```
*
*
**/
export declare class Config {
constructor(config: any);
/**
* For setting and getting multiple config values
*/
/**
* @private
* @name settings()
* @description
*/
settings(): any;
/**
* For setting a single config values
*/
/**
* @private
* @name set()
* @description
*/
set(): this;
/**
* For getting a single config values
*/
/**
* @private
* @name get()
* @description
*/
get(key: any): any;
/**
* @private
*/
setPlatform(platform: any): void;
static setModeConfig(mode: any, config: any): void;
static getModeConfig(mode: any): any;
}