image tileInset property support boolean value.

doric-demo/src/ImageDemo.ts

@@ -24,17 +24,24 @@ class ImageDemo extends Panel {
                 height: 50,
               }),
 
-                    label('Button'),
+              label("Button"),
               image({
-                        image: Environment.platform === 'Android'
+                image:
-                            ? new AndroidAssetsResource("assets/The_Parthenon_in_Athens.jpeg")
+                  Environment.platform === "Android"
-                            : new MainBundleResource("assets/The_Parthenon_in_Athens.jpeg"),
+                    ? new AndroidAssetsResource(
+                        "assets/The_Parthenon_in_Athens.jpeg"
+                      )
+                    : new MainBundleResource(
+                        "assets/The_Parthenon_in_Athens.jpeg"
+                      ),
               }),
               image({
                 image: new AssetsResource("The_Parthenon_in_Athens.jpeg"),
               }),
               image({
-                        image: new RemoteResource("https://p.upyun.com/demo/webp/webp/jpg-0.webp"),
+                image: new RemoteResource(
+                  "https://p.upyun.com/demo/webp/webp/jpg-0.webp"
+                ),
               }),
               image({
                 image: new Base64Resource(img_base64[0]),
@@ -57,7 +64,7 @@ class ImageDemo extends Panel {
                   left: 100,
                   top: 0,
                   right: 100,
-                            bottom: 0
+                  bottom: 0,
                 },
                 imageScale: 2.75,
               }),
@@ -74,40 +81,41 @@ class ImageDemo extends Panel {
                   left: 100,
                   top: 0,
                   right: 100,
-                            bottom: 0
+                  bottom: 0,
                 },
                 imageScale: 2,
-
               }),
-                    label('Gif '),
+              label("Gif "),
               image({
-                        imageUrl: "https://www.w3.org/People/mimasa/test/imgformat/img/w3c_home_animation.gif",
+                imageUrl:
+                  "https://www.w3.org/People/mimasa/test/imgformat/img/w3c_home_animation.gif",
                 scaleType: ScaleType.ScaleToFill,
                 imageScale: 3,
               }),
-                    label('APNG'),
+              label("APNG"),
               image({
-                        imageUrl: "https://upload.wikimedia.org/wikipedia/commons/1/14/Animated_PNG_example_bouncing_beach_ball.png",
+                imageUrl:
+                  "https://upload.wikimedia.org/wikipedia/commons/1/14/Animated_PNG_example_bouncing_beach_ball.png",
               }),
-                    label('Animated WebP'),
+              label("Animated WebP"),
               image({
-                        imageUrl: "https://p.upyun.com/demo/webp/webp/animated-gif-0.webp",
+                imageUrl:
-
+                  "https://p.upyun.com/demo/webp/webp/animated-gif-0.webp",
               }),
-                    label('WebP'),
+              label("WebP"),
-                    imageView = image({
+              (imageView = image({
                 imageUrl: "https://p.upyun.com/demo/webp/webp/jpg-0.webp",
                 layoutConfig: layoutConfig().just(),
                 width: 200,
                 height: 200,
                 loadCallback: (ret) => {
                   if (ret) {
-                                imageView.width = ret.width
+                    imageView.width = ret.width;
-                                imageView.height = ret.height
+                    imageView.height = ret.height;
                   }
-                        }
+                },
-                    }),
+              })),
-                    label('ScaleToFill'),
+              label("ScaleToFill"),
               image({
                 imageUrl,
                 width: 300,
@@ -119,10 +127,9 @@ class ImageDemo extends Panel {
                 },
                 scaleType: ScaleType.ScaleToFill,
                 layoutConfig: layoutConfig().just(),
-                        loadCallback: (ret) => {
+                loadCallback: (ret) => {},
-                        }
               }),
