1

Я пытаюсь создать панель навигации в нижней части моего приложения для Android. Я использую NativeScript для создания приложения. Есть ли какой-нибудь плагин для этого?Нижняя панель навигации для приложения для Android (NativeScript)

<page 
xmlns="http://schemas.nativescript.org/tns.xsd" 
xmlns:drawer="nativescript-telerik-ui/sidedrawer" 
xmlns:widgets="shared/widgets" 
xmlns:statusbar="nativescript-statusbar" 
xmlns:bottomnav="nativescript-bottomnavigation" 
loaded="pageLoaded"> 
<statusbar:StatusBar ios:barStyle="light" /> 
<page.actionBar> 
<action-bar title="NativeScript"> 
    <navigation-button icon="res://ic_menu" tap="toggleDrawer" ios:visibility="collapsed" /> 
    <action-bar.actionItems> 
    <ios> 
     <action-item icon="res://ic_menu" ios.position="left" tap="toggleDrawer" /> 
    </ios> 
    </action-bar.actionItems> 
    <ActionItem tap="onDelete" ios.systemIcon="16" ios.position="right" text="Delete" android.position="popup"/> 
    <ActionItem id="logoutButton" tap="logOut" ios.systemIcon="16" ios.position="right" text="LogOut" android.position="popup"/> 
</action-bar></page.actionBar> 
<drawer:rad-side-drawer id="drawer"> 
<drawer:rad-side-drawer.mainContent> 
    <!-- Home page contents --> 
    <StackLayout loaded="contentLoaded"> 
    <image src="https://i.imgur.com/LY3cb3A.png" id="logo" tap="fun" height="100" margin="20 0 0 0" /> 
    <label text="Welcome to the NativeScript drawer template! This is the home page. Try tapping the logo." margin="20" horizontalAlignment="center" textWrap="true" /> 
    </StackLayout> 
    </drawer:rad-side-drawer.mainContent> 
<drawer:rad-side-drawer.drawerContent> 
    <widgets:drawer-content /> 
</drawer:rad-side-drawer.drawerContent> 
</drawer:rad-side-drawer> 

+0

Несколько решений здесь: http://forum.nativescript.org/t/android-tabview-to-look-like-ios/215 –

+0

Я Также добавлю, я начал переносить одну из родных библиотек, упомянутых ниже: https://github.com/bradmartin/nativescript-bottomnavigation - у меня никогда не было времени, чтобы закончить, но кто-то взял начало того, что я сделал, и опубликовал плагин. Я думаю, что это репо: https://github.com/kobby-sun/nativescript-bottomnavigation было некоторое время, так как я посмотрел на него. –

+0

Я клонировал репозиторий и попытался запустить его, но он дает ошибку. Ошибка: создание пользовательского интерфейса из XML. @file: ///app/main-page.xml: 7.4 > Модуль не найден элемент nativescript-bottomnavigation: BottonNavigation – Mill3r

ответ

0

Используйте эту библиотеку

Solution 1

Для лучшего решения вы можете проверить здесь

Solution 2

2

Я сделал исследование о том, что это лучший способ для создания нижний n аэронавигация.

Для меня, самый простой подход заключается в создании GridLayout с двумя рядами: один для прокрутки содержимого и один для нижней навигации:

<GridLayout rows=*,60"> 
    <ScrollView row="0"> 
     ... scrolling content ... 
    </ScrollView> 
    <StackLayout row="1"> 
     ... navigation buttons ... 
    </StackLayout> 
</GridLayout> 

Вторая строка представляет собой навигацию. В моем примере я использую 60 dp по высоте. Первая строка (содержимое прокрутки) занимает остальную часть доступного вертикального пространства. Символ звезды (*) означает - занимает как можно больше места.

Вы можете проверить мой опыт в следующей статье: NativeScript: how to create a fixed bottom navigation

Смежные вопросы