Backgrounds android

CrossPlatformModules.csproj

@@ -647,6 +647,7 @@
     <Content Include="apps\template-settings\app.css" />
     <Content Include="apps\tests\app\location-example.xml" />
     <TypeScriptCompile Include="apps\tests\pages\fonts-test.ts" />
+    <TypeScriptCompile Include="apps\tests\pages\background-test.ts" />
     <Content Include="apps\tests\pages\page-load-performance\start.xml">
       <SubType>Designer</SubType>
     </Content>
@@ -1649,7 +1650,7 @@
           <SaveServerSettingsInUserFile>False</SaveServerSettingsInUserFile>
         </WebProjectProperties>
       </FlavorProperties>
-      <UserProperties ui_2layouts_2wrap-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2grid-layout_2package_1json__JSONSchema="" ui_2layouts_2dock-layout_2package_1json__JSONSchema="" ui_2layouts_2absolute-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2linear-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2web-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2content-view_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2gallery-app_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2absolute-layout-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2editable-text-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2scroll-view_2package_1json__JSONSchema="http://json.schemastore.org/package" />
+      <UserProperties ui_2scroll-view_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2editable-text-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2absolute-layout-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2gallery-app_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2content-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2web-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2linear-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2absolute-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2dock-layout_2package_1json__JSONSchema="" ui_2layouts_2grid-layout_2package_1json__JSONSchema="" ui_2layouts_2wrap-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" />
     </VisualStudio>
   </ProjectExtensions>
 </Project>

apps/tests/pages/background-test.ts

@@ -0,0 +1,8 @@
+import observable = require("data/observable");
+import pages = require("ui/page");
+
+// Event handler for Page "loaded" event attached in main-page.xml
+export function pageLoaded(args: observable.EventData) {
+    // Get the event sender
+    var page = <pages.Page>args.object;
+}

apps/tests/pages/background-test.xml

@@ -1,5 +1,5 @@
 <Page>
-  <GridLayout style="background-image: url('~/pages/test.png')">
+  <GridLayout style="background-image: url('~/pages/test2.png'); border-color: green; border-radius: 20; border-width: 4;">
-    <Button text="just a button" />
+    <Button text="just a button" horizontalAlignment="center" verticalAlignment="center"/>
   </GridLayout>
 </Page>

ui/styling/stylers.android.ts

@@ -87,18 +87,56 @@ class BorderGradientDrawable extends android.graphics.drawable.GradientDrawable
 
     public draw(canvas: android.graphics.Canvas): void {
         super.draw(canvas);
+        console.log("BorderGradientDrawable.draw()"); 
 
         if (this.bitmap) {
             var radius = this._cornerRadius * this._density;
             var stroke = this._borderWidth * this._density;
-
             var bounds = this.getBounds();
-
             var path = new android.graphics.Path();
-            path.addRoundRect(new android.graphics.RectF(stroke, stroke, bounds.right - stroke, bounds.bottom - stroke), radius, radius, android.graphics.Path.Direction.CW)
+
+            path.addRoundRect(new android.graphics.RectF(stroke, stroke, bounds.right - stroke, bounds.bottom - stroke), radius, radius, android.graphics.Path.Direction.CW);
             canvas.clipPath(path);
 
-            canvas.drawBitmap(this.bitmap, stroke, stroke, undefined);
+            if (this.bitmap) {
+                var repeatX = true;
+                var repeatY = true;
+                var posX = 15;
+                var posY = 35;
+                var sizeX = 100;
+                var sizeY = 150;
+
+                var matrix = new android.graphics.Matrix();
+                if (sizeX > 0 && sizeY > 0) {
+                    var scaleX = sizeX / this.bitmap.getWidth();
+                    var scaleY = sizeY / this.bitmap.getHeight();
+                    matrix.setScale(scaleX, scaleY, 0, 0);
+                }
+                else {
+                    sizeX = this.bitmap.getWidth();
+                    sizeY = this.bitmap.getHeight();
+                }
+                matrix.postTranslate(posX, posY);
+
+
+                if (!repeatX && !repeatY) {
+                    canvas.drawBitmap(this.bitmap, matrix, undefined);
+                }
+                else {
+                    var shader = new android.graphics.BitmapShader(this.bitmap, android.graphics.Shader.TileMode.REPEAT, android.graphics.Shader.TileMode.REPEAT);
+                    shader.setLocalMatrix(matrix);
+                    var paint = new android.graphics.Paint();
+                    paint.setShader(shader);
+
+                    var w = repeatX ? bounds.width() : sizeX;
+                    var h = repeatY ? bounds.height() : sizeY;
+
+                    posX = repeatX ? 0 : posX;
+                    posY = repeatY ? 0 : posY;
+
+                    canvas.drawRect(posX, posY, posX + w, posY + h, paint);
+                }
+            }
         }
     }
 }