@DavidDudson wrote:

Hi all,

Version: Ionic 4.0.0-beta.0.
Framework: Angular 6

Scanning the new docs: https://beta.ionicframework.com/docs/theming/advanced/

There is no mention of how to add a new colour, outside of “primary/secondary etc”

I would like to use custom colors in the stencil components.

For example:

<ion-icon name='menu' color='charcoal'></ion-icon>

:root {
  --ion-color-charcoal: #454545;
  --ion-color-charcoal-rgb: 69,69,69;
  --ion-color-charcoal-contrast: #FFFFFF;
  --ion-color-charcoal-contrast-rgb: 255,255,255;
  --ion-color-charcoal-shade: #3D3D3D;
  --ion-color-charcoal-tint: #4C4C4C;
}

The above does not actually work.

Looking in ionic.functions.color.scss…

@function ion-color Uses the $colors map to pull out variations, although @function current-color just uses the css variable.

Bonus question:

Is it possible to add new colours at runtime via ngStyle?

Posts: 1

Participants: 1

Read full topic

@sakthibro wrote:

Loading time take 14SEC .

I need to load fast .

Anyone got idea to improve tips !!

Posts: 1

Participants: 1

Read full topic

@alemaricame wrote:

Hola a todos!
Tengo un problema desde hace días al momento de que quiero almacenar mis coordenadas (latitud y longitud) en firebase, la aplicación me permite almacenarlos pero al momento de cerrar sesión o forzar el cierre de la app y se vuelve a iniciar sesión, los refresca como si fueran nuevos datos.
Quisiera que estos se quedaran almacenados en firebase, así inicie sesión de nuevo por cualquier motivo y a partir de los datos ya almacenados seguir agregando más.

Por parte de la app tengo este código

  //empieza geololaizacion
    start() { 
       
      
       // Compruebo si esta habilidata la opcion de localizacion
      this.backgroundGeolocation.isLocationEnabled()
      .then((activado) =>{
          //si esta activado
        if(activado){

          let config = {
            desiredAccuracy: 0,
            stationaryRadius: 0,
            distanceFilter: 0,
            debug: false,
            interval: 0
          };
          //Geolocalizacion en segundo Plano      
          this.backgroundGeolocation
          .configure(config)
          .subscribe((location) => {
            console.log("latitud actualizacion background 1 "+location.latitude);
            let  _date: Date = new Date();
            let n: number = _date.getTime();
            n -= (_date.getTimezoneOffset() * 60 * 1000);
            let d: string = new Date(n).toISOString();
            
            this.zone.run(() => {
            this.lat = location.latitude;
            this.lng = location.longitude;
            });
            this.actuario.update({
                lat: this.lat,
                lng: this.lng,
            });
               this.markes.push({
                 latitud: this.lat,
                 longitud: this.lng,
                  date: d
               });
              let markes = this.markes;
               this.actuario.set({
                   markes
                }, { merge: true })
                       .then(function() {})
                       .catch(function(error) {
                       console.log("Error al subir datos! " + error);
                 });
                
            
            });
      
          // start recording location
          this.backgroundGeolocation.start();
        //  this.backgroundMode.disableWebViewOptimizations();
          let options = {
            frequency: 300000,
            enableHighAccuracy: true,
            timeout:300000
        };
            //cuando la aplicacion esta abierta y activada
          this.watch = this.geolocation.watchPosition(options).filter((p: any) => p.code === undefined)
          .subscribe((position: Geoposition) => {
            console.log("latitud actualizacion 2 "+position.coords.latitude + "  " + position.coords.longitude);
          let  _date: Date = new Date();
            let n: number = _date.getTime();
            n -= (_date.getTimezoneOffset() * 60 * 1000);
            let d: string = new Date(n).toISOString();
            
           //actualizo dato en firebase
            this.actuario.update({
                  lat: position.coords.latitude,
                  lng: position.coords.longitude
              });
              //para poder mapear en un mapa se guardan los datos
                 this.markes.push({
                   latitud:position.coords.latitude,
                   longitud:position.coords.longitude,
                   date:d
                 });
                 let markes = this.markes;
                 this.actuario.set({markes}, { merge: true })
                         .then(function() {})
                         .catch(function(error) {
                         console.log("Error al subir datos! " + error);
                   });
          });
      
        }else {
          this.backgroundGeolocation.showLocationSettings();
        }
      }) 
    }

Posts: 1

Participants: 1

Read full topic

@vmbsaturno wrote:

I installed the latest version of ionic, cordova and android studio with APK MANAGER with API 26.
Compiled the app: First:
ionic cordova platform add android
then:
ionic cordova build android --release
and
ionic cordova build android.
It generates the apk but when I put it in the phone it says:

