Add image component

Author: irustm

src/app/app.component.ts

@@ -5,6 +5,7 @@ import { Component } from '@angular/core';
   template: `
     <window title="Angular app in window!">
       <view>
+        <image [src]="'C:/temp/iw.jpg'"></image>
         <text [style.font-size.px]="45">Hello, {{ name }}</text>
         <checkbox [checked]="true"></checkbox>
         <checkbox [checked]="true" [enabled]="false"></checkbox>

src/lib/components/components-map.ts

@@ -6,6 +6,7 @@ import { NgText } from './text';
 import { NgView } from './view';
 import { NgCheckbox } from './checkbox';
 import { NgDial } from './dial';
+import { NgImage } from './image';
 
 export type Constructable<T> = new () => T;
 export type NgComponentClass = Constructable<NgComponent>;
@@ -24,5 +25,6 @@ export class ComponentsMap {
     this.map.set(NgView.nodeName, NgView);
     this.map.set(NgCheckbox.nodeName, NgCheckbox);
     this.map.set(NgDial.nodeName, NgDial);
+    this.map.set(NgImage.nodeName, NgImage);
   }
 }

src/lib/components/image.ts

@@ -0,0 +1,92 @@
+import { QLabel, QPixmap, AspectRatioMode } from '@nodegui/nodegui';
+import { NgComponent } from './component';
+import { RendererStyleFlags2 } from '@angular/core';
+
+export class NgImage extends QLabel implements NgComponent {
+  public static nodeName = 'image';
+  public parent: any;
+
+  public originalPixmap?: QPixmap;
+  public aspectRatioMode?: AspectRatioMode;
+
+  public appendChild(newChild: any): void {
+    console.warn('image not supported appendChild');
+  }
+
+  public insertBefore(newChild: any, refChild: any) {}
+
+  public setNgAttribute(
+    name: string,
+    value: string,
+    namespace?: string | null
+  ): void {}
+
+  public setProperty(
+    name: string,
+    value: string | boolean | AspectRatioMode
+  ): void {
+    switch (name) {
+      case 'enabled':
+        this.setEnabled(value as boolean);
+        break;
+      case 'src':
+        if (!value) {
+          return;
+        }
+        const pixMap = new QPixmap(value as string);
+        this.setPixmap(pixMap);
+        const size = this.size();
+
+        this.scalePixmap(size.width, size.height);
+        break;
+      case 'aspectRatioMode':
+        this.setAspectRatioMode(value as AspectRatioMode);
+        break;
+
+      default:
+        break;
+    }
+  }
+
+  public setStyle(
+    style: string,
+    value: any,
+    flags?: RendererStyleFlags2
+  ): void {
+    this.setInlineStyle(`${style}:${value}`);
+  }
+
+  public setValue(value: string): void {
+    this.setText(value);
+  }
+
+  public setAspectRatioMode(mode: AspectRatioMode) {
+    this.aspectRatioMode = mode;
+  }
+
+  public scalePixmap(width: number, height: number) {
+    if (this.originalPixmap) {
+      return super.setPixmap(
+        this.originalPixmap.scaled(width, height, this.aspectRatioMode)
+      );
+    }
+  }
+
+  public setPixmap(pixmap: QPixmap) {
+    super.setPixmap(pixmap);
+    this.originalPixmap = pixmap;
+  }
+
+  removeAttribute(name: string, namespace?: string): void {
+    throw new Error('Method not implemented.');
+  }
+  removeChild(oldChild: any): void {
+    throw new Error('Method not implemented.');
+  }
+  removeClass(name: string): void {
+    throw new Error('Method not implemented.');
+  }
+  removeStyle(style: string, flags?: RendererStyleFlags2): void {
+    throw new Error('Method not implemented.');
+  }
+}