-                    label('ScaleAspectFit'),
+              label("ScaleAspectFit"),
               image({
                 imageUrl,
                 width: 300,
@@ -134,7 +141,7 @@ class ImageDemo extends Panel {
                 scaleType: ScaleType.ScaleAspectFit,
                 layoutConfig: layoutConfig().just(),
               }),
-                    label('ScaleAspectFill'),
+              label("ScaleAspectFill"),
               image({
                 imageUrl,
                 width: 300,
@@ -146,7 +153,7 @@ class ImageDemo extends Panel {
                 scaleType: ScaleType.ScaleAspectFill,
                 layoutConfig: layoutConfig().just(),
               }),
-                    label('ImageBase64'),
+              label("ImageBase64"),
               image({
                 imageBase64: img_base64[0],
                 width: 300,
@@ -158,7 +165,7 @@ class ImageDemo extends Panel {
                 scaleType: ScaleType.ScaleAspectFill,
                 layoutConfig: layoutConfig().just(),
               }),
-                    label('StretchInset1'),
+              label("StretchInset 1"),
               image({
                 imageBase64: img_base64[1],
                 height: 60,
@@ -176,11 +183,11 @@ class ImageDemo extends Panel {
                   left: 0.85,
                   top: 0,
                   right: 0.149,
-                            bottom: 0
+                  bottom: 0,
-                        }
+                },
               }),
 
-                    label('StretchInset 2'),
+              label("StretchInset 2"),
               image({
                 image: new AssetsResource("coupon_bg2.png"),
                 height: 48,
@@ -191,19 +198,19 @@ class ImageDemo extends Panel {
               image({
                 image: new AssetsResource("coupon_bg2.png"),
                 height: 48,
-                        width: 78*3,
+                width: 78 * 3,
                 scaleType: ScaleType.ScaleToFill,
-                        imageScale:1,
+                imageScale: 1,
                 layoutConfig: layoutConfig().just(),
                 stretchInset: {
                   left: 0,
                   top: 0,
                   right: 76,
-                            bottom: 0
+                  bottom: 0,
-                        }
+                },
               }),
 
-                    label('tileInset'),
+              label("tileInset 1"),
               image({
                 image: new AssetsResource("dididi.png"),
                 height: 78,
@@ -214,29 +221,52 @@ class ImageDemo extends Panel {
               }),
               image({
                 image: new AssetsResource("dididi.png"),
-                        height: 78 * 1,
+                height: 78,
                 width: 84 * 3,
-                        imageScale:1,
+                imageScale: 1,
                 backgroundColor: Color.BLACK,
                 scaleType: ScaleType.ScaleToFill,
                 layoutConfig: layoutConfig().just(),
-                        tileInset: {
+                tileInset: true,
+              }),
+
+              label("tileInset 2"),
+              image({
+                image: new AssetsResource("123.png"),
+                height: 288 / 2,
+                width: 154 / 2,
+                scaleType: ScaleType.ScaleAspectFill,
+                layoutConfig: layoutConfig().just(),
+              }),
+              image({
+                image: new AssetsResource("123.png"),
+                height: 288,
+                width: 154,
+                imageScale: 2,
+                scaleType: ScaleType.ScaleToFill,
+                layoutConfig: layoutConfig().just(),
+                tileInset:
+                  Environment.platform === "Android"
+                    ? true
+                    : {
                         left: 0,
-                            top: 0,
+                        top: 70,
                         right: 0,
-                            bottom: 0
+                        bottom: 0,
-                        }
+                      },
               }),
             ],
             {
               layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
               gravity: gravity().center(),
               space: 10,
-                }),
+            }
+          ),
           {
             layoutConfig: layoutConfig().most(),
           }
-        ).also(it => {
+        )
+          .also((it) => {
             coordinator(context).verticalScrolling({
               scrollable: it,
               scrollRange: {
@@ -248,8 +278,8 @@ class ImageDemo extends Panel {
                 name: "backgroundColor",
                 start: Color.WHITE,
                 end: Color.RED,
-                }
+              },
-            })
+            });
             coordinator(context).verticalScrolling({
               scrollable: it,
               scrollRange: {
@@ -261,9 +291,10 @@ class ImageDemo extends Panel {
                 name: "width",
                 start: 10,
                 end: 200,
-                }
+              },
+            });
           })
-        }).in(rootView)
+          .in(rootView);
     }
     onDestroy() {
         modal(context).toast('onDestroy')

doric-iOS/Pod/Classes/Shader/DoricImageNode.m

@@ -564,7 +564,18 @@ - (void)blendView:(UIImageView *)view forPropName:(NSString *)name propValue:(id
     } else if ([@"stretchInset" isEqualToString:name]) {
         self.stretchInsetDic = (NSDictionary *) prop;
     } else if ([@"tileInset" isEqualToString:name]) {
+        if ([prop isKindOfClass:[NSNumber class]]) {
+            NSInteger value = [prop intValue];
+            if (value == 1) {
+                self.tileInsetDic = @{@"left": @0, @"top": @0, @"right": @0, @"bottom": @0};
+            } else {
+                self.tileInsetDic = nil;
+            }
+        } else if ([prop isKindOfClass:[NSDictionary class]]) {
             self.tileInsetDic = (NSDictionary *) prop;
+        } else {
+            DoricLog(@"set tileInset error for View Type :%@, prop is %@", self.class, name);
+        }
     } else if ([@"imageScale" isEqualToString:name]) {
         //Do not need set
     } else if ([@"onAnimationEnd" isEqualToString:name]) {

doric-js/index.d.ts

@@ -702,12 +702,19 @@ declare module 'doric/lib/src/widget/image' {
                     right: number;
                     bottom: number;
             };
+            /**
+             * image tile
+             *
+             * If boolean value 'true' is passed, it equals { left: 0, top: 0, right: 0, bottom: 0 }
+             * Android: only support all area tile, so you'd better pass boolean value.
+             * iOS: support custom area tile, so you can pass object value and boolean value.
+             */
             tileInset?: {
                     left: number;
                     top: number;
                     right: number;
                     bottom: number;
-            };
+            } | boolean;
             /**
                 * Called if loaded image is animated and played end.
                 */

doric-js/lib/src/widget/image.d.ts

@@ -82,12 +82,19 @@ export declare class Image extends View {
         right: number;
         bottom: number;
     };
+    /**
+    * image tile
+    *
+    * If boolean value 'true' is passed, it equals { left: 0, top: 0, right: 0, bottom: 0 }
+    * Android: only support all area tile, so you'd better pass boolean value.
+    * iOS: support custom area tile, so you can pass object value and boolean value.
+    */
     tileInset?: {
         left: number;
         top: number;
         right: number;
         bottom: number;
-    };
+    } | boolean;
     /**
      * Called if loaded image is animated and played end.
      */

doric-js/src/widget/image.ts

@@ -120,13 +120,20 @@ export class Image extends View {
         bottom: number
     }
 
+     /**
+     * image tile
+     * 
+     * If boolean value 'true' is passed, it equals { left: 0, top: 0, right: 0, bottom: 0 }
+     * Android: only support all area tile, so you'd better pass boolean value.
+     * iOS: support custom area tile, so you can pass object value and boolean value.
+     */
     @Property
     tileInset?: {
         left: number,
         top: number,
         right: number,
         bottom: number
-    }
+    } | boolean
 
     /**
      * Called if loaded image is animated and played end.