Skip to main content

平台

平台服务可用于获取有关你当前设备的信息。你可以使用 platforms 方法获取与设备关联的所有平台，包括应用是否正在从平板电脑上查看、是否在移动设备或浏览器上以及确切的平台（iOS、Android 等）。你还可以获取设备的方向（如果它使用从右到左的语言方向）等等。有了这些信息，你可以完全自定义你的应用以适应任何设备。

¥The Platform service can be used to get information about your current device. You can get all of the platforms associated with the device using the platforms method, including whether the app is being viewed from a tablet, if it's on a mobile device or browser, and the exact platform (iOS, Android, etc). You can also get the orientation of the device, if it uses right-to-left language direction, and much much more. With this information you can completely customize your app to fit any device.

用法​

¥Usage



import { Platform } from '@ionic/angular';



@Component({...})
export class MyPage {
  constructor(public platform: Platform) {

  }
}

方法​

¥Methods

is​

描述根据用户所在的平台，is(platformName) 将返回 true 或 false。请注意，同一应用可以针对多个平台名称返回 true。例如，从 iPad 运行的应用将为平台名称返回 true：mobile、ios、ipad 和 tablet。此外，如果应用从 Cordova 运行，则 cordova 将为 true。
签名is(platformName: Platforms) => boolean

参数​

¥Parameters

名称类型描述
platformNamePlatforms平台名称。可用选项有 android、Capacitor、cordova、桌面、electron、混合、ios、ipad、iphone、移动、phablet、pwa、平板电脑

平台​

¥Platforms

下表列出了所有可能的平台值以及相应的描述。

¥Below is a table listing all the possible platform values along with corresponding descriptions.

平台名称描述
android运行 Android 的设备
capacitor运行 Capacitor 的设备
cordova运行 Cordova 的设备
desktop桌面设备
electron运行 Electron 的桌面设备
hybrid运行 Capacitor 或 Cordova 的设备
ios运行 iOS 的设备
ipadiPad 设备
iphoneiPhone 设备
mobile移动设备
mobileweb在移动设备上运行的网络浏览器
phablet平板手机设备
pwa一个 PWA 应用
tablet平板电脑设备

自定义平台检测功能​

¥Customizing Platform Detection Functions

用于检测特定平台的函数可以通过在全局 Ionic 配置.h 中提供替代函数来覆盖。每个函数都以 window 作为参数并返回一个布尔值。

¥The function used to detect a specific platform can be overridden by providing an alternative function in the global Ionic config. Each function takes window as a parameter and returns a boolean.



import { IonicModule } from '@ionic/angular';



@NgModule({
  ...
  imports: [
    BrowserModule,
    IonicModule.forRoot({
      platform: {
        /** The default `desktop` function returns false for devices with a touchscreen.

        * This is not always wanted, so this function tests the User Agent instead.
        **/
        'desktop': (win) => {
          const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(win.navigator.userAgent);
          return !isMobile;
        }
      },
    }),
    AppRoutingModule
  ],
  ...
})
type PlatformConfig = {
  android?: ((win: Window) => boolean) | undefined;
  capacitor?: ((win: Window) => boolean) | undefined;
  cordova?: ((win: Window) => boolean) | undefined;
  desktop?: ((win: Window) => boolean) | undefined;
  electron?: ((win: Window) => boolean) | undefined;
  hybrid?: ((win: Window) => boolean) | undefined;
  ios?: ((win: Window) => boolean) | undefined;
  ipad?: ((win: Window) => boolean) | undefined;
  iphone?: ((win: Window) => boolean) | undefined;
  mobile?: ((win: Window) => boolean) | undefined;
  mobileweb?: ((win: Window) => boolean) | undefined;
  phablet?: ((win: Window) => boolean) | undefined;
  pwa?: ((win: Window) => boolean) | undefined;
  tablet?: ((win: Window) => boolean) | undefined;
};

platforms​

描述根据你使用的设备，platforms 可以返回多个值。每个可能的值都是平台的层次结构。例如，在 iPhone 上，它将返回 mobile、ios 和 iphone。
签名platforms() => string[]

ready​

描述当平台准备好并且可以调用原生功能时返回 promise。如果应用在 Web 浏览器中运行，则 Promise 将在 DOM 准备就绪时解析。当应用从 Cordova 等应用引擎运行时，promise 将在 Cordova 触发 deviceready 事件时解析。解析的值是 readySource，它表明所使用的平台。

例如，当 Cordova 就绪时，解析的就绪源为 cordova。默认就绪源值为 dom。如果应根据应用运行的平台运行不同的逻辑，则 readySource 非常有用。例如，只有 Capacitor 和 Cordova 可以执行状态栏插件，因此 Web 不应该运行状态栏插件逻辑。
签名ready() => Promise<string>

isRTL​

描述返回此应用是否使用从右到左的语言方向。我们建议应用的 index.html 文件已设置正确的 dir 属性值，例如 <html dir="ltr"> 或 <html dir="rtl">。W3C:HTML 中的结构标记和从右到左的文本
签名isRTL() => boolean

isLandscape​

描述如果应用处于横向模式，则返回 true。
签名isLandscape() => boolean

isPortrait​

描述如果应用处于纵向模式，则返回 true。
签名isPortrait() => boolean

width​

描述使用 window.innerWidth 获取平台视口的宽度。
签名width() => number

height​

描述使用 window.innerHeight 获取平台视口的高度。
签名height() => number

url​

描述获取当前网址。
签名url() => string

testUserAgent​

描述如果表达式包含在用户代理字符串中，则返回 true。
签名testUserAgent(expression: string) => boolean

参数​

¥Parameters

名称类型描述
expressionstring要在用户代理中检查的字符串

事件​

¥Events

pause​

当原生平台将应用置于后台时（通常是当用户切换到不同的应用时），会发出 pause 事件。当 Cordova/Capacitor 应用置于后台但不会在标准 Web 浏览器中触发时，会发出此事件。

¥The pause event emits when the native platform puts the application into the background, typically when the user switches to a different application. This event emits when a Cordova/Capacitor app is put into the background but doesn't fire in a standard web browser.

示例​

¥Examples

this.platform.pause.subscribe(async () => {
  alert('Pause event detected');
});

resize​

当浏览器窗口尺寸发生变化时，会触发 resize 事件。这可能是由于浏览器窗口的物理尺寸调整或设备方向的改变所致。

¥The resize event emits when the browser window has changed dimensions. This could be from a browser window being physically resized, or from a device changing orientation.

示例​

¥Examples

this.platform.resize.subscribe(async () => {
  alert('Resize event detected');
});

resume​

当原生平台将应用从后台拉出时，会触发 resume 事件。当 Cordova/Capacitor 应用从后台运行但在标准 Web 浏览器中不触发时，会发出此事件。

¥The resume event fires when the native platform pulls the application out from the background. This event emits when a Cordova/Capacitor app comes out from the background but doesn't fire in a standard web browser.

示例​

¥Examples

this.platform.resume.subscribe(async () => {
  alert('Resume event detected');
});

目录