Hello,
I wonder If I can fill ion-content
70% of height with static (not scrollable) elements like input form …
and only 30% of height create scrollable list with items.
this is my view:
<ion-content scroll="false">
<label class="item item-input line-information">
<div class = "row-without-image">
<input class="wm-new-meeting-subject font-information" type="text" placeholder="Subject1" ng-model="details.title" >
</div>
</label>
<label class="item item-input line-information">
<div class = "row-without-image">
<input class="wm-new-meeting-subject font-information" type="text" placeholder="Subject2" ng-model="details.title" >
</div>
</label>
<label class="item item-input line-information">
<div class = "row-without-image">
<input class="wm-new-meeting-subject font-information" type="text" placeholder="Subject3" ng-model="details.title" >
</div>
</label>
<label class="item item-input line-information">
<div class = "row-without-image">
<input class="wm-new-meeting-subject font-information" type="text" placeholder="Subject4" ng-4model="details.title" >
</div>
</label>
<label class="item item-input line-information">
<div class = "row-without-image">
<input class="wm-new-meeting-subject font-information" type="text" placeholder="Subject5" ng-model="details.title" >
</div>
</label>
<ion-list style="height=100px">
<ion-item ng-repeat="item in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17]"
item="item"
href="#/item/{{item.id}}"
>
Item {{ item }}
</ion-item>
</ion-list>
<div class="row" >
<button class="button button-block button-stable ">
Cancel
</button>
<button class="button button-block button-stable ">
Set
</button>
</div>
</ion-content>
The demo you can find HERE
The idea is to set ion-list
height for example 300px to let to user to see bottom buttons without down scrolling.
How can achieve that?