Hi, what should I use to communicate mobile devices with a web server? I tried Apollo but it does not work for me and there is no support… What is the best approach if this is my first ionic project?
1 post - 1 participant
↧
The best client - server in 2020
↧
Ionic vue - Any sample code to use Ionic Segment with Ionic Slides
Hi Team,
I am trying ionic with vue/nuxt.
I am looking for a simple guidance or sample code for using scrollable ion-segment with ion-slides.
Plan is to show the products based on category. Categories will be put as segment and slides will have relevant products for that category.
Any guidance will be much appreciated.
I have observed similar example only in ionic angular.
1 post - 1 participant
↧
↧
Capacitor File System plugin
Hi,
We have been using Ionic 5 with angular 10, capacitor. A part of our project is to allow users to upload and download files from a blob server like azure. We achieved uploading by using xmlhttprequest. It went fine.
When it comes to downloading, we tried using file plugin by cordova. It didn’t worked as well as its out of question to use cordova when i have capacitor. So, we switched to file system plugin. We tried with the sample code you have in the github and it seems to not work. Also our file comes as ablob. where as filesystem plugin doesn’t accept blob.
We tried to resolve the issue but so far not able to find a solution.
Can you provide us right information or path to take to achieve this?
1 post - 1 participant
↧
Ionic downloading files
Hi, I’m using firebase for data and file storage. I was wondering if larger files have issues for downloading on to the iOS device. Is there a specific setting in config.xml that I need to consider? Or was something changed by apple on iOS, like restrictions and guidelines for development? This behaviour is inconsistent from device to device. (edited)
1 post - 1 participant
↧
Realtime Navigation with Ionic 🚴
Has anyone done any real-time navigation with an Ionic app way finding between points?
I am looking at doing some off road navigation for mountain bikes.
I will need some offline capability.
Keen to hear peoples experiences.
Thanks!
1 post - 1 participant
↧
↧
Can i use live reload in prodution?
Can I use the Capacitor live reload feature in production to redirect to one site that runs everywhere?
"server": {
"url": "https://example.com",
"allowNavigation": [
"https://example.com"
]
},
1 post - 1 participant
↧
Ionic-v5 Master detail view with side menu
I need to implement UI on desktop as same as the gmail with reading pane. i.e. master-detail view with side menu.
Thanks in advance.
1 post - 1 participant
↧
IonBackButton not shown with history.replace
Hey there!
I wrote a pretty standard CRUD application so far using Ionic v5 / react.
In this app amongst other things I am using the following page navigation:
List Page > Detail Page > Detail Edit Page
Because I want to replace the Detail Page page with the Detail Edit Page page in the navigation history when clicking the edit button I am using
history.replace('/route/to/detail-edit')
So far so good.
My problem here is the automatic IonBackButton behavior.
Navigating List Page > Detail Page shows the IonBackButton correctly. But when the Detail Edit Page is shown (by history.replace) the replace button does not appear. The browser back button in turn leads me to the List Page as desired.
I would like to show the IonBackButton on the Edit Page targeting the List Page.
Any suggestions? Thank you very much!
1 post - 1 participant
↧
Add Component with Ionic-v5
I want to create my own tag. and i get this error
‘app-temp’ is not a known element:
1. If ‘app-temp’ is an Angular component, then verify that it is part of this module.
2. If ‘app-temp’ is a Web Component then add ‘CUSTOM_ELEMENTS_SCHEMA’ to the ‘@NgModule.schemas’ of this component to suppress this message.
1-) Created Component with ionic generate component components/temp
2-) added in app.module.ts
@NgModule({
declarations: [AppComponent, TempComponent],
*
*
3-) used <app-temp></app-temp> o any page in app
Could you help me with this solution ??
‘app-temp’ is not a known element:
1. If ‘app-temp’ is an Angular component, then verify that it is part of this module.
2. If ‘app-temp’ is a Web Component then add ‘CUSTOM_ELEMENTS_SCHEMA’ to the ‘@NgModule.schemas’ of this component to suppress this message.
1 post - 1 participant
↧
↧
Ionic 4 Split-pane sidemenu disappears after navigation click
I want to outsource my navigation in a layout component.
I have done all that so far. For testing I created two pages, Home and Contact.
When I load the application, everything is displayed correctly. If I now click on the navigation point Contact, the page changes as expected. If I click on the Home menu item again, the page changes, but the navigation on the left side disappears forever.
I hope you can help me
Here the structure of the different files. I also attach a picture of the folder structure
app-routing.module.ts
import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
import {MainLayoutWithSideNavComponent} from './layout/main-layout-with-side-nav/main-layout-with-side-nav.component';
const routes: Routes = [
{
path: '',
redirectTo: 'home',
pathMatch: 'full',
canActivate: [],
},
{
path: 'home',
component: MainLayoutWithSideNavComponent,
canActivate: [],
loadChildren: () => import('./pages/home/home.module').then(m => m.HomePageModule)
},
{
path: 'contact',
component: MainLayoutWithSideNavComponent,
canActivate: [],
loadChildren: () => import('./pages/contact/contact.module').then(m => m.ContactPageModule)
}
];
@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule {}
main-layout-with-side-nav.component.html
<ion-split-pane contentId="main-content">
<ion-menu content-id="main-content">
<ion-header>
<ion-toolbar color="primary">
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-list-header>
Navigate
</ion-list-header>
<ion-menu-toggle auto-hide="false">
<ion-item *ngFor="let nav of navi" button [routerLink]="'/'+ nav.link">
<ion-icon slot="start"></ion-icon>
<ion-label>
{{nav.linkName}}
</ion-label>
</ion-item>
</ion-menu-toggle>
</ion-list>
</ion-content>
</ion-menu>
<div class="ion-page" id="main-content">
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-menu-toggle>
<ion-button>
<ion-icon slot="icon-only" name="menu"></ion-icon>
</ion-button>
</ion-menu-toggle>
</ion-buttons>
<!-- <ion-title>Header</ion-title>-->
</ion-toolbar>
</ion-header>
<ion-content class="ion-padding">
<ion-router-outlet></ion-router-outlet>
</ion-content>
</div>
</ion-split-pane>
app.component.html
<ion-app>
<ion-router-outlet animated="false"></ion-router-outlet>
</ion-app>
1 post - 1 participant
↧
Window.print()
Hello,
In ionic 4
browser
window.print ()
Does not print 3 pages generated from ,
shows and prints only the first.
Any information on this?
thankful
1 post - 1 participant
↧
ERROR Error: Uncaught (in promise): overlay does not exist at resolvePromise
I’ve managed to work through my code and eliminate all errors, except one. This error keep coming up and is slowing my app load down, but i can’t find where the problem is.
All the other errors have listed a ts file or shown where the error is. This seems to be related to modals, but i don’t know where to start looking.
any help would be appreciated before i lose the rest of my hair!
1 post - 1 participant
↧
iOS 12 Http Failure response for url : 0 unkown error
Hello All,
I’m facing an issue with my app in iPhone devices using iOS 12.
All http calls return http failure response for (https://url…) : 0 uknown error. As I mentioned before I have this problem only in iOS 12 so the app works fine in Android and iOS 13 devices.
The backend is a Symfony REST API ( CORS enabled ).
For http calls I use Angular HttpClient.
Ionic:
Ionic CLI : 6.6.0 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 5.0.7
@angular-devkit/build-angular : 0.803.26
@angular-devkit/schematics : 8.3.26
@angular/cli : 8.3.26
@ionic/angular-toolkit : 2.2.0
Capacitor:
Capacitor CLI : 2.0.1
@capacitor/core : 2.0.1
Utility:
cordova-res (update available: 0.15.1) : 0.12.1
native-run : 1.0.0
System:
NodeJS : v12.16.1 (/usr/local/bin/node)
npm : 6.14.4
OS : macOS Catalina
1 post - 1 participant
↧
↧
File error code 5 message encoding_err photo library
Current behavior:
When I choose some photos from the gallery (example one that is in the Whatsapp folder) it is not possible to copy to another directory
Expected behavior:
file error code 5 message encoding_err
Steps to reproduce:
Choose photos from other folders in the gallery
Related code:
this.camera.getPicture(options).then((imagePath) => {
if (this.platform.is('android') && sourceType === this.camera.PictureSourceType.PHOTOLIBRARY) {
this.filePath.resolveNativePath(imagePath)
.then(filePath => {
let correctPath = filePath.substr(0, filePath.lastIndexOf('/') + 1);
let currentName = imagePath.substring(imagePath.lastIndexOf('/') + 1, imagePath.lastIndexOf('?'));
this.copyFileToLocalDir(correctPath, currentName, this.createFileName());
});
} else {
var currentName = imagePath.substr(imagePath.lastIndexOf('/') + 1);
var correctPath = imagePath.substr(0, imagePath.lastIndexOf('/') + 1);
this.copyFileToLocalDir(correctPath, currentName, this.createFileName());
}
}, (err) => {
// Handle error
});
private copyFileToLocalDir(namePath, currentName, newFileName) {
this.file.copyFile(namePath, currentName, cordova.file.dataDirectory, newFileName).then(success => {
this.nameImage = newFileName;
this.uploadImageServer()
}, error => {
console.log(error);
});
}
1 post - 1 participant
↧
My Computer Started Randomly Freezing
A quick guide to fix freezing issues with the computer
Indeed, computers are a great device, but there are times when users might face some issues with the device because of regular wear and tear. Well, there are multiple issues that a computer user can encounter, still, freezing issues are quite common. So, in case, if you are also encountering freezing issues with the device, then you can check out the solutions mentioned in this article.
Cause of freezing issues with the computer
There are multiple reasons that can lead to freezing issues with the device, but some of the common issues include the following:
- Multiple programs running in the background
- Overheating of the device
- Driver error and corruption
- A faulty external device attached to the device
- Insufficient RAM space
- Software errors
- Corrupted files installed on the device
- Virus
Further, to help out the users, here are some of the effective solutions that one can follow.
Ways to resolve freezing issues with the computer
1. Free some disk space
One of the quickest ways to resolve this issue is by freeing up some disk space and checking if the issue is resolved or not.
2. Update device drivers
For the users who have no clue regarding the process, they can follow the steps mentioned below:
- Right-click on the My Computer option and click on the manage option.
- Further, open the folder that consists of device settings and update the drivers.
3. Run system file checker
- For this process, click on the Search tab and enter cmd.
- Now, click on the command prompt and select run as administrator and opt for Yes option.
- Then, type sfc /scannow and press enter.
- The system will look for all the corrupted files and will attempt to fix it.
- After that type in exit, and click on the Enter button.
Fortunately, the user can easily fix this issue by using some basic troubleshooting solutions or by seeking assistance from Computer support experts.
1 post - 1 participant
↧
Save image/base64/canvas to gallery?
Is there any possible solution to save an image, wheter it is base64 or canvas, in the device gallery? I’m trying to use the Base64 to Gallery Plugin but it just doesn’t work. Here’s my code:
const canvas = document.querySelector('canvas') as HTMLCanvasElement;
const imageData = canvas.toDataURL('image/jpeg').toString();
this.base64ToGallery.base64ToGallery(imageData, {mediaScanner: false, prefix: '_img' }).then(() => {
this.utils.showOKAlert('Ticket saved', 'Ticket has been successfully saved to gallery');
})
It shows an error that the data is not correctly encoded. Also, if you google for saving image to devices using ionic framework you’ll have a real hard time to find any clear documentation about it. Has anyone ever needed to save images to gallery using ionic and managed to do it right?
1 post - 1 participant
↧
Get lastModifiedDate from local file
Hi all ! Could anyone suggest please, is it possible to get date when file was created ? I copy file to my phone from desktop and property lastModifiedDate returned me time when I copy file to the folder but not when file was created.
win.resolveLocalFileSystemURL(this.settingsProvider + this.settingsProvider.settings.folder + '/' + result[i].name, function(fileEntry) {
fileEntry.file(function(file) {
console.log("capture file", file.lastModifiedDate);
}, err => {
resolve(false);
});
}, err => {
resolve(false);
});
1 post - 1 participant
↧
↧
Strange behavior with ion-img, src value is missing last 2 characters!
This screenshot says it all:
I print the image source in each card to show that the url is correct.
But for some reason, the url is missing the last 2 characters. For example if it ends with .gif' it will be .g` instead!
Here is the html portion:
<div *ngFor="let item of response" routerLink="/imgur-image-details" [state]="item">
<ion-card>
<ion-img [src]="item.linkThumbnail" class="img-thumbnail" zooming="true">
</ion-img>
<ion-card-content>
<ion-card-title>
{{ item.linkThumbnail }}
</ion-card-title>
<p>{{ item.type }}</p>
</ion-card-content>
</ion-card>
</div>
Only the first 5 or 6 images get a correct url. I assumed that all images that are visible at first will get a correct src value, but the ones that I have to scroll down to will get the incorrect src value.
1 post - 1 participant
↧
Why we need to use async and await to access most of Ion Modal function?
We can use ModalController to create a modal view. However if we want to use some of the functions provided such as: onDidDismiss(), why do we have to use ‘async’ and ‘await’ on the modal?
Can someone explain about this?
2 posts - 2 participants
↧
Font sizes and item vertical distances
I find the default font sizes and vertical distances of placed elements way too large for the a phone app. Is there a way to scale all UI items down by a factor? Using Ionic5.
I would guess the default font size on a iPhone is ~10pt max while its ~12pt in the framework.
Hence I would like to apply a constant factor to all UI components that all are reusable and behave the same way as they should.
Does this make sense?
1 post - 1 participant
↧