@adsfelipe wrote:
How to get the Primary color in variables.css from code?
this one: --ion-color-primary: #008c8c;
i want to get this on typescript…
Thanksss
Posts: 1
Participants: 1
↧
Get primary color from code
↧
Custom UI on notification bar
@ionicfan2019 wrote:
Hi all,
I’m using Ionic 4 to write an app which has a media player which plays a media file in the background.
I would like to have a mini player on Notification Bar like the picture below so that the user can pause or stop playing without going back to the app.
I’ve found some tutorials with Android Studio and Java/Kotlin but found nothing helpful with Ionic.
I would like to ask if we can create a custom notification UI like that with Ionic? If yes, can you please send me a link so that I can read and learn myself.
Thank you in advance.
Posts: 1
Participants: 1
↧
↧
Create an Image from URL - Social Sharing
@noonestopsme wrote:
Hello All,
I am trying to implement social sharing for my app. I am using amazon to get images with 20 seconds expiration time. The problem is, when I share the link, the link expires soon. I am trying to create an image on the fly when the image is first loaded. All I have is image url. How can I convert it to Base64? Is there any way of doing that? Because, whenever I try to get the same URL using HttpClient get method, unknown error returns from the remote-end. Your advices would be appreciated.
Thanks in advance.
Posts: 1
Participants: 1
↧
Customize Ionic 4 toast css [position, text-position]
@joabchua wrote:
Hi All,
I am using ionic 4. My application has tabs at the bottom. I am using toast at the bottom of my page whenever an operation is completed. I would like to find out how I can shift the toast slightly higher so that my tabs component will not be partially covered by the toast at the bottom when an operation is completed.Current limitation now:
Hope to achieve this.
Please advise and also if there is any option to center the text msg in the toast would be perfect. Thank you.
Posts: 1
Participants: 1
↧
How to dismiss multiple modals in ionic v4?
@mehthaf wrote:
here currently im using ionic v4 . i need to close all opened modals in app .i use modalcontroller to dismiss the current modal. but i can’t hide the another modals. anyone tell me how to hide all modals in app
Posts: 1
Participants: 1
↧
↧
Trouble navigating Tab child pages with Angular Router in Ionic 4
@SteynMarnus wrote:
I am using a tabbed screen layout where the tab module has its own routes to host the tab pages and their children pages too. Here is the routes object (i.e in the tabs.router.module.ts) :
const routes: Routes = [ { path: 'tabs', component: TabsPage, children: [ { path: 'home', children: [ { path: '', loadChildren: '../pages/home/home.module#HomePageModule' } ] }, { path: 'deliverablesIndex', children: [ { path: '', loadChildren: '../pages/deliverables-index/deliverables-index.module#DeliverablesIndexPageModule' }, { path: 'create', children: [ { path: '', loadChildren: '../pages/deliverable-create/deliverable-create.module#DeliverableCreatePageModule' } ] } ] }, { ...some more tabs }, { path: '', redirectTo: 'tabs/home', pathMatch: 'full' } ] }, { path: '', redirectTo: 'tabs/home', pathMatch: 'full' } ];This works great for navigating between the tabs, however when I try to navigate one page deeper in the
deliverablesIndexto thecreatesub route, I get this error:Cannot match any routes. URL Segment: '/tabs/deliverablesIndex/create'I am using this to navigate upon a button click:
this.router.navigate(['/tabs/deliverablesIndex/create/']);I’ve tried
'/tabs/deliverablesIndex/create/'and'tabs/deliverablesIndex/create/'to no avail.It works however when I type the URL myself in the browser:
http://localhost:8100/core/tabs/deliverablesIndex/create.What am I missing here?
Posts: 1
Participants: 1
↧
Ionic Appflow (Live hot code updates)
@flpcorrea wrote:
Hi,
Live hot code updates
Deliver live app updates, content changes, A/B tests, bug fixes, and more—before or after your app is in the store. No lines, no waiting, no slowdowns.
I would like to understand better about Live hot code updates. Let me show you an example to get you to ask the question.
I developed an application and published it in the App Store, but a few days later I had to fix a bug. Before my update gets to the user I need to wait for the App Store to approve my change.
My question. Using Ionic Appflow through Live hot code updates would it be possible to update the application to reach the end user even before the approval made by the App Store?
Posts: 1
Participants: 1
↧
Undefined symbols for architecture x86_64
@cdwebinfo wrote:
Undefined symbols for architecture x86_64:
"OBJC_CLASS$_SKStoreProductViewController", referenced from:
objc-class-ref in CDVAppRate.o
"_SKStoreProductParameterITunesItemIdentifier", referenced from:
___29-[CDVAppRate launchAppStore:]_block_invoke in CDVAppRate.o
ld: symbol(s) not found for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)
Check solution on this url - https://allexperts16.blogspot.com/2019/03/undefined-symbols-for-architecture-x8664.html
Posts: 1
Participants: 1
↧
Ionic 4 - How change dir for multi language app
@ebeliejinfren wrote:
Hi
how can change dir of app in multi language app. change rtl and tlr
in ionic 3 it’s possible by multi language app Platform setDir but i don’t know in ionic v4Thanks
Posts: 1
Participants: 1
↧
↧
Tabs is covering footer on all pages
@lunneyd wrote:
I am using tabs and anytime I use footer in html part of code, the footer does not show or any content in the footer. I think the tabs is covering it. Any ideas on how to fix it.
<ion-footer> <ion-toolbar> <ion-input type="text" name="message" placeholder="Message" [(ngModel)]="message"></ion-input> <ion-buttons end> <button ion-button icon-right color="royal" (click)="sendMessage()"> <ion-icon name="md-send"></ion-icon> </button> </ion-buttons> </ion-toolbar> </ion-footer>
Posts: 1
Participants: 1
↧
Ionic4 image caching
@codiqa100047031 wrote:
Hi
I’m looking for a way to cache imagesI have an ionic 4 hybrid app that shows many images
can somebody recommend me a plugin ?
Posts: 1
Participants: 1
↧
Background depends on the colors I use in Ionic 4
@brianmackey wrote:
ion-menu has various CSS custom properties.. One of which is --background.
Please tell me how I can set the --background CSS property. Is this set in an HTML attribute? In SCSS? Either way? Other people have reported a similar problem.
Given in variables.scss I have:
:root { /* Set the background of the entire app */ --ion-background-color: #ffffff;I tried:
<ion-menu class="myMenu" contentId="menu-content"> .myMenu { --background: red; }And the background stays at whatever I set for
--ion-background-colorEven more strange. This works (gives me a --ion-color-primary):
:host { ion-content{ --background: #orange; } .myMenu { --background: var(--ion-color-primary); --height: 100em; --width: 100em; } }And again. If I only change the color of ion-content (gives me --ion-background-color):
:host { ion-content{ --background: #ffffff; } .myMenu { --background: var(--ion-color-primary); --height: 100em; --width: 100em; } }This gives me --ion-background-color:
:host { ion-content{ --background: var(--ion-background-color); } .myMenu { --background: var(--ion-color-primary); --height: 100em; --width: 100em; } }And this also gives me --ion-background-color:
:host { --background: orange; .myMenu { --background: var(--ion-color-primary); --height: 100em; --width: 100em; } }
Posts: 1
Participants: 1
↧
Show content in a tab
@Asgeirr wrote:
Hi i’m new on ionic and i have problem that i would like to know the solution, basically i need take data for a new person to add to an array, the show the info, erase a user or add a new user.
I create the proyect using ionic start name --type=ionic-angular, then i made the user class, next i made a import into the tab one (add user), then import of tab one into tab two and extends (herency), then import of tab two into tab three and extends.
Looks like whe i click the button that calls fuction to add(tab1) o erase users(tab3) works, but y can’t figure it out how to show the info of the users(tab2) i tried with the print on console and ngFor and dosen’t shows nothing.
I thanks any help.
Posts: 1
Participants: 1
↧
↧
Highlight an ion-input in a ion-item using box-shadow on focus - v4
@javasol wrote:
Hi,
I’m trying to highlight input fields when the user focuses on them to highlight the current field. I’ve tried multiple suggestions by modifying the .scss file, it seems like everything in that file is ignored. I do have a workaround using javascript but I don’t like it. Can someone point out a straightforward way to implement this?
Here is what I’m using, this is for ion-textarea but same idea for ion-input. This works but I would rather just modify the .scss of this component instead of using javascript :
<ion-item id="progressItem"> <ion-label position="stacked">Progress:</ion-label> <ion-textarea rows=3 [(ngModel)]="progress" name="progress" autocomplete="on" spellcheck="true" autocorrect="on" disabled={{readonly}} [attr.maxlength]="450" id="progressId" (ionFocus)="inputHasFocus('#progressItem', '.item-inner')" (ionBlur)="inputLostFocus('#progressItem', '.item-inner')"></ion-textarea> </ion-item>and then in the .ts file:
highlightCss = ' border: 1px solid #7bc1f7; '+ ' box-shadow: 5px 5px 10px 5px #7bc1f7; '+ ' -moz-box-shadow: 5px 5px 10px 5px #7bc1f7; '+ ' -webkit-box-shadow: 5px 5px 10px 5px #7bc1f7; padding-left:5px;'; inputHasFocus(inputId, inputType){ document.querySelector(inputId).shadowRoot.querySelector(inputType).setAttribute('style', this.highlightCss); } noLightCss = 'border: none; box-shadow: 0px; -moz-box-shadow: 0px; -webkit-box-shadow: 0px; padding-left:5px;'; inputLostFocus(inputId, inputType){ document.querySelector(inputId).shadowRoot.querySelector(inputType).setAttribute('style', this.noLightCss); }
Posts: 1
Participants: 1
↧
Ipad 9.3.5
@dpark1985 wrote:
I am trying to build app to iPad 9.3.5 but Xcode throws this error
**-[WKWebViewConfiguration setMediaTypesRequiringUserActionForPlayback:]: unrecognized selector sent to instance 0x14d4a1a0** **2019-03-11 10:43:30.864 MeZooBLE[505:73527] *** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '-[WKWebViewConfiguration setMediaTypesRequiringUserActionForPlayback:]: unrecognized selector sent to instance 0x14d4a1a0'** ***** First throw call stack:** **(0x225cf91b 0x21d6ae17 0x225d52b5 0x225d2ee1 0x224fe238 0x8c56d 0x8cd4f 0x9b421 0x9ab33 0x9afd1 0x98671 0x79bff 0x26b4ad8b 0x26b4a971 0x26b51639 0x26b4eb3d 0x26bc3a5d 0x9cccd 0x799d5 0x26bbf785 0x26de72d1 0x26deb285 0x26dff83d 0x26de87b3 0x23c72c07 0x23c72ab9 0x23c72db9 0x22591dff 0x225919ed 0x2258fd5b 0x224df229 0x224df015 0x26bb8c3d 0x26bb3189 0x798d3 0x22187873)**Ionic Info
Ionic:ionic (Ionic CLI) : 4.11.0 (/usr/local/lib/node_modules/ionic) Ionic Framework : @ionic/angular 4.1.1 @angular-devkit/build-angular : 0.13.5 @angular-devkit/schematics : 7.2.4 @angular/cli : 7.3.5 @ionic/angular-toolkit : 1.4.0 Cordova: cordova (Cordova CLI) : 8.0.0 Cordova Platforms : ios 4.5.5 Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 6 other plugins) System: ios-deploy : 2.0.0 NodeJS : v10.15.0 (/usr/local/bin/node) npm : 6.7.0 OS : macOS Mojave Xcode : Xcode 10.1 Build version 10B61This app works find in iPhoneX (12.1.4). I think the problem is the app version below 10.
I only added BLE native plugin.Please help me.
Thank you
Posts: 1
Participants: 1
↧
V4-migration-tslint warns about tabs in brand new project
@royappa wrote:
I am migrating my v3 project by using the recommended method of installing v4 (also updated Node & npm), starting a brand new project and then copying items little by little into the new project. When using the tslint, it helpfully shows what to fix in the first old page that I copied. However, it also complains:
WARNING: (…)/src/app/tabs/tabs.page.html:1:2 - Tabs have gone through a significant refactor.
Please see https://github.com/ionic-team/ionic/blob/master/CHANGELOG.md#angular-tabsBut I started this v4 project using “ionic start myApp tabs” so the tabs were created by the CLI, I haven’t touched tab files it created. So is the CLI still generating old tab code? Thanks.
Posts: 1
Participants: 1
↧
Which all folders need to be committed in the git?
@akashpjames wrote:
When we create an Ionic app, so many folders are created. But which all folders are mandatory to commit?
Posts: 1
Participants: 1
↧
↧
Promise in app.component constructor is not resolved before loading page
@ejerskov wrote:
Im building an app with Ionic 4. I have a Storage promise in my app.component constructor. It works fine when hard-reloading the app (in the browser), but when the app live reloads on changes, the promise in the constructor is not resolved before the “checklist” page is rendered and then it fails because the user isn’t set yet.
app.component.ts
import { Component } from '@angular/core'; import { Platform} from '@ionic/angular'; import { SplashScreen } from '@ionic-native/splash-screen/ngx'; import { StatusBar } from '@ionic-native/status-bar/ngx'; import { Router } from "@angular/router"; import { Storage } from '@ionic/storage'; import { UserService } from "./services/user.service"; @Component({ selector: 'app-root', templateUrl: 'app.component.html' }) export class AppComponent { constructor( private platform: Platform, private splashScreen: SplashScreen, private statusBar: StatusBar, private router: Router, private storage: Storage, private userService: UserService, ) { this.storage.get('user').then((user) => { if(user) { this.userService.user = user; this.router.navigateByUrl('checklist'); } else { this.router.navigateByUrl('login'); } }); this.initializeApp(); } initializeApp() { this.platform.ready().then(() => { this.statusBar.styleDefault(); this.splashScreen.hide(); }); } }checklist.page.ts
import { Component, OnInit } from '@angular/core'; import {UserService} from "../services/user.service"; import {User} from "../models/user"; @Component({ selector: 'app-checklist', templateUrl: './checklist.page.html', styleUrls: ['./checklist.page.scss'], }) export class ChecklistPage implements OnInit { user: User; constructor( private userService: UserService, ) { this.user = this.userService.user; } ngOnInit() { console.log(this.user); } }I know that I might can use the Guard-concept, but what if I also need other stuff from Storage before loading a page?
I used the same kind of approach in a ionic 3 app and that didn’t cause any issues
Posts: 1
Participants: 1
↧
Object(...) is not a function - SpinnerDialog
@fayaz-7 wrote:
On running the this.spinnerDialog.show(); this error pops
Object(…) is not a function
Posts: 1
Participants: 1
↧
Build error: Plugin with id 'com.android.library' not found
@marcofacchetti wrote:
build failed after run build command
Android Studio project detected
ANDROID_HOME=C:\Program Files (x86)\Android\android-sdk
JAVA_HOME=C:\Program Files (x86)\Java\jdk1.8.0_172
studio
Subproject Path: CordovaLib
Subproject Path: appFAILURE: Build failed with an exception.
Where:
Build file ‘D:\Source\Studio\iweather\platforms\android\CordovaLib\build.gradle’ line: 40What went wrong:
A problem occurred evaluating project ‘:CordovaLib’.Plugin with id ‘com.android.library’ not found.
Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.Get more help at https://help.gradle.org
BUILD FAILED in 2s
cmd: Command failed with exit code 1 Error output:
FAILURE: Build failed with an exception.
Where:
Build file ‘D:\Source\Studio\iweather\platforms\android\CordovaLib\build.gradle’ line: 40What went wrong:
A problem occurred evaluating project ‘:CordovaLib’.Plugin with id ‘com.android.library’ not found.
Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.Get more help at https://help.gradle.org
BUILD FAILED in 2s
Picked up _JAVA_OPTIONS: -Xmx512M
[ERROR] An error occurred while running subprocess cordova.cordova build android exited with exit code 1. Re-running this command with the --verbose flag may provide more information.I tried to remove and add android platform.
Last week the generation of the APK was correct.Marco
Posts: 1
Participants: 1
↧