You are reading docs for v2, click here for the latest version.
- elements:utilities
- introduction
- getting-started
- routing
- utilities
- elements:layouts
- elements:action-bar
- elements:components
- elements:dialogs
Image
This is an overview of the most common usage of Image. For more information about the available properties, methods, or events, head over to the complete API documentation for Image.
<Image>はImageSourceかURLからの画像を表示するUIコンポーネントです。
appディレクトリの相対パスで画像を表示する
<Image src="~/logo.png" stretch="none" />URLで画像を表示する
<Image src="https://art.nativescript-vue.org/NativeScript-Vue-White-Green.png" stretch="none" />App_Resourcesで画像を表示する
<Image src="res://icon" stretch="none" />base64でエンコードされた画像を表示する
<Image src="data:Image/png;base64,iVBORw..." stretch="none" />
Props
| 名前 | 型 | 説明 |
|---|---|---|
src | StringかImageSource | 画像のソースをURLか画像へのパスの形式で取得・設定します。 |
imageSource | ImageSource | 画像のソースを取得・設定します。 |
tintColor | Color | (スタイルの設定)テンプレートの画像として、画像に適応させる色を設定します。 |
stretch | Stretch | (スタイルの設定)画像が余白を埋める方法を取得・設定します。 使用できる値は: none、 aspectFill、aspectFit、fillより詳しくはStretchを参照してください。 |
loadMode | ローカルファイル上の画像の読み込み方法を取得・設定します。 使用できる値: syncかasync.デフォルトの値: async.より詳しくはloadModeを参照してください。 |
Native component
| Android | iOS |
|---|---|
android.widget.ImageView | UIImageView |
Contributors
