Zobaczyłem nowe wytyczne i zostały użyte w google photos
najnowszej aplikacji. Nie mam pojęcia, jak używać nowego dolnego paska nawigacyjnego. Przejrzyj nową bibliotekę pomocy, nie znalazłem żadnego kontaktu.
Nie mogę znaleźć żadnej oficjalnej próbki.
Jak korzystać z nowego dolnego paska? Nie chcę dostosowywać.
android
bottomnavigationview
zjywill
źródło
źródło
Odpowiedzi:
Myślę, że możesz tego szukać.
Oto krótki opis, aby rozpocząć:
public class MainActivity extends AppCompatActivity { private BottomBar mBottomBar; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // Notice how you don't use the setContentView method here! Just // pass your layout to bottom bar, it will be taken care of. // Everything will be just like you're used to. mBottomBar = BottomBar.bind(this, R.layout.activity_main, savedInstanceState); mBottomBar.setItems( new BottomBarTab(R.drawable.ic_recents, "Recents"), new BottomBarTab(R.drawable.ic_favorites, "Favorites"), new BottomBarTab(R.drawable.ic_nearby, "Nearby"), new BottomBarTab(R.drawable.ic_friends, "Friends") ); mBottomBar.setOnItemSelectedListener(new OnTabSelectedListener() { @Override public void onItemSelected(final int position) { // the user selected a new tab } }); } @Override protected void onSaveInstanceState(Bundle outState) { super.onSaveInstanceState(outState); mBottomBar.onSaveInstanceState(outState); } }
Oto link referencyjny.
https://github.com/roughike/BottomBar
EDYTUJ nowe wydania.
Widok nawigacji u dołu od jakiegoś czasu znajduje się w wytycznych dotyczących projektowania materiałów, ale nie było nam łatwo wdrożyć go w naszych aplikacjach. Niektóre aplikacje zbudowały własne rozwiązania, podczas gdy inne polegały na bibliotekach open source innych firm, aby wykonać zadanie. Teraz w bibliotece wsparcia projektowania pojawia się dolny pasek nawigacji, przyjrzyjmy się, jak możemy go używać!
Na początek musimy zaktualizować naszą zależność!
compile ‘com.android.support:design:25.0.0’
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <!-- Content Container --> <android.support.design.widget.BottomNavigationView android:id="@+id/bottom_navigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" app:itemBackground="@color/colorPrimary" app:itemIconTint="@color/white" app:itemTextColor="@color/white" app:menu="@menu/bottom_navigation_main" /> </RelativeLayout>
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <item android:id="@+id/action_favorites" android:enabled="true" android:icon="@drawable/ic_favorite_white_24dp" android:title="@string/text_favorites" app:showAsAction="ifRoom" /> <item android:id="@+id/action_schedules" android:enabled="true" android:icon="@drawable/ic_access_time_white_24dp" android:title="@string/text_schedules" app:showAsAction="ifRoom" /> <item android:id="@+id/action_music" android:enabled="true" android:icon="@drawable/ic_audiotrack_white_24dp" android:title="@string/text_music" app:showAsAction="ifRoom" /> </menu>
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_checked="true" android:color="@color/colorPrimary" /> <item android:state_checked="false" android:color="@color/grey" /> </selector>
BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottom_navigation); bottomNavigationView.setOnNavigationItemSelectedListener( new BottomNavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem item) { switch (item.getItemId()) { case R.id.action_favorites: break; case R.id.action_schedules: break; case R.id.action_music: break; } return false; } });
Edycja: Używając Androidx, wystarczy dodać poniższe zależności.
implementation 'com.google.android.material:material:1.2.0-alpha01'
Układ
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <com.google.android.material.bottomnavigation.BottomNavigationView android:layout_gravity="bottom" app:menu="@menu/bottom_navigation_menu" android:layout_width="match_parent" android:layout_height="wrap_content"/> </FrameLayout>
Jeśli chcesz dowiedzieć się więcej o jego metodach i sposobie działania, przeczytaj to.
Na pewno ci to pomoże.
źródło
Należy użyć BottomNavigationView z biblioteki obsługi systemu Android w wersji 25. Reprezentuje standardowy dolny pasek nawigacyjny aplikacji.
Oto post na Medium z przewodnikiem krok po kroku: https://medium.com/@hitherejoe/exploring-the-android-design-support-library-bottom-navigation-drawer-548de699e8e0#.9vmiekxze
źródło
Moja pierwotna odpowiedź dotyczyła
BottomNavigationView
, ale teraz jestBottomAppBar
. Na górze dodałem sekcję z linkiem do implementacji.Dolny pasek aplikacji
BottomAppBar
Obsługuje przycisk Pływający działania.Zdjęcie stąd . Zobacz dokumentację i ten samouczek, aby uzyskać pomoc dotyczącą konfigurowania
BottomAppBar
.Dolny widok nawigacji
Poniższy pełny przykład pokazuje, jak utworzyć dolny widok nawigacji podobny do obrazu w pytaniu. Zobacz także Nawigacja u dołu w dokumentacji.
Dodaj bibliotekę wsparcia projektowania
Dodaj tę linię do pliku build.grade swojej aplikacji obok innych elementów biblioteki obsługi.
implementation 'com.android.support:design:28.0.0'
Zastąp numer wersji tym, który jest aktualny.
Utwórz układ działania
Jedyną specjalną rzeczą, którą dodaliśmy do układu, jest
BottomNavigationView
. Aby zmienić kolor ikony i tekstu po kliknięciu, możesz użyć aselector
zamiast bezpośredniego określania koloru. Zostało to pominięte dla uproszczenia.activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.BottomNavigationView android:id="@+id/bottom_navigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" app:menu="@menu/bottom_nav_menu" app:itemBackground="@color/colorPrimary" app:itemIconTint="@android:color/white" app:itemTextColor="@android:color/white" /> </RelativeLayout>
Zwróć uwagę, że
layout_alignParentBottom
faktycznie umieszczaliśmy go na dole.Zdefiniuj pozycje menu
XML powyżej dla widoku nawigacji dolnej, do którego się odwołano
bottom_nav_menu
. To właśnie definiuje każdy element z naszego punktu widzenia. Zrobimy to teraz. Wszystko, co musisz zrobić, to dodać zasób menu, tak jak w przypadku paska akcji lub paska narzędzi.bottom_nav_menu.xml
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <item android:id="@+id/action_recents" android:enabled="true" android:icon="@drawable/ic_action_recents" android:title="Recents" app:showAsAction="ifRoom" /> <item android:id="@+id/action_favorites" android:enabled="true" android:icon="@drawable/ic_action_favorites" android:title="Favorites" app:showAsAction="ifRoom" /> <item android:id="@+id/action_nearby" android:enabled="true" android:icon="@drawable/ic_action_nearby" android:title="Nearby" app:showAsAction="ifRoom" /> </menu>
Będziesz musiał dodać odpowiednie ikony do swojego projektu. Nie jest to zbyt trudne, jeśli przejdziesz do Plik> Nowy> Zasób obrazu i wybierzesz Pasek akcji i ikony kart jako typ ikony.
Dodaj odbiornik wybranego elementu
Nie dzieje się tu nic specjalnego. Po prostu dodajemy odbiornik do dolnego paska nawigacyjnego w
onCreate
metodzie naszego działania .public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottom_navigation); bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem item) { switch (item.getItemId()) { case R.id.action_recents: Toast.makeText(MainActivity.this, "Recents", Toast.LENGTH_SHORT).show(); break; case R.id.action_favorites: Toast.makeText(MainActivity.this, "Favorites", Toast.LENGTH_SHORT).show(); break; case R.id.action_nearby: Toast.makeText(MainActivity.this, "Nearby", Toast.LENGTH_SHORT).show(); break; } return true; } }); } }
Potrzebujesz więcej pomocy?
Nauczyłem się, jak to zrobić, oglądając następujący film na YouTube. Głos komputera jest trochę dziwny, ale demonstracja jest bardzo wyraźna.
źródło
Aby to osiągnąć, możesz również użyć układu karty z niestandardowym widokiem karty.
custom_tab.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="?attr/selectableItemBackground" android:gravity="center" android:orientation="vertical" android:paddingBottom="10dp" android:paddingTop="8dp"> <ImageView android:id="@+id/icon" android:layout_width="24dp" android:layout_height="24dp" android:scaleType="centerInside" android:src="@drawable/ic_recents_selector" /> <TextView android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:ellipsize="end" android:maxLines="1" android:textAllCaps="false" android:textColor="@color/tab_color" android:textSize="12sp"/> </LinearLayout>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <android.support.v4.view.ViewPager android:id="@+id/view_pager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" /> <android.support.design.widget.TabLayout android:id="@+id/tab_layout" style="@style/AppTabLayout" android:layout_width="match_parent" android:layout_height="56dp" android:background="?attr/colorPrimary" /> </LinearLayout>
MainActivity.java
public class MainActivity extends AppCompatActivity { private TabLayout mTabLayout; private int[] mTabsIcons = { R.drawable.ic_recents_selector, R.drawable.ic_favorite_selector, R.drawable.ic_place_selector}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // Setup the viewPager ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager); MyPagerAdapter pagerAdapter = new MyPagerAdapter(getSupportFragmentManager()); viewPager.setAdapter(pagerAdapter); mTabLayout = (TabLayout) findViewById(R.id.tab_layout); mTabLayout.setupWithViewPager(viewPager); for (int i = 0; i < mTabLayout.getTabCount(); i++) { TabLayout.Tab tab = mTabLayout.getTabAt(i); tab.setCustomView(pagerAdapter.getTabView(i)); } mTabLayout.getTabAt(0).getCustomView().setSelected(true); } private class MyPagerAdapter extends FragmentPagerAdapter { public final int PAGE_COUNT = 3; private final String[] mTabsTitle = {"Recents", "Favorites", "Nearby"}; public MyPagerAdapter(FragmentManager fm) { super(fm); } public View getTabView(int position) { // Given you have a custom layout in `res/layout/custom_tab.xml` with a TextView and ImageView View view = LayoutInflater.from(MainActivity.this).inflate(R.layout.custom_tab, null); TextView title = (TextView) view.findViewById(R.id.title); title.setText(mTabsTitle[position]); ImageView icon = (ImageView) view.findViewById(R.id.icon); icon.setImageResource(mTabsIcons[position]); return view; } @Override public Fragment getItem(int pos) { switch (pos) { case 0: return PageFragment.newInstance(1); case 1: return PageFragment.newInstance(2); case 2: return PageFragment.newInstance(3); } return null; } @Override public int getCount() { return PAGE_COUNT; } @Override public CharSequence getPageTitle(int position) { return mTabsTitle[position]; } } }
Pobierz kompletny przykładowy projekt
źródło
Firma Google uruchomiła BottomNavigationView po wersji 25.0.0 biblioteki obsługi projektowania. Ale przyszedł z następującymi ograniczeniami:
Więc maksimum, które możesz zrobić z tą pierwszą wersją BottomNavigationView, to: (bez żadnej refleksji lub samodzielnego implementowania biblioteki).
Więc jeśli chcesz którekolwiek z nich. Możesz użyć biblioteki trzeciej części, takiej jak roughike / BottomBar, lub zaimplementować bibliotekę samodzielnie.
źródło
app:itemBackground="xxx"
wszystkie elementy w tym kolorze i nie zobaczysz tła (chyba że dodasz przezroczystość, ale nadal wszystkie ikony mają ten sam kolor) . Bardzo kiepskie, że zespół Androida wypuścił tak kiepski komponent… zawsze ukończony w 75%, pomijając dodatkowy kilometr, który sprawiłby, że byłby świetny.Jak wspomniał Sanf0rd, Google uruchomił BottomNavigationView jako część biblioteki Design Support Library w wersji 25.0.0 . Ograniczenia, o których wspomniał, są w większości prawdziwe, z wyjątkiem tego, że MOŻESZ zmienić kolor tła widoku, a nawet kolor tekstu i odcień ikon. Ma również animację, gdy dodajesz więcej niż 4 elementy (niestety nie można jej włączyć ani wyłączyć ręcznie).
Napisałem na ten temat szczegółowy samouczek z przykładami i towarzyszącym im repozytorium, które możesz przeczytać tutaj: https://blog.autsoft.hu/now-you-can-use-the-bottom-navigation-view-in-the- biblioteka-wsparcia-projektowania /
Istota tego
Musisz dodać je na poziomie swojej aplikacji
build.gradle
:compile 'com.android.support:appcompat-v7:25.0.0' compile 'com.android.support:design:25.0.0'
Możesz umieścić go w swoim układzie w następujący sposób:
<android.support.design.widget.BottomNavigationView xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/bottom_navigation_view" android:layout_width="match_parent" android:layout_height="wrap_content" app:itemBackground="@color/darkGrey" app:itemIconTint="@color/bottom_navigation_item_background_colors" app:itemTextColor="@color/bottom_navigation_item_background_colors" app:menu="@menu/menu_bottom_navigation" />
Możesz określić elementy za pomocą zasobu menu, takiego jak:
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/action_one" android:icon="@android:drawable/ic_dialog_map" android:title="One"/> <item android:id="@+id/action_two" android:icon="@android:drawable/ic_dialog_info" android:title="Two"/> <item android:id="@+id/action_three" android:icon="@android:drawable/ic_dialog_email" android:title="Three"/> <item android:id="@+id/action_four" android:icon="@android:drawable/ic_popup_reminder" android:title="Four"/> </menu>
Możesz także ustawić odcień i kolor tekstu jako listę kolorów, aby aktualnie wybrany element był podświetlony:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:color="@color/colorAccent" android:state_checked="false"/> <item android:color="@android:color/white" android:state_checked="true"/> </selector>
Na koniec możesz obsłużyć wybór elementów za pomocą OnNavigationItemSelectedListener:
bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem item) { Fragment fragment = null; switch (item.getItemId()) { case R.id.action_one: // Switch to page one break; case R.id.action_two: // Switch to page two break; case R.id.action_three: // Switch to page three break; } return true; } });
źródło
Inna alternatywna biblioteka, którą możesz wypróbować: - https://github.com/Ashok-Varma/BottomNavigation
<com.ashokvarma.bottomnavigation.BottomNavigationBar android:layout_gravity="bottom" android:id="@+id/bottom_navigation_bar" android:layout_width="match_parent" android:layout_height="wrap_content"/> BottomNavigationBar bottomNavigationBar = (BottomNavigationBar) findViewById(R.id.bottom_navigation_bar); bottomNavigationBar .addItem(new BottomNavigationItem(R.drawable.ic_home_white_24dp, "Home")) .addItem(new BottomNavigationItem(R.drawable.ic_book_white_24dp, "Books")) .addItem(new BottomNavigationItem(R.drawable.ic_music_note_white_24dp, "Music")) .addItem(new BottomNavigationItem(R.drawable.ic_tv_white_24dp, "Movies & TV")) .addItem(new BottomNavigationItem(R.drawable.ic_videogame_asset_white_24dp, "Games")) .initialise();
źródło
Myślę, że to też się przyda.
Skrawek
public class MainActivity : AppCompatActivity, BottomNavigationBar.Listeners.IOnTabSelectedListener { private BottomBar _bottomBar; protected override void OnCreate(Bundle bundle) { base.OnCreate(bundle); SetContentView(Resource.Layout.MainActivity); _bottomBar = BottomBar.Attach(this, bundle); _bottomBar.SetItems( new BottomBarTab(Resource.Drawable.ic_recents, "Recents"), new BottomBarTab(Resource.Drawable.ic_favorites, "Favorites"), new BottomBarTab(Resource.Drawable.ic_nearby, "Nearby") ); _bottomBar.SetOnItemSelectedListener(this); _bottomBar.HideShadow(); _bottomBar.UseDarkTheme(true); _bottomBar.SetTypeFace("Roboto-Regular.ttf"); var badge = _bottomBar.MakeBadgeForTabAt(1, Color.ParseColor("#f02d4c"), 1); badge.AutoShowAfterUnSelection = true; } public void OnItemSelected(int position) { } protected override void OnSaveInstanceState(Bundle outState) { base.OnSaveInstanceState(outState); // Necessary to restore the BottomBar's state, otherwise we would // lose the current tab on orientation change. _bottomBar.OnSaveInstanceState(outState); } }
Spinki do mankietów
https://github.com/pocheshire/BottomNavigationBar
Jest https://github.com/roughike/BottomBar przeniesiony do C # dla deweloperów platformy Xamarin
źródło
stworzyłem prywatne zajęcia, które używają widoku siatki i zasobu menu:
private class BottomBar { private GridView mGridView; private Menu mMenu; private BottomBarAdapter mBottomBarAdapter; private View.OnClickListener mOnClickListener; public BottomBar (@IdRes int gridviewId, @MenuRes int menuRes,View.OnClickListener onClickListener) { this.mGridView = (GridView) findViewById(gridviewId); this.mMenu = getMenu(menuRes); this.mOnClickListener = onClickListener; this.mBottomBarAdapter = new BottomBarAdapter(); this.mGridView.setAdapter(mBottomBarAdapter); } private Menu getMenu(@MenuRes int menuId) { PopupMenu p = new PopupMenu(MainActivity.this,null); Menu menu = p.getMenu(); getMenuInflater().inflate(menuId,menu); return menu; } public GridView getGridView(){ return mGridView; } public void show() { mGridView.setVisibility(View.VISIBLE); mGridView.animate().translationY(0); } public void hide() { mGridView.animate().translationY(mGridView.getHeight()); } private class BottomBarAdapter extends BaseAdapter { private LayoutInflater mInflater; public BottomBarAdapter(){ this.mInflater = LayoutInflater.from(MainActivity.this); } @Override public int getCount() { return mMenu.size(); } @Override public Object getItem(int i) { return mMenu.getItem(i); } @Override public long getItemId(int i) { return 0; } @Override public View getView(int i, View view, ViewGroup viewGroup) { MenuItem item = (MenuItem) getItem(i); if (view==null){ view = mInflater.inflate(R.layout.your_item_layout,null); view.setId(item.getItemId()); } view.setOnClickListener(mOnClickListener); view.findViewById(R.id.bottomnav_icon).setBackground(item.getIcon()); ((TextView) view.findViewById(R.id.bottomnav_label)).setText(item.getTitle()); return view; } }
twoje_menu.xml:
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/item1_id" android:icon="@drawable/ic_item1" android:title="@string/title_item1"/> <item android:id="@+id/item2_id" android:icon="@drawable/ic_item2" android:title="@string/title_item2"/> ... </menu>
oraz element układu niestandardowego your_item_layout.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" android:layout_margin="16dp"> <ImageButton android:id="@+id/bottomnav_icon" android:layout_width="24dp" android:layout_height="24dp" android:layout_gravity="top|center_horizontal" android:layout_marginTop="8dp" android:layout_marginBottom="4dp"/> <TextView android:id="@+id/bottomnav_label" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|center_horizontal" android:layout_marginBottom="8dp" android:layout_marginTop="4dp" style="@style/mystyle_label" /> </LinearLayout>
użycie w ramach Twojej głównej aktywności:
BottomBar bottomBar = new BottomBar(R.id.YourGridView,R.menu.your_menu, mOnClickListener);
i
private View.OnClickListener mOnClickListener = new View.OnClickListener() { @Override public void onClick(View view) { switch (view.getId()) { case R.id.item1_id: //todo item1 break; case R.id.item2_id: //todo item2 break; ... } } }
oraz w layout_activity.xml
<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true"> ... <FrameLayout android:id="@+id/fragment_container" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior"/> <GridView android:id="@+id/bottomNav" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/your_background_color" android:verticalSpacing="0dp" android:horizontalSpacing="0dp" android:numColumns="4" android:stretchMode="columnWidth" app:layout_anchor="@id/fragment_container" app:layout_anchorGravity="bottom"/> </android.support.design.widget.CoordinatorLayout>
źródło
Dostępna jest nowa oficjalna funkcja BottomNavigationView w wersji 25 biblioteki Design Support Library
https://developer.android.com/reference/android/support/design/widget/BottomNavigationView.html dodaj w gradle
compile 'com.android.support:design:25.0.0'
XML
<android.support.design.widget.BottomNavigationView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:design="http://schema.android.com/apk/res/android.support.design" android:id="@+id/navigation" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" design:menu="@menu/my_navigation_items" />
źródło
Ta biblioteka, BottomNavigationViewEx , rozszerza BottomNavigationView firmy Google. Możesz łatwo dostosować bibliotekę Google, aby dolny pasek nawigacyjny był taki, jak chcesz. Możesz wyłączyć tryb zmiany biegów, zmienić widoczność ikon i tekstów i wiele więcej. Zdecydowanie wypróbuj to.
źródło
Odniosłem się do tego posta na githubie i ustawiłem
three layouts
dlathree fragment
stron na dolnym pasku zakładek.FourButtonsActivity.java:
bottomBar.setFragmentItems(getSupportFragmentManager(), R.id.fragmentContainer, new BottomBarFragment(LibraryFragment.newInstance(R.layout.library_fragment_layout), R.drawable.ic_update_white_24dp, "Recents"), new BottomBarFragment(PhotoEffectFragment.newInstance(R.layout.photo_effect_fragment), R.drawable.ic_local_dining_white_24dp, "Food"), new BottomBarFragment(VideoFragment.newInstance(R.layout.video_layout), R.drawable.ic_favorite_white_24dp, "Favorites") );
Aby ustawić liczbę odznak:
BottomBarBadge unreadMessages = bottomBar.makeBadgeForTabAt(1, "#E91E63", 4); unreadMessages.show(); unreadMessages.setCount(4); unreadMessages.setAnimationDuration(200); unreadMessages.setAutoShowAfterUnSelection(true);
LibraryFragment.java:
import android.os.Bundle; import android.support.annotation.Nullable; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class LibraryFragment extends Fragment { private static final String STARTING_TEXT = "Four Buttons Bottom Navigation"; public LibraryFragment() { } public static LibraryFragment newInstance(int resource) { Bundle args = new Bundle(); args.putInt(STARTING_TEXT, resource); LibraryFragment sampleFragment = new LibraryFragment(); sampleFragment.setArguments(args); return sampleFragment; } @Nullable @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = LayoutInflater.from(getActivity()).inflate( getArguments().getInt(STARTING_TEXT), null); return view; }
źródło
Możesz tworzyć układy zgodnie z powyższymi odpowiedziami Jeśli ktoś chce użyć tego w kotlinie: -
private val mOnNavigationItemSelectedListener = BottomNavigationView.OnNavigationItemSelectedListener { item -> when (item.itemId) { R.id.images -> { // do your work.... return@OnNavigationItemSelectedListener true } R.id.videos -> { // do your work.... return@OnNavigationItemSelectedListener true } } false }
następnie w oncreate możesz ustawić powyższy słuchacz do swojego widoku
mDataBinding?.navigation?.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener)
źródło
<android.support.design.widget.BottomNavigationView android:id="@+id/navigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" android:background="?android:attr/windowBackground" app:menu="@menu/navigation" />
navigation.xml (wewnątrz menu)
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <item android:id="@+id/navigation_home" android:icon="@drawable/ic_home_black_24dp" android:title="@string/title_home" app:showAsAction="always|withText" android:enabled="true"/>
onCreate()
Metoda wewnętrzna ,BottomNavigationView navigation = (BottomNavigationView)findViewById(R.id.navigation); //Dont forgot this line BottomNavigationViewHelper.disableShiftMode(navigation);
I stwórz klasę jak poniżej.
public class BottomNavigationViewHelper { public static void disableShiftMode(BottomNavigationView view) { BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0); try { Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode"); shiftingMode.setAccessible(true); shiftingMode.setBoolean(menuView, false); shiftingMode.setAccessible(false); for (int i = 0; i < menuView.getChildCount(); i++) { BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i); //noinspection RestrictedApi item.setShiftingMode(false); // set once again checked value, so view will be updated //noinspection RestrictedApi item.setChecked(item.getItemData().isChecked()); } } catch (NoSuchFieldException e) { Log.e("BNVHelper", "Unable to get shift mode field", e); } catch (IllegalAccessException e) { Log.e("BNVHelper", "Unable to change value of shift mode", e); } } }
źródło