如何创建类似于instagram的底部导航栏

问题描述 投票:1回答:4

我是一个Android新手试图为我的新Android应用程序创建一个底部导航栏,类似于Instagram中的那个。像这样的instagram.jpg点击搜索图标会在操作栏中添加搜索栏。我正在构建一个应用程序,用于提醒用户他的医疗预约,底部有三个导航标签。在此之后我创造了直到这个Screenshot_2017-06-04-11-59-56.png我被卡住了。我应该使用三个活动来显示相应选项卡或片段的内容,我该如何实现。

我需要一个recyclerview来显示约会。如何仅在单击底部的搜索图标时才显示搜索栏。已经搜索了很多关于实现这一点,但找不到任何有用的东西。

对代码或库实现相同的任何建议都将是非常有用的,谢谢。

android android-fragments android-recyclerview instagram bottomnavigationview
4个回答
4
投票

我应该使用三个activities来显示相应的tabsfragments的内容,我该如何实现?

绝对你应该使用Fragment为每个底部导航Item / Tab。像FragmentHomeFragmentSearchFragmentSettings

要更改Fragment,请将NavigationItemSelectedListener添加到BottomNavigationView并根据Fragment选择更改MenuItem

    BottomNavigationView bottomNavigationView = (BottomNavigationView)
            findViewById(R.id.bottom_navigation_view);

    bottomNavigationView.setOnNavigationItemSelectedListener
            (new BottomNavigationView.OnNavigationItemSelectedListener() {
                @Override
                public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                    Fragment selectedFragment = null;
                    switch (item.getItemId()) {
                        case R.id.action_item1:
                            selectedFragment = FragmentHome.newInstance();
                            break;
                        case R.id.action_item2:
                            selectedFragment = FragmentSearch.newInstance();
                            break;
                        case R.id.action_item3:
                            selectedFragment = FragmentSettings.newInstance();
                            break;
                    }
                    FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
                    transaction.replace(R.id.frame_layout, selectedFragment);
                    transaction.commit();
                    return true;
                }
            });

这是一个关于:BottomNavigationView with multiple Fragments的教程

我需要一个recyclerview来显示约会

在你的Fragment's布局XML,添加一个RecyclerView来显示约会列表。在你的Fragment类中,初始化RecyclerView并创建一个ArrayList<Appointment>并将此list传递给你的Adapter以显示在RecyclerView行项目上。

这是一个关于:How to use RecyclerView in Fragment的教程

如果仅点击底部的search bar图标,我该如何显示search

您可以根据片段更改以编程方式显示/隐藏ToolBar/ActionBar中的选项。

在您的FragmentSearch中,请执行以下更改以显示Searchbar

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setHasOptionsMenu(true);
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup parent, Bundle savedInstanceState)
{
    View v = inflater.inflate(R.layout.fragmet_search, parent, false);
    return v;
}


@Override
public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
   inflater.inflate(R.menu.your_search_menu_xml, menu);
   super.onCreateOptionsMenu(menu, inflater);
}

以下是一些有用的链接:

  1. Android Toolbar Adding Menu Items for different fragments
  2. Hide/Show Action Bar Option Menu Item for different fragments
  3. Adding ActionBar Items From Within Your Fragments

希望这有助于理解这种情况。


0
投票

你把你的底部导航放在活动中并用你想要的任何东西填充它然后你使用它

bottomNavigationView.setOnNavigationItemSelectedListener(this);

添加项目选择侦听器。您还可以在此活动中实现所需的方法

@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
    switch (item.getItemId()){
        case R.id.action_home:
            //open home fragment
            break;

        case R.id.action_search:
            //open search or whatever
            break;

    }

    return true;
}

现在,您可以在选择某个项目时执行任何操作,例如,当选择搜索项目时,您可以显示搜索部分并在选择其他项目时隐藏它。


0
投票

如果你想要BottomBar here's one的库。您必须通过单击该底部条形项来控制SearchBar的可见性。如果您正在尝试实现自己的searchBar,请查看此链接link1 link2


0
投票

选项卡的概念是你必须有一个MainActivity,它将处理让我们说3个片段。使用@Alireza建议的代码,您将处理片段之间的更改。请查看有关如何实现Tabs(like this one here)的教程。之后,在“SearchFragment.java”中,您将相应地构建XML,顶部是您的搜索栏,下面是回收站视图,或者您想要的任何内容。建议:使用片段时,一定要有一个Context mContext = getActivity();首先定义,因为它将更容易实现所有功能。

*为了实现底部选项卡效果,您可以将android.support.design.widget.TabLayout移动到屏幕底部

© www.soinside.com 2019 - 2024. All rights reserved.