Google fonts with cordova for Android

[danikane]

Hi guys, I tried literally anything to use a custom font for Android build, but I can’t get it to work.

I followed this guide: http://therockncoder.blogspot.bg/2014/02/using-google-fonts-in-phonegap-app.html
Downloaded the .woff/.woff2 fonts, defined them but when building with Cordova Quasar still imports Roboto.
Combined it with http://quasar-framework.org/guide/app-using-fonts-from-cdn.html with no success.

I even tried to do some tricks with quasar.mat.styl, because Quasar imports from npm roboto-font-face still no luck.

Any ideas?

[danikane]

And a dirty hack proved to work: I placed my .woff2 font in /statics and defined it in index.html <style> block

@font-face {
	font-family: 'Comfortaa';
	font-style: normal;
	font-weight: 400;
	src: url('statics/Comfortaa.woff2') format('woff2');
	unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

html,
body {
	font-family: 'Comfortaa';
	overflow: auto;
}

[rstoenescu]

Well, of course you need to define some other font if you don’t want the default one. But I’m curious as to why Roboto was still requested in your app. Are you sure you followed the guide by the letter? Enable a custom theme (check head of /src/main.js) and in src/themes/app.mat.styl and src/themes/app.ios.styl set a Stylus variable ($quasar-dont-import-roboto = true) before @import '~quasar-framework/dist/.....'.

[danikane]

Re: Google fonts with cordova for Android

I did:

$quasar-dont-import-roboto = true
$quasar-dont-import-fonts = true

in app.variables.styl

and then I did:

$quasar-dont-import-fonts = true
$quasar-dont-import-roboto = true
@import '~quasar-framework/dist/quasar.mat.styl'

in app.mat.styl

/dist still contains /fonts/Roboto* though.

EDIT: Oh, I see I kinda missed the main.js tip…
I am not familiar with Stylus so I thought this is loaded by default. Thanks for the tip!
Even though I try to read up on everything it’s a hit and miss sometimes