‘aplication error could not connect to the server. (Http: // localhost: 8080)’

Attached photo of APK installed on Android with app-debug.apk

752c1f3f-8459-4ba8-baa9-9a190fa936dd.jpg480x800 32.9 KB

with app-release-unsigned.apk not installed

API level installed

apk-manager instalados.PNG1040x720 123 KB

I did the test compiling in Windows and Debian and the same thing happens doing an example app of ionic: ionic start app1 tabs or blank this gives me an app-release-unsigned.apk file of 3.6MB and an app-debug.apk of 4.3MB . Being generally 600KB

ionic 4.0.2
cordova 8.0.0
npm 5.6.0

Posts: 1

Participants: 1

Read full topic

@Ahsan000 wrote:

HI Guyzz.
I have a problem while running my app on android…
When I enter command, ionic cordova run android
It shows me this:

BUILD FAILED in 3m 12s
(node:5216) UnhandledPromiseRejectionWarning: Error: cmd: Command failed with exit code 1 Error output:
FAILURE: Build failed with an exception.

• What went wrong:
  Execution failed for task ‘:app:transformNativeLibsWithStripDebugSymbolForDebug’.

A problem occurred starting process ‘command ‘C:\Users\Ahsan\AppData\Local\Android\Sdk\ndk-bundle\toolchains\mips64el-linux-android-4.9\prebuilt\windows-x86_64\bin\mips64el-linux-android-strip’’

• Try:
  Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.
  .
  But the IONIC LAB executes properly. Any suggestions?

Posts: 1

Participants: 1

Read full topic

@reedrichards wrote:

InifiniteScroll in v4 works fine

I have implement it following the example https://beta.ionicframework.com/docs/api/infinite-scroll

Now, I like to define a type for everything, in the documentation event hasn’t a defined type respectively

loadData(event) {
  setTimeout(function() {
    console.log('Done');
    event.target.complete();
  }, 2000);

}

I guess event is a CutomEvent

loadData(event: CutomEvent) {

which works fine to recognize target but giving a typing error (on prod build) for complete()

Property `target` doesn't exist does not exist on type `EventTarget`

Do you know which type definition I should/could use?

Posts: 1

Participants: 1

Read full topic

@Tommertom wrote:

Hi

I access the ionic 4 docs via the pwa on beta.ionicframework.com and added it on my ios homescreen (iphone 5s)

But after going offline none of the pages are accessible even though I visited then before online

I know there are pwa issues with caching on ios but is it that aggressive?

Anyone used ionic 4 docs offline before on ios?

Tom

Posts: 2

Participants: 2

Read full topic

@tiksganeshsili wrote:

StackTrace

Error: Cannot find module “.”
at webpackMissingModule (http://localhost:8100/build/vendor.js:158013:69)
at e.code (http://localhost:8100/build/vendor.js:158013:147)
at Object. (http://localhost:8100/build/vendor.js:158022:3)
at webpack_require (http://localhost:8100/build/vendor.js:55:30)
at Object.216 (http://localhost:8100/build/main.js:70:76)
at webpack_require (http://localhost:8100/build/vendor.js:55:30)
at Object.193 (http://localhost:8100/build/main.js:55:70)
at webpack_require (http://localhost:8100/build/vendor.js:55:30)
at webpackJsonpCallback (http://localhost:8100/build/vendor.js:26:23)
at http://localhost:8100/build/main.js:1:1

Ionic Info

cli packages: (/home/ganeshtikone/.npm/lib/node_modules)

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

global packages:

cordova (Cordova CLI) : 8.0.0 

local packages:

@ionic/app-scripts : 3.1.11
Cordova Platforms  : none
Ionic Framework    : ionic-angular 3.9.2

System:

Android SDK Tools : 26.1.1
Node              : v10.6.0
npm               : 6.1.0 
OS                : Linux 4.4

Environment Variables:

ANDROID_HOME : /home/ganeshtikone/Android/Sdk

Misc:

backend : pro

Posts: 1

Participants: 1

Read full topic

@pserna95 wrote:

Hey there! I’m trying to build my ionic cordova app after installing cordova-plugin-firebase and I’m having this output:

cordova build android
cordova-android-play-services-gradle-release: Android platform: cordova-android@7
cordova-android-play-services-gradle-release: No custom version found in config.xml - using plugin default
Android Studio project detected
cordova-android-play-services-gradle-release: Android platform: cordova-android@7
cordova-android-play-services-gradle-release: No custom version found in config.xml - using plugin default
Preparing Firebase on Android
ANDROID_HOME=/home/pablo/Android/Sdk
JAVA_HOME=/usr/lib/jvm/java-8-oracle
studio
Subproject Path: CordovaLib
Subproject Path: app
publishNonDefault is deprecated and has no effect anymore. All variants are now published.
+-----------------------------------------------------------------
| cordova-android-play-services-gradle-release: 15.+
+-----------------------------------------------------------------
Configuration 'compile' in project ':app' is deprecated. Use 'implementation' instead.
The Task.leftShift(Closure) method has been deprecated and is scheduled to be removed in Gradle 5.0. Please use Task.doLast(Action) instead.
        at build_8y7rsx9q1odxf29lj6l3mblph.run(/home/pablo/proyectos_ionic/SmartLogin-android/platforms/android/app/build.gradle:149)
:CordovaLib:preBuild UP-TO-DATE
:CordovaLib:preDebugBuild UP-TO-DATE
:CordovaLib:compileDebugAidl UP-TO-DATE
:CordovaLib:compileDebugRenderscript UP-TO-DATE
:CordovaLib:checkDebugManifest UP-TO-DATE
:CordovaLib:generateDebugBuildConfig UP-TO-DATE
:CordovaLib:prepareLintJar UP-TO-DATE
:CordovaLib:generateDebugResValues UP-TO-DATE
:CordovaLib:generateDebugResources UP-TO-DATE
:CordovaLib:packageDebugResources UP-TO-DATE
:CordovaLib:platformAttrExtractor UP-TO-DATE
:CordovaLib:processDebugManifest UP-TO-DATE
:CordovaLib:processDebugResources UP-TO-DATE
:CordovaLib:generateDebugSources UP-TO-DATE
:CordovaLib:javaPreCompileDebug UP-TO-DATE
:CordovaLib:compileDebugJavaWithJavac UP-TO-DATE
:CordovaLib:processDebugJavaRes NO-SOURCE
:CordovaLib:transformClassesAndResourcesWithPrepareIntermediateJarsForDebug UP-TO-DATE
:app:preBuild UP-TO-DATE
:app:preDebugBuild UP-TO-DATE
:app:compileDebugAidl UP-TO-DATE
:CordovaLib:packageDebugRenderscript NO-SOURCE
:app:compileDebugRenderscript UP-TO-DATE
:app:checkDebugManifest UP-TO-DATE
:app:generateDebugBuildConfig UP-TO-DATE
:app:prepareLintJar UP-TO-DATE
:app:generateDebugResValues UP-TO-DATE
:app:generateDebugResources UP-TO-DATE
:app:mergeDebugResources UP-TO-DATE
:app:createDebugCompatibleScreenManifests UP-TO-DATE
:app:processDebugManifest UP-TO-DATE
:app:splitsDiscoveryTaskDebug UP-TO-DATE
:app:processDebugResources UP-TO-DATE
:app:generateDebugSources UP-TO-DATE
:app:javaPreCompileDebug UP-TO-DATE
:app:compileDebugJavaWithJavac UP-TO-DATE
:app:compileDebugNdk NO-SOURCE
:app:compileDebugSources UP-TO-DATE
:CordovaLib:mergeDebugShaders UP-TO-DATE
:CordovaLib:compileDebugShaders UP-TO-DATE
:CordovaLib:generateDebugAssets UP-TO-DATE
:CordovaLib:mergeDebugAssets UP-TO-DATE
:app:mergeDebugShaders UP-TO-DATE
:app:compileDebugShaders UP-TO-DATE
:app:generateDebugAssets UP-TO-DATE
:app:mergeDebugAssets UP-TO-DATE
:app:extractTryWithResourcesSupportJarDebug UP-TO-DATE
:app:transformClassesWithStackFramesFixerForDebug UP-TO-DATE
:app:transformClassesWithDesugarForDebug UP-TO-DATE
:app:transformClassesWithDexBuilderForDebug UP-TO-DATE
:app:transformDexArchiveWithExternalLibsDexMergerForDebug FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:transformDexArchiveWithExternalLibsDexMergerForDebug'.
> java.lang.RuntimeException: java.lang.RuntimeException: com.android.builder.dexing.DexArchiveMergerException: Unable to merge dex

* 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 12s
38 actionable tasks: 1 executed, 37 up-to-date
(node:9648) UnhandledPromiseRejectionWarning: Error: /home/pablo/proyectos_ionic/SmartLogin-android/platforms/android/gradlew: Command failed with exit code 1 Error output:
FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:transformDexArchiveWithExternalLibsDexMergerForDebug'.
> java.lang.RuntimeException: java.lang.RuntimeException: com.android.builder.dexing.DexArchiveMergerException: Unable to merge dex

* 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 12s
    at ChildProcess.whenDone (/home/pablo/proyectos_ionic/SmartLogin-android/platforms/android/cordova/node_modules/cordova-common/src/superspawn.js:169:23)
    at emitTwo (events.js:126:13)
    at ChildProcess.emit (events.js:214:7)
    at maybeClose (internal/child_process.js:925:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
(node:9648) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:9648) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

This is the ionic info output:

Ionic:
                                                                                                                                                               
   ionic (Ionic CLI)  : 4.0.2 (/usr/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2                                                                                                                    
   @ionic/app-scripts : 3.1.10                                                                                                                                 
                                                                                                                                                               
Cordova:
                                                                                                                                                               
   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : android 7.0.0                                                                                                                       
                                                                                                                                                               
System:
                                                                                                                                                               
   Android SDK Tools : 26.1.1
   NodeJS            : v8.11.3 (/usr/bin/node)                                                                                                                 
   npm               : 5.6.0                                                                                                                                   
   OS                : Linux 4.15                                                                                                                              

Environment:

   ANDROID_HOME : /home/pablo/Android/Sdk

I have already tried with cordova clean and cordova build. What else can i do?

Posts: 1

Participants: 1

Read full topic

@Llarian wrote:

Hi,

how can I use the current value of the primary color in code?
Is there a way to pass it to a method from a style binding?
something like

[style.background]="calculateColor(primary)"

The above doesn’t work. How can I make it work?

Posts: 1

Participants: 1

Read full topic

@ajayrajpoot wrote:

Untitled.png1366x768 121 KB

Posts: 2

Participants: 2

Read full topic

@KavinV wrote:

How to change the modalpop 's size ,i wants modal box to be opened within the page! is there any solutions

Posts: 3

Participants: 2

Read full topic

@JEricaM wrote:

Hi
I’m using
<ion-select> component and I would like to change the icon color but I’m not able to do this. How is it possible to customize it?

This is my code

 <ion-row >
      <ion-label text-right>Scegli punti di interesse</ion-label>
        <ion-select [(ngModel)] = "sort" (ionChange)="changeImageMap()">
          <ion-option value="1">Blu e nero</ion-option>
          <ion-option value="2">Rosso</ion-option>
          <ion-option value="3">Blu</ion-option>
        </ion-select>
    </ion-row>

And this is the result.

Senza titolo 1.jpg705x101 9.27 KB

I would like to change the icon’s color like that for example:

Senza titolo 12.png705x101 4.6 KB

Is it possible?
I’ve tried to change the css of the component but nothing worked.

Thank you.

Posts: 1

Participants: 1

Read full topic

@faisal2019 wrote:

Below the error
git@git.ionicjs.com: Permission denied (publickey).

Posts: 1

Participants: 1

Read full topic

@Pancha27 wrote:

Why slides didn’t move smoothly? It’s moving like a ribbon.

Posts: 1

Participants: 1

Read full topic

@supra wrote:

Hi,
Im getting an error showing-
net::ERR_CONNECTION_REFUSED (http://localhost:8080/)

This comes after executing a simple app. Can anyone please help?

Posts: 1

Participants: 1

Read full topic

@bgies wrote:

While converting my app from Ionic 3 to Ionic 4, I have been copying the same code time after time… I’ve got many grids in app, but most of the columns in each grid are similar…

<ion-col class="quick-fact-col" col-6 col-sm-4 col-md-3 col-lg-2>

Ok, so converting to Ionic 4… that will become:

<ion-col class="quick-fact-col" size="6" size-sm="4" size-md="3" size-lg="2">

But a lot of this is just copying and pasting… for instance I have about 32 columns in that grid that are exactly the same…

So, is it possible to set a Default… something like:

default-quick-fact-col-size = 'size="6" size-sm="4" size-md="3" size-lg="2"'

and then declare my column something like:

<ion-col class="quick-fact-col" default-quick-fact-col-size>

That would really be beneficial. We haven’t started testing yet, and if we find a problem with our column sizes, right now we have to change 32 columns… but if we could use a default of some kind, we’d only have to change it once…

Possible? Would it be accepted as a feature request?

OH… on another note… is it possible to get an “Ionic-4” category?

Posts: 1

Participants: 1

Read full topic

@swlab wrote:

Hello friend , please anyone can help me , so i am developing an mobile application with ionic 3 , angular 6 and a back-end with spring-boot , after my first build release , the application work fine on computer and mobile device simulation after the installation to my cellular for testing when i click to the app for begin i get this error : Application Error , Couldn’t connect to the server .(http://localhost:8080/) .
Thanks!

Posts: 1

Participants: 1

Read full topic

@Fahadionic wrote:

Hi,
I have a ion grid , that contains rows and columns. Each row contains about 20+ columns. I want a horizontal scroll that scroll all rows (whole grid) horizontally. I have tried nowrap attribute on ion row but it creates individual scroll for each row.
is there any way to achieve this.

Thanks

Posts: 1

Participants: 1

Read full topic

@junjunhernandez wrote:

I set read and write to true and all are working fine with cordova run browser. But it does not work using a real device. No error is being thrown by either FireStore or Realtime Database. Anyone? Thanks!

Posts: 1

Participants: 1

Read full topic