I downloaded Framework 7 1.5.2 for Phonegap because the latter's built in template is for iOS. And what I need is for Android. However, when I open index.html it shows two phones but no effect.
http://imgur.com/Cx9aWpB
Here's what it looks like when I click on the kitchen sink for search bar:
http://imgur.com/BIzU8V5
How do I view it with the Materials Design?
Kindly just open the images in another tab.
Please follow this step to make it work:
First, open your framework7 folder after you downloaded it.
Rename folder "dist" to "build"
Open file "index.html" with notepad or other code editor
Scrolldown to body and add "index.html" to all links. Example : <iframe src="./kitchen-sink-ios/" scrolling="no" frameborder="0"></iframe> become <iframe src="./kitchen-sink-ios/index.html" scrolling="no" frameborder="0"></iframe>
Save and run.
Related
I am trying to use Icon Fonts on my NativeScript app.
So I followed the oficial documentation and those were my steps:
(1) - Downloaded the ttf files into my app/fonts folder:
(2) - On my app.css I declared the font global class like so:
.fa {
font-family: "Font Awesome 5 Free", "fa-regular-400", "fa-solid-
900";
}
.fa-solid {
font-family: "Font Awesome 5 Free", "fa-solid-900";
}
(3) - Then on my html component:
<Label text="" class="far"></Label>
But My Icon does not appear on the screen. I am using NativeScript 6+ with Angular 8.
Any Help ?
I figure it out why the Font Icons wasn't showing up!
I was using NativeScript 5.1 and since version 6.0 was released I migrated the project:
tns migrate
The problem is that I was using NS with Angular 8 and according to the docs I have to place my fonts on the project's root folder.
In your root application folder (This is the app folder for NativeScript Core, and the src folder for Angular 6+), create a folder called fonts and place the .ttf there.
So, Clearly the problem was that my fonts folder was inside /app when it should be inside /src folder.
It took me too long to realize that because for some strange reason my imported text fonts like 'Montserrat.tff' was working just fine. So I thought the problem was related with NativeScript or whatever.
In short, the Wrong way to do it with NativeScript and Angular 6+:
The right way:
I hope this helps newcomers who may stumble in the same problem/situation.
I have a very basic layout which includes a spot for an image:
<Image src="{{ cIconSrc }}" />
At first I uploaded an image to the ./resources folder and set the source of the image as:
"~/resources/chrome_icon.png"
...which worked great. Then I read that the correct way to do it is to create several variations of the image and place them within the App_Resources folder structure for both Android and IOS. I've done that, but when I try to switch my code so that it sets the source of the image using:
res://chrome_icon
...it is not working. I don't see the image shown on the page at all. Can someone please tell me what I'm missing? Here are a few screenshots so that you can see that I put the icon variants where they should go:
Android folders
IOS screenshot
We can get the source HTML, JS and CSS for a website by right-click and getting the source code. Is there any way we can get the same for installed Mobile app?
It is for my app. I developed a UI and installed it in my mobile to test it. Later I made some changes to my UI and couldn't recover my old changes. So I'm trying to recover it from my mobile. Any help would be appreciated.
Change file extension from ipa or apk to zip.
Then extract it somewhere. By skimming through those files you could find those html, js and css files.
I made an empty project in vs 2015 with a basic component, but can't get it to work using IIS, I always get a blank page.
I am NOT using bower since I don't like it . I used vs's NPM to import all the files.
So, here is my setup in an image.
in my IIS I just right clicked the folder and set -> Convert to application, used the default integrated app pool as usual, and in the project I set it to use my IIS. The links works fine, if I type some text in the body it works.
What could be wrong?
I believe you will have issues with your structure. Most elements try to load Polymer in a link tag at the top of the component definition file ( tag-name.html) . Polymer expects every component to be within its own directory, as well as having the same parent. That being said, you could alter every file to look in the right location after downloading them all, or place all components, and the polymer library itself, into their own folders. A brief example:
App/
Scripts/
Polymer/
CustomComponent/
paper-material/ <-- downloaded paper component
This should allow you to not get 404s and multiple downloads of identical files.
The next issue is that you are using the Polymer 1.0 library but implementing it in the 0.5 API. Translating your element to 1.0 (including the conversion of elements into folders) would result in the following:
<link rel="import" href="../polymer/polymer.html">
<dom-module id="ad-nav" noscript>
<template>
<h1>Test</h1>
<template>
</dom-module>
This should straighten everything out.
I think the problem is you clicked "Convert to Application" in IIS. For regular HTML and JavaScript you do not need to click that option. Don't do that and it will work. Clicking "Convert to Application" in IIS assumes you want a .Net Application, not a plain JavaScript and HTML application. This changes file and folder permissions which caused your issue.
I'm starting my first PhoneGap project and am developing using Visual Studio and Windows Phone 7, although I intend on ultimately deploying to iOS and Symbian as well.
However, I'm stuck at Step 1. I have added an image to the www/images folder, and put the following code:
<img src="images/login-btn.png" width="103" height="42" style="margin-left:90px;" />
And I get:
It works fine when I preview it in IE9, but I don't have a Mac to test it on iOS yet.
It's worth noting that the JS files and CSS have loaded fine, it's just any image (whether referenced in CSS or an <img> tag) always comes up broken.
My guess would be the Build Action of your image file is incorrect.
According to http://wiki.phonegap.com/w/page/48672055/Getting%20Started%20with%20PhoneGap%20Windows%20Phone%207#4Reviewtheprojectstructure section 4. You should be setting the Build Action of your images etc to Content which simply copies them into the output project when it is built. They are probably currently set to Resource or None.
To change the Build Action right click a file and choose properties to go to the properties window if you do not already have it open. It is probably then the first property. Just click and choose the correct one.
I'm posting this to questions that I found while trying to find my answer to the same problem. The JS framework I use adds a url query to each image when in a debugging mode (in order to force browsers to reload image, instead of using cached). So, my image "image/background.jpg" would be accessed as "image/background.jpg?d=34342233". But, when running on PhoneGAP for Windows Phone, it won't recognize the image, and thus it shows up as broken. So, I had to turn off debugging for the framework I use, and suddenly the images showed up (still, don't forget to set the Build Action to "Content" as mentioned earlier).