I am trying to create a Ionic app with the sidemenu starter project. For one of my menu options I would like to have a tab view with two tabs. I've replaced the search.html
content with the following code:
<ion-view title="Profile">
<ion-tabs class="tabs-positive tabs-icon-top">
<ion-tab title="Option1" icon-on="ion-ios-filing" icon-off="ion-ios-filing-outline">
<h1>HELLO OPTION 1</h1>
</ion-tab>
<ion-tab title="Option2" icon-on="ion-ios-clock" icon-off="ion-ios-clock-outline">
<h1>HELLO OPTION 2</h1>
</ion-tab>
</ion-tabs>
</ion-view>
But with this, the H1 gets overlapped by the menu header. In previous versions of Ionic, this could be fixed with the has-header
option, but this has been removed and should be managed automatically. From what I've read I should put my content within a ion-content
block, but when I do this with the ion-tabs tabs are not shown (they're actually shown below the header bar, I can see them if I pull down). For reference this is the code I used:
<ion-view title="Profile">
<ion-content>
<ion-tabs class="tabs-positive tabs-icon-top">
<ion-tab title="Option1" icon-on="ion-ios-filing" icon-off="ion-ios-filing-outline">
<h1>HELLO OPTION 1</h1>
</ion-tab>
<ion-tab title="Option2" icon-on="ion-ios-clock" icon-off="ion-ios-clock-outline">
<h1>HELLO OPTION 2</h1>
</ion-tab>
</ion-tabs>
</ion-content>
</ion-view>
How can I fix this?
Aucun commentaire:
Enregistrer un commentaire