TabView stick at the top on ios nativescript

问题

I'm using tab-view show the data, but in android and IOS is different direction(android at top and IOS at bottom), how can I do ios same like android at the top ? Isn't got properties to set it?

回答1:

In iOS is not possible to stick the tab-view at the top. you could use in the same way. SegmentedBar. I am giving you an example:

main-page.xml

<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo">
  <StackLayout>
    <SegmentedBar selectedIndex="{{ selectedIndex }}">
        <SegmentedBar.items>
            <SegmentedBarItem title="First" />
            <SegmentedBarItem title="Second" />
        </SegmentedBar.items>
    </SegmentedBar>
    <StackLayout visibility="{{ isItemVisible }}" >
        <Label text="Tab1" textWrap="true" />
    </StackLayout>
    <StackLayout visibility="{{ isItemVisibleSecond }}">
        <Label text="Tab2" textWrap="true" />
    </StackLayout>
  </StackLayout>
</Page>

main-page.js

var observable_1 = require("data/observable"); // Event handler for Page "navigatingTo" event attached in main-page.xml function navigatingTo(args) {
    // Get the event sender
    var page = args.object;
    var observable = new observable_1.Observable();
    observable.set("selectedIndex", 0);
    observable.set("isItemVisible", "visible");
    observable.set("isItemVisibleSecond", "collapsed");
    observable.addEventListener(observable_1.Observable.propertyChangeEvent, function (pcd) {
        console.log(pcd.eventName.toString() + " " + pcd.propertyName.toString() + " " + pcd.value.toString());
        if (pcd.propertyName.toString() == 'selectedIndex') {
            if (pcd.value.toString() == 0) {
                observable.set("isItemVisible", "visible");
                observable.set("isItemVisibleSecond", "collapsed");
            }
            else {
                observable.set("isItemVisible", "collapsed");
                observable.set("isItemVisibleSecond", "visible");
            }
        }
    });
    page.bindingContext = observable;
}
exports.navigatingTo = navigatingTo;

来源：https://stackoverflow.com/questions/37134680/tabview-stick-at-the-top-on-ios-nativescript

标签

nativescript