我想减小相机 API 拍摄的图像的大小,但质量降低并不好。最好的办法是降低分辨率,但我不想为所有图像使用目标宽度和高度。
例如,我希望图像宽度为 1280 并且图像高度按比例自动更改,但在 API 中我应该使用精确的宽度和高度。
如何通过图像比例更改高度动态???
现在,我使用以下代码:
this.camera.getPicture({
quality: 60,
destinationType: this.camera.DestinationType.FILE_URI,
sourceType: sourceType,
mediaType: this.camera.MediaType.PICTURE,
targetWidth: 1280,
targetHeight: 1280,
encodingType: this.camera.EncodingType.JPEG,
saveToPhotoAlbum: (source === PictureSource.CAMERA),
allowEdit: true
})
Run Code Online (Sandbox Code Playgroud) 这涉及到我刚才的问题在这里这是从来没有解决。我正在尝试通过重新安装 Ionic 来解决问题。
我首先尝试使用 卸载 Ionic sudo npm uninstall -g ionic,它完成时没有错误,但ionic -v仍然输出2.1.1,所以显然它并没有真正被卸载。之后我尝试了sudo npm install -g ionic@latest,我的问题仍然存在。
更奇怪的是当我试图从头开始创建一个新项目来测试它时发生的事情。我ionic start test --v2在我的 Ubuntu 机器上做了,并且ionic serve仍然做我在上一个问题中所说的同样的事情。
我正在尝试在 ionic 3 中的一个选项卡内创建三个选项卡,但是我无法让它工作。
这是我尝试做的一个例子,但它似乎是用早期版本的 ionic 实现的。我正在使用离子 3.10.3
来自 CLI 的 ionic -v 打印 3.10.3
以下是我的项目中的一些信息。
我有一个包含三个选项卡(主页、消息、设置)的主页,我想在消息选项卡内容中创建其他三个选项卡(全部、已读、未读)。
这是我的项目的内容
主要的
/src/pages/main/main.ts
Run Code Online (Sandbox Code Playgroud)
/src/pages/main/main.ts
Run Code Online (Sandbox Code Playgroud)
/src/pages/main/main.html
Run Code Online (Sandbox Code Playgroud)
import { Component } from '@angular/core';
import {NavController, NavParams} from 'ionic-angular';
import { HomePage } from '../home/home';
import { SettingPage } from '../setting/setting';
import { MessagePage } from '../message/message';
@Component({
selector: 'page-main',
templateUrl: 'main.html'
})
export class MainPage {
tabHomeRoot : HomePage;
tabSettingRoot: SettingPage;
tabMessageRoot: MessagePage;
constructor(){
}
}Run Code Online (Sandbox Code Playgroud)
其他标签的内容是基本的,所以我只放消息标签的内容
信息
/src/pages/message/message.ts
Run Code Online (Sandbox Code Playgroud)
/src/pages/main/main.html
Run Code Online (Sandbox Code Playgroud)
/src/pages/message/message.html
Run Code Online (Sandbox Code Playgroud)
<ion-tabs>
<ion-tab [root]="tabHomeRoot" …Run Code Online (Sandbox Code Playgroud)当我在 android 上运行时发生了这个错误。
我正在使用 @ionic-native/push 从我的 nodejs 服务器接收推送通知。这是我的配置:Component.ts:
initPushNotification() {
const options: PushOptions = {
android: {},
ios: {
alert: 'true',
badge: true,
sound: 'false'
},
windows: {},
browser: {
pushServiceURL: 'http://push.api.phonegap.com/v1/push'
}
};
const pushObject: PushObject = this.push.init(options);
pushObject.subscribe('topic').then(() => {
console.log('subscribe success to topic')
}).catch((e) => {
console.log(e)
})
pushObject.on('registration').subscribe((data: any) => {
console.log('device token -> ' + data.registrationId);
//TODO - send device token to server
});
pushObject.on('notification').subscribe((notification: any) => {
console.log('Received a notification', notification)
});
pushObject.on('error').subscribe(error => …Run Code Online (Sandbox Code Playgroud) 我目前正在努力使用我们的 Ionic3 应用程序。我似乎无法找到如何使用 BT 打印机和蓝牙串行插件打印图像。打印文本就好了。
我们正在使用此文档(由我的前同事找到)驱动程序命令文档测试 RPP02N-BU 打印机 ,但我无法获得
选择位图模式
上班。
我们首先将上传的图像调整为不超过 300 像素,然后将其转换为黑白。打印时,我们迭代图像并创建二进制字符串,然后将其转换为字节。这些字节跟在 SELECT BIT IMAGE MODE 命令之后。
我们的代码(在 TypeScript 中)如下:
/**
* Image to printer command
* @param image
*/
public static getImagePrintData(image: HTMLImageElement): Buffer {
// Initialize list of commands
let command: number[] = [ 0x1b, 0x2a, 33, 255, 3 ];
// Get image bytes
let bytes = this.getImageBytes(image);
// Add bytes to command
bytes.forEach((byte) => command.push(byte));
// Return command
return new Buffer(command);
}
/** …Run Code Online (Sandbox Code Playgroud) 我正在尝试在我的应用中实现聊天。
我写了一个 autosizing ion-textarea 如下:查看
<ion-footer [keyboardAttach]="content">
<ion-toolbar class="text-input">
<ion-item no-lines>
<ion-textarea autosize
rows="1"
placeholder="Votre message..."
autocomplete="on"
autocorrect="on"
[(ngModel)]="message"
>
</ion-textarea>
<button ion-button small icon-only round item-end color="secondary" (tap)="onSend()">
<ion-icon name="send"></ion-icon>
</button>
</ion-item>
</ion-toolbar>
</ion-footer>
Run Code Online (Sandbox Code Playgroud)
CSS
ion-footer {
ion-toolbar.toolbar.toolbar-ios {
&.toolbar:last-child {
padding-bottom: 0px;
height: auto;
}
}
ion-item.item-textarea {
background-color: transparent;
}
.text-input {
height: auto;
div.input-wrapper {
background-color: #fff;
border-radius: 20px;
textarea.text-input {
margin-left: 8px;
max-height: 100px;
}
}
}
}
Run Code Online (Sandbox Code Playgroud)
指示
import {ElementRef, HostListener, Directive, OnInit, ViewChild} …Run Code Online (Sandbox Code Playgroud) 我正在使用带有延迟加载页面的 Ionic 3。尝试在页面内的组件中显示模式时,出现以下错误:
No component factory found for CourseEditorComponent. Did you add it to @NgModule.entryComponents?
Run Code Online (Sandbox Code Playgroud)
正如你可以看到下面下来,我已经添加了CourseEditorComponent作为entryComponent到courses.modules.ts,其中得到由进口dashboard.modules.ts。
我对 Angular/Ionic 中使用自定义 entryComponents 的方式有什么误解吗?
等级制度
DashboardPage
-CoursesComponent
--CourseEditorComponent
--CourseCreatorComponent
-InstructorsComponent
Run Code Online (Sandbox Code Playgroud)
模块
仪表板.module.ts
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { DashboardPage } from './dashboard';
import { CoursesModule } from "./courses/courses.module";
@NgModule({
declarations: [
DashboardPage
],
imports: [
IonicPageModule.forChild(DashboardPage),
CoursesModule
],
})
export class DashboardPageModule {}
Run Code Online (Sandbox Code Playgroud)
course.module.ts
import { NgModule } from '@angular/core';
import …Run Code Online (Sandbox Code Playgroud) 我有以下 html
<ion-item>
<ion-range min="5" max="300" pin="true" [(ngModel)]="contrast" color="secondary" ionChange=“changeRange(contrast)”>
<ion-icon range-left small name="contrast"></ion-icon>
<ion-icon range-right name="contrast"></ion-icon>
</ion-range>
</ion-item>
Run Code Online (Sandbox Code Playgroud)
结果是:
这是触发方法:
changeRange(valor){
console.log(valor.value);
}
Run Code Online (Sandbox Code Playgroud)
如您所见,我使用 ionChange 来执行 changeRange 方法。但是当我运行它时,我收到以下错误。
我究竟做错了什么?
我是离子的新手。我发现在一些离子项目中,没有 src(app & pages) 文件夹,只有 www 文件夹。在检查了一些示例 ionic 项目后,src 文件夹似乎包含与 www 文件夹类似的组件。
请您解释一下这些文件夹之间的区别,它们可以一起使用吗?如果有关于离子框架架构的详细介绍,将不胜感激。
我想在 ionic 2/3 中禁用 ion-searchbar 以便只显示搜索栏但我们不能输入任何内容。我添加了,"disabled = true"但这不起作用。
你能提出一些建议吗?