如何創建類似於instagram的底部導航欄

我是一個Android新手，試圖爲我的新Android應用創建一個底部導航欄，類似於Instagram中的那個。像這樣點擊搜索圖標在操作欄中添加一個搜索欄。我正在構建一個提醒用戶有關他的醫療約會的應用程序，該應用程序底部有三個導航選項卡。在這之後，我一直創建到此卡住了。我是否應該使用三項活動來顯示相應選項卡或片段的內容，以及如何實現該功能。如何創建類似於instagram的底部導航欄

我需要一個recyclerview來顯示約會。如何僅在點擊底部的搜索圖標時顯示搜索欄。已經搜索了很多關於實現這一點，但找不到有用的東西。

對於代碼或庫的任何建議達到相同的將是很大的幫助，謝謝。

來源

2017-06-04 yogeshmanjhi

看來你並不真正瞭解Android開發中的很多基本概念。我建議你按照Android開發的適當教程學習基礎知識，然後自己嘗試。那時你應該知道如何使用片段，標籤和動態顯示/隱藏搜索欄。 – paradite

我應該使用三個activities顯示的內容相應的 tabs或fragments，我該如何做到這一點？

當然你應該使用Fragment爲每個底部導航Item/Tab。像FragmentHome,FragmentSearch和FragmentSettings。

要改變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顯示約會

在您的佈局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); 
}

下面是一些有用的鏈接：

希望這將有助於瞭解情況。

來源

2017-06-04 07:52:58 FAT

@ FAT非常感謝:)找到這真的很有用 – yogeshmanjhi

最受歡迎。如果我的答案似乎有用，我希望你也會讚不絕口。謝謝〜 – FAT

@ FAT upvoted並接受，作爲一個答案，謝謝很多:) – yogeshmanjhi

你把你的底導航的活動，並與任何你想要填補它，那麼你用這個

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; 
}

現在就看你做任何你想要選擇一些項目時，例如當搜索項目中選擇可以顯示搜索部分和其他時隱藏項目被選中。

來源

2017-06-04 07:20:14 Reza

@ Alireza我應該使用三個活動或使用三個單獨的片段來顯示每個標籤的詳細信息 – yogeshmanjhi

@ Alireza我已經實現了您建議的代碼只是想知道哪一個我應該用旁邊來顯示細節片段或activities.Thanks – yogeshmanjhi

片段！您使用包含底部導航和包含片段的框架佈局的活動，然後我們用戶單擊某個選項卡以在該容器中顯示片段。 – Reza

如果你想要一個BottomBar here's one的庫。您必須通過單擊該底欄項目來控制SearchBar的可見性。如果你正在嘗試實現你自己的搜索欄然後看看這個鏈接link1 link2

來源

2017-06-04 07:33:51 MrCurious

@ Nikhya感謝鏈接。我應該使用三個片段或三個活動來顯示標籤的細節 – yogeshmanjhi

使用三個片段與查看傳呼機，這樣你會看起來像WhatsApp/Instagram。由於ViewPager，您可以滑動thos片段。你可以更多的查看ViewPager – MrCurious

@ Nikhya謝謝很多希望這會有所幫助 – yogeshmanjhi

標籤的概念是，你必須有一個MainActivity，它將處理讓我們說3個片段。使用@Alireza建議的代碼，您將處理碎片之間的更改。請查看如何實現Tabs（like this one here）的教程。之後，在您的「SearchFragment.java」中，您將根據您的搜索欄以及下面的回收站視圖或您希望的任何內容來相應地構建XML。建議：使用片段時，一定要有Context mContext = getActivity（）;首先定義，因爲它會更容易實現所有功能。

*爲您實現底部的標籤效果，你可以移動 android.support.design.widget.TabLayout 到屏幕底部

來源

2017-06-04 07:43:30

@ Razvan非常感謝你的建議將嘗試這個 – yogeshmanjhi

如何創建類似於instagram的底部導航欄

回答

相關問題