import { Component, Inject, forwardRef } from ‘@angular/core‘;
import { IonicPage, NavController, NavParams } from ‘ionic-angular‘;
import { Screenshot } from ‘@ionic-native/screenshot‘;
import { GlobalFunction } from‘../../services/GlobalFuntion‘;
import { StorageService } from‘../../services/StorageService‘;
import { Global } from ‘../../services/Global‘;
/**
* Generated class for the SharingPage page.
*
* See http://ionicframework.com/docs/components/#navigation for more info
* on Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: ‘page-sharing‘,
templateUrl: ‘sharing.html‘,
})
export class SharingPage {
public ssssss;
constructor(public navCtrl: NavController,
public navParams: NavParams,
public screenshot: Screenshot,
@Inject (forwardRef (() => GlobalFunction)) private globalFunction: GlobalFunction,
@Inject (forwardRef (() => StorageService)) private storageService: StorageService) {
}
ionViewDidLoad() {
console.log(‘ionViewDidLoad SharingPage‘);
setTimeout(this.attendanceClick(),5000);
}
//测试绘图
attendanceClick() {
let base64Image = ‘assets/images/sharing.png‘;
//加水印
var canvas = document.createElement(‘canvas‘);
var cxt = canvas.getContext(‘2d‘);
cxt.fillStyle = ‘green‘;
cxt.fillRect(10, 10, 100, 100);
var img = new Image();
img.src = base64Image;
img.onload = () => {
var date: string = new Date().toLocaleDateString();
var datetime: string = date;//添加日期
canvas.height = img.height;
canvas.width = img.width;
cxt.drawImage(img,0,0,img.width,img.height,0,0,img.width,img.height);
cxt.save();
cxt.font = 20 + "px Arial";
cxt.textBaseline = ‘middle‘;//更改字号后，必须重置对齐方式，否则居中麻烦。设置文本的垂直对齐方式
cxt.textAlign = ‘center‘;
let ftop = 715;
let fleft = 630;
cxt.fillStyle="#000";
cxt.fillText(datetime,fleft,ftop);//文本元素在画布居中方式
let tempImage = new Image();
let tempImageSrc = this.storageService.getValue(Global.HEAD_IMG_URL);
tempImage.src = ‘assets/images/sharing.png‘;//头像
tempImage.onload = () => {
let tempImageX = 180;
let tempImageY = 310;
let tempImageW = 140;
let tempImageH = 140;
cxt.drawImage(tempImage,tempImageX,tempImageY,tempImageW,tempImageH);
let tempTextData = ‘李二狗‘;
cxt.save();
cxt.font = 40 + "px Arial";
cxt.textBaseline = ‘middle‘;
cxt.textAlign = ‘left‘;
let tempNameX = 360;
let tempNameY = 350;
cxt.fillStyle="#000";
cxt.fillText(tempTextData,tempNameX,tempNameY);
let tempCompanyData = ‘平安人寿‘;
cxt.save();
cxt.font = 40 + "px Arial";
cxt.textBaseline = ‘middle‘;
cxt.textAlign = ‘left‘;
let tempCompanyX = 360;
let tempCompanyY = 420;
cxt.fillText(tempCompanyData,tempCompanyX,tempCompanyY);
this.ssssss= canvas.toDataURL("image/jpg");
console.log(this.ssssss);
}
}
}
//测试截图
public testScreenshots() {
this.screenshot.save(‘jpg‘, 20, ‘myscreenshot.jpg‘).then((res)=>{
this.globalFunction.showAlert(‘save成功‘+res.filePath);
},(err)=>{
this.globalFunction.showAlert(‘save失败‘+err);
});
}
}
