I added ion-refresher in a Ionic 4 project like this :
<ion-refresher slot="fixed">
<ion-refresher-content></ion-refresher-content>
</ion-refresher>
But for Android platform the default spinner showing up is lines not crescent.
you can specify the spinner shape you want just follow this link
Related
I have set up ionic environment
1) node and npm
2) cordova and ionic with sidemenu template
While using the ionic 4 components in the application its classes are not working
You can see it shows button without css.
Any help is appreciated.
Thank you
Components are working, I can see <ion-content> and <ion-header> in the console. probably you css is not working , try this in html
<ion-content padding>
<button ion-button class="btn">My button</button>
</ion-content>
and in scss
.btn{
background: red;
}
you can change the css property it this btn class and it should reflect when running the app
I tried to put it like this, like on the example
<ion-col col-md-6>
<ion-list>
<ion-item>
<ion-label floating>Type</ion-label>
<ion-select interface="popover" [(ngModel)]="userType">
<ion-option value="1">Type 1</ion-option>
<ion-option value="2">Type 2</ion-option>
</ion-select>
</ion-item>
</ion-list>
</ion-col>
but the output is not similar on the example on the ionic documentation.
here is the output
I want something like this
What you are seeing is actually a platform issue: Ionic styles elements according to the platform you are running on. See the docs on this here.
You can also easily reproduce your issue viewing the ion-select docs and changing between iOS and Android.
iOS output:
Android output:
So assuming your developing for the iOS platform you don't have to change anything in your app to get the look you want. Once you deploy your app on an iOS device everything will look as you expect.
While testing your app in browser (I'm assuming Chrome, other browser might have the same feature) you might want to use the dev tools (F12) and toggle the device mode. There you can choose to see the viewport of a iPhone or iPad and after refreshing the page (F5) you should see the correct controls.
I'm using Ionic2: I have my Icons and I want to set them as we set Ionic icons:
<ion-icon name="cart"></ion-icon>
what should I do to use my icons, I don't want to use online Icons I want to use my icons
In my ionic app, the ion-input simply not render and I don't discovered why, yet.
For example, this code not render:
<ion-item>
<ion-label color="primary" floating>Floating Label</ion-label>
<ion-input type="text"></ion-input>
</ion-item>
Just the Floating Label appears, but the input effect not works and I cannot type anything.
What am I forgetting?
And more, the input style using the input tag is in bold, and in my own css am not changing the default style.
I am also facing same issue. After googling, came to know this not work in Ionic 1. Ionic version 1 will not support ion-iput. This is supporting from Ionic 1 later versions like ionic 2,etc.
I think that you did not create an Ionic2 application !
I'm using the Ionic framework and I just got the template project side-menu from them. I was wondering if it's possible to put the ion-header-bar appear above the ion-side-menu.
This is how it is right now:
This is how I want it to be:
Any ideas?
You could use an alternative drawer component for your side menu, for example:
https://github.com/beaver71/ionic-ion-drawer
Basic usage is:
<drawer side="left">
<ion-content>
....
</ion-content>
</drawer>
Here is a working example: http://codepen.io/beaver71/pen/BKpRjM/