অ্যান্ড্রয়েড নতুন নীচে নেভিগেশন বার বা নীচে নেভিগেশনভিউ


133

নতুন নির্দেশিকাটি প্রকাশিত হয়েছে এবং google photosসর্বশেষ অ্যাপ্লিকেশনটিতে ব্যবহৃত হয়েছে Saw নতুন নীচে নেভিগেশন বার কীভাবে ব্যবহার করবেন সে সম্পর্কে কোনও ধারণা নেই। নতুন সমর্থন লিবের মাধ্যমে দেখুন, কোনও সীসা খুঁজে পাননি।

এখানে চিত্র বর্ণনা লিখুন

কোনও অফিসিয়াল নমুনা খুঁজে পাচ্ছেন না।

নতুন বটম বারটি কীভাবে ব্যবহার করবেন? কোনও কাস্টমাইজ করতে চাই না।


: এই পরিদর্শন stackoverflow.com/questions/36019986/...
Fartab

আপনি আমার উত্তরটি একবার দেখে নিতে পারেন: stackoverflow.com/a/44967021/2412582
প্রশান্ত

উত্তর:


175

আমি মনে করি আপনি এটি খুঁজছেন হতে পারে।

শুরু করার জন্য এখানে একটি দ্রুত স্নিপেট রয়েছে:

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

এখানে রেফারেন্স লিঙ্ক।

https://github.com/roughike/BottomBar

নতুন প্রকাশের সম্পাদনা করুন।

নীচে নেভিগেশন ভিউ কিছু সময়ের জন্য উপাদান নকশা নির্দেশিকাতে ছিল তবে এটি আমাদের অ্যাপ্লিকেশনগুলিতে প্রয়োগ করা আমাদের পক্ষে সহজ ছিল না। কিছু অ্যাপ্লিকেশন তাদের নিজস্ব সমাধান তৈরি করেছে, অন্যরা কাজটি পেতে তৃতীয় পক্ষের ওপেন সোর্স লাইব্রেরিতে নির্ভর করে। এখন নকশা সমর্থন লাইব্রেরিতে এই নীচে নেভিগেশন বারের সংযোজনটি দেখছে, আসুন আমরা কীভাবে এটি ব্যবহার করতে পারি তার একটি ঝাঁকুনি নেওয়া যাক!

ব্যবহারবিধি ?

শুরু করতে আমাদের আমাদের নির্ভরতা আপডেট করতে হবে!

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

সম্পাদনা করুন: অ্যান্ড্রয়েডএক্স ব্যবহার করে আপনাকে কেবল নীচে নির্ভরতা যুক্ত করতে হবে।

implementation 'com.google.android.material:material:1.2.0-alpha01'

বিন্যাস

<?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>

আপনি যদি এর পদ্ধতিগুলি এবং এটি কীভাবে কাজ করে সে সম্পর্কে আরও পড়তে চান তবে এটি পড়ুন।

অবশ্যই এটি আপনাকে সাহায্য করবে।


নমুনার নীচের অংশটি এখনও নিজের দ্বারা কাস্টমাইজ করুন, অ্যান্ড্রয়েড লিব ব্যবহারের যে কোনও উপায়েই। আমি ভেবেছিলাম এটি সমর্থন শোধ করতে পারে। না এখনও প্রকাশ্যে?
zjywill

@ জাজ্যুইল এটি কাস্টমাইজ করা হয়নি তবে এটি আমাদের অ্যাপে অফিশিয়াল বটম নেভিগেশন বার কার্যকারিতা ব্যবহার করার উপায়। শুধু এই কোড চেষ্টা করুন।
জে রাঠোদ আরজে

1
আমি আপনাকে মোটামুটি নীচের বারটি ব্যবহার করার পরামর্শ দেব না যেহেতু এপিআই পুরোপুরি কার্যকর করা হয়নি এবং আমি রেন্ডারিংয়ের সমস্যায় পড়েছি। রানটাইমের সময় আপনি আইকনটি পরিবর্তন করতে পারবেন না এবং এটি বোতামগুলির পটভূমির জন্য আমি যে রঙগুলি সেট করেছি তা উপেক্ষা করে চলেছে।
অ্যালন কোগান

দয়া করে উত্তর দিন যে আমি কীভাবে ইতিহাস সংরক্ষণ করতে পারি
মিতুল গোটী

1
এম শিফটিংমডে জাভা প্রতিবিম্ব আমাকে সাহায্য করেছে! আমি জানি না যে তারা এই ক্ষেত্রটি প্রকাশ না করে কী চিন্তা করছে
কলা ড্রয়েড

48

আপনি ব্যবহার করা উচিত BottomNavigationView v25 অ্যান্ড্রয়েড সাপোর্ট লাইব্রেরী থেকে। এটি অ্যাপ্লিকেশনের জন্য একটি আদর্শ নীচে নেভিগেশন বারের প্রতিনিধিত্ব করে।

এখানে মিডিয়ামের একটি পোস্ট যা ধাপে ধাপে গাইড রয়েছে: https://medium.com/@hitherejoe/exploring-the-android-design-support-library-bottom-navication-drawer-548de699e8e0#.9vmiekxze


2
stackoverflow.com/questions/40153888/… হ্যালো ম্যাক্সিম .. আমি এটি প্রয়োগ করেছি, তবে তা প্রদর্শিত হচ্ছে না ..
সাগর চাওয়াদা

@ সাগরচাদা আপনি এই পোস্টটি
মাকসিম তুরাইভ

5
@ড্রয়েডেভ কারণ হ'ল যেদিন এই উত্তর পোস্ট করা হয়েছিল সেদিন বটমনাভিগেশনভিউ প্রকাশ হয়েছিল। এর আগে কেবল তৃতীয় পক্ষের সমাধানগুলি পাওয়া যেত।

আপনি কি জানেন যে আপনি এটির সাথে অ্যাডাপ্টারের সাহায্যে কাস্টম ভিউগুলি করতে পারেন?
রাদু

1
@ অ্যালান, দেখে মনে হচ্ছে বটমন্যাভিগেশনভিউটি সমর্থন লাইব্রেরির একটি অংশ যা নূন্যতম সমর্থিত এপিআই লেভেল 9, তাই আমার ধারণা এটি কাজ করবে। আপনি এখনও এটি 100% নিশ্চিত হওয়ার জন্য এমুলেটরটিতে পরীক্ষা করতে পারেন।
মাকসিম তুরাইভ

17

আমার আসল উত্তরটি এর সাথে ডিল হয়েছে BottomNavigationView, তবে এখন একটি আছে BottomAppBar। আমি বাস্তবায়নের লিংক দিয়ে এর জন্য শীর্ষে একটি বিভাগ যুক্ত করেছি।

নীচে অ্যাপ বার

BottomAppBarএকটি ফ্লোটিং ক্রিয়া বোতাম সমর্থন করে।

এখানে চিত্র বর্ণনা লিখুন

এখান থেকে চিত্র । সেট আপ করতে সহায়তার জন্য ডকুমেন্টেশন এবং এই টিউটোরিয়ালটি দেখুন BottomAppBar

নীচে নেভিগেশন দেখুন

নীচের পুরো উদাহরণটি দেখায় যে কীভাবে নীচের ন্যাভিগেশন দেখুন প্রশ্নের চিত্রের অনুরূপ similar ডকুমেন্টেশনে নীচে নেভিগেশনও দেখুন ।

এখানে চিত্র বর্ণনা লিখুন

নকশা সমর্থন লাইব্রেরি যুক্ত করুন

অন্যান্য সমর্থন লাইব্রেরি জিনিসগুলির পাশে আপনার অ্যাপ্লিকেশনটির বিল্ড.গ্রেড ফাইলটিতে এই লাইনটি যুক্ত করুন ।

implementation 'com.android.support:design:28.0.0'

বর্তমান যা আছে তার সাথে সংস্করণ নম্বরটি প্রতিস্থাপন করুন।

ক্রিয়াকলাপ বিন্যাস তৈরি করুন

আমরা বিন্যাসে কেবলমাত্র বিশেষ জিনিসটি যুক্ত করেছি BottomNavigationView। আইকন এবং পাঠ্যের ক্লিক করা হলে এর রঙ পরিবর্তন করতে, আপনি selectorসরাসরি রঙ নির্দিষ্ট করার পরিবর্তে একটি ব্যবহার করতে পারেন । এখানে সরলতার জন্য বাদ দেওয়া হয়েছে।

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>

লক্ষ্য করুন যে আমরা layout_alignParentBottomএটিকে আসলে নীচে রাখতাম।

মেনু আইটেম সংজ্ঞায়িত করুন

নীচের নেভিগেশন ভিউটির জন্য উপরের এক্সএমএল উল্লেখ করা হয়েছে bottom_nav_menu। এটি আমাদের দৃষ্টিতে প্রতিটি আইটেমকে সংজ্ঞায়িত করে। আমরা এখন এটি তৈরি করব। আপনাকে যা করতে হবে তা হ'ল একটি মেনু রিসোর্স যুক্ত করুন ঠিক তেমন কোনও অ্যাকশন বার বা সরঞ্জামদণ্ডের জন্য।

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>

আপনার প্রকল্পে আপনাকে উপযুক্ত আইকন যুক্ত করতে হবে। আপনি ফাইল> নতুন> চিত্র সম্পদ এ গিয়ে আইকন ধরণ হিসাবে অ্যাকশন বার এবং ট্যাব আইকনগুলি বেছে নিলে এটি খুব বেশি কঠিন নয় ।

নির্বাচিত শ্রোতা একটি আইটেম যুক্ত করুন

এখানে বিশেষ কিছু ঘটছে না। আমরা আমাদের ক্রিয়াকলাপের onCreateপদ্ধতিতে কেবল নীচে নেভিগেশন বারে একটি শ্রোতা যুক্ত করি ।

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

আরও সাহায্য দরকার?

নিম্নলিখিত ইউটিউব ভিডিওটি দেখে এটি কীভাবে করতে হবে তা শিখেছি। কম্পিউটার ভয়েসটি কিছুটা অদ্ভুত, তবে বিক্ষোভটি খুব স্পষ্ট।


16

এটি অর্জন করতে আপনি কাস্টম ট্যাব দর্শন সহ ট্যাব লেআউটটিও ব্যবহার করতে পারেন।

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

}

সম্পূর্ণ নমুনা প্রকল্পটি ডাউনলোড করুন


8
গুগল ডিজাইনের নির্দেশিকা অনুসারে, ট্যাবগুলির মধ্যে স্যুইচ করার জন্য কারও একটি সোয়াইপ মোশন ব্যবহার করা উচিত নয়। google.com/design/spec/compferences/…
কার্ল বি

1
আপনি যদি লেখক যে আচরণগুলি লিখেছেন তার জন্য ক্রেডিট রাখেন তবে দুর্দান্ত হবে :)
নিকোলা দেশপোটোস্কি

13

গুগল ডিজাইন সমর্থন লাইব্রেরির 25.0.0 সংস্করণ পরে বটমনাভিগেশন ভিউ চালু করেছে। তবে এটি নিম্নলিখিত সীমাবদ্ধতার সাথে এসেছে:

  1. আপনি শিরোনাম এবং কেন্দ্রের আইকন সরাতে পারবেন না।
  2. আপনি শিরোনামের পাঠ্যের আকার পরিবর্তন করতে পারবেন না।
  3. ইওউসুয়েচিস্নি̶়ি̶তী ̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶ ̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶ ̶̶̶̶̶̶̶̶̶̶̶̶̶̶̶
  4. এটিতে নীচে নেভিগেশনবিভাবার নেই: তাই কর্ডিনেটর লেআউটের মাধ্যমে FAB বা স্নাকবারের সাথে কোনও সংহতকরণ নেই।
  5. প্রতিটি মেনু আইটেম ফ্রেমলআউটের বিশুদ্ধ এক্সটেনশান যাতে এটির কোনও সুন্দর চেনাশোনা প্রভাব প্রকাশ করে না

সুতরাং বটমনাভিগেশনভিউয়ের এই মুষ্টি সংস্করণটি আপনি যে সর্বোচ্চটি করতে পারেন তা হ'ল: (কোনও প্রতিবিম্ব বা নিজের দ্বারা লিব প্রয়োগ না করে)।

এখানে চিত্র বর্ণনা লিখুন

সুতরাং, আপনি যদি এর কোনও চান। আপনি রুটাইক / বটমবারের মতো তৃতীয় অংশের লাইব্রেরিটি ব্যবহার করতে পারেন বা নিজের দ্বারা লিবটি প্রয়োগ করতে পারেন।


4
কেবল রেকর্ডের জন্য, আপনি পটভূমির রঙ পরিবর্তন করতে পারেন এবং আপনি শিরোনাম পাঠ্যের আকার পরিবর্তন করতে পারেন (আমি যে পদ্ধতিটি ব্যবহার করছি তার সাথে আমি অন্যান্য সমস্যা পেয়েছি)। অ্যান্ড্রয়েড ব্যবহার করে: ব্যাকগ্রাউন্ড = "এক্সএক্সএক্সএক্স" এর ব্যাকগ্রাউন্ডের রঙ পরিবর্তন করবে, তবে আপনি যদি app:itemBackground="xxx"সমস্ত আইটেমও এই রঙটি ভাগ করে নির্দিষ্ট করেন এবং আপনি ব্যাকগ্রাউন্ড দেখতে পাবেন না (যদি না আপনি স্বচ্ছতা যোগ করেন তবে এখনও, সমস্ত আইকন একই রঙ ভাগ করে না) । খুব লম্পট যে অ্যান্ড্রয়েড দলটি এমন একটি কৃপণ উপাদান প্রকাশ করেছে ... সর্বদা 75% সম্পূর্ণ, অতিরিক্ত মাইল মিস করে যা এটি দুর্দান্ত করে তুলবে।
মার্টিন মার্কনকিনি

আমরা পটভূমির রঙ পরিবর্তন করতে পারি
স্টিভ

হাই, আমি একই lib এবং এর কাজ সূক্ষ্ম ব্যবহার করছি কিন্তু এখানে আমি নীচের বারের মাঝে শিরোনাম ছাড়াই কেবল আইকন প্রদর্শন করতে চাই। এটা কি সম্ভব? এবং আমি ইতিমধ্যে মেনু আইটেমগুলিতে খালি রাখার চেষ্টা করেছি কিন্তু এখনও আইকনগুলি কেবল শীর্ষে প্রদর্শিত হচ্ছে। নীচে বারের মাঝে শিরোনাম ছাড়া আমি কীভাবে কেবল আইকনগুলি দেখাতে পারি?
ব্যবহারকারী512

হাই, দয়া করে এই জন্য আমার উত্তর এখানে চেক stackoverflow.com/questions/40183239/...
Sanf0rd

@ মার্টিনমারকনসিনি আপনি নীচের নেভিগেশন দর্শনের জন্য পাঠ্য আকারটি কীভাবে পরিবর্তন করলেন?
পনসুয়াম্বু ভেল্লাদুরাই

10

যেমন সানফ0 তম উল্লেখ করেছে, গুগল ডিজাইন সমর্থন লাইব্রেরি সংস্করণ 25.0.0 এর অংশ হিসাবে বটমনাভিগেশনভিউ চালু করেছে । তিনি উল্লেখ করেছেন এমন সীমাবদ্ধতাগুলি বেশিরভাগ ক্ষেত্রেই সত্য, আপনি ব্যাকগ্রাউন্ডের রঙ এবং এমনকি টেক্সটের রঙ এবং আইকন রঙের রঙ পরিবর্তন করতে পারেন। আপনি 4 টিরও বেশি আইটেম যুক্ত করার সময় এটিতে একটি অ্যানিমেশনও থাকে (দুঃখের বিষয় এটি ম্যানুয়ালি সক্ষম বা অক্ষম করা যায় না)।

আমি উদাহরণ এবং এটি সহ একটি সংগ্রহশালা নিয়ে একটি বিশদ টিউটোরিয়াল লিখেছিলাম, যা আপনি এখানে পড়তে পারেন: https://blog.autsoft.hu/now-you-can-use-tott-bottom-navifications-view-in-the- ডিজাইন-সমর্থন-লাইব্রেরি /


এর সংক্ষেপে

এগুলি আপনার অ্যাপ স্তরে যুক্ত করতে হবে build.gradle:

compile 'com.android.support:appcompat-v7:25.0.0'  
compile 'com.android.support:design:25.0.0'

আপনি এটি আপনার লেআউটে এতে অন্তর্ভুক্ত করতে পারেন:

<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" />

আপনি মেনু রিসোর্সের মাধ্যমে আইটেমগুলি নির্দিষ্ট করতে পারেন:

<?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>

এবং আপনি রঙের তালিকা হিসাবে রঙ এবং পাঠ্যের রঙ সেট করতে পারেন, সুতরাং বর্তমানে নির্বাচিত আইটেমটি হাইলাইট করা হয়েছে:

<?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>

অবশেষে, আপনি অন-নেভিগেশন আইটেমসিলেক্টডলাইজনারের সাহায্যে আইটেমগুলির নির্বাচন পরিচালনা করতে পারেন:

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

1
অসাধারণ! পরামর্শ - অ্যাপ্লিকেশন সরান: আইটেমব্যাকগ্রাউন্ড = "@ রঙ / ডার্কগ্রি" নেটিভ সার্কুলার রিপল প্রভাবটি পেতে ive
গার্ক

8

অন্যান্য বিকল্প লাইব্রেরি আপনি চেষ্টা করতে পারেন: - https://github.com/Ashok- ভার্মা / নীচে নেভিগেশন

<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();

1
অনুরূপ অন্য একটি গ্রন্থাগার হ'ল এএইচবটম নেভিগেশন: github.com/aurelhubert/ahbottomnavigation
ninjahoahong

3

আমি মনে করি এটিও দরকারী।

টুকিটাকি

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

লিংক

https://github.com/pocheshire/BottomNavigationBar

এটি https://github.com/roughike/ বটমবার সি # তে জ্যামারিন বিকাশকারীদের জন্য পোর্ট করেছে


3

আমি একটি ব্যক্তিগত ক্লাস তৈরি করেছি যা গ্রিডভিউ এবং মেনু সংস্থান ব্যবহার করে:

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

your_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>

এবং একটি কাস্টম বিন্যাস আইটেম 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>

আপনার প্রধান কার্যকারিতা ভিতরে ব্যবহার:

BottomBar bottomBar = new BottomBar(R.id.YourGridView,R.menu.your_menu, mOnClickListener);

এবং

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

এবং লেআউট_একটিভিটি.এক্সএমএল

<?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>

3

ডিজাইন সমর্থন লাইব্রেরির 25 সংস্করণে একটি নতুন অফিসিয়াল বটমনাভিশনভিউ রয়েছে is

https://developer.android.com/references/android/support/design/widget/ নীচে নেভিগেশনভিউ html গ্রেডে যোগ করুন compile 'com.android.support:design:25.0.0'

এক্সএমএল

<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" />

1

এই লাইব্রেরি, নীচে নেভিগেশনভিউএক্স , গুগলের বটমন্যাভিগেশন ভিউ প্রসারিত করে। গুগলের লাইব্রেরিটি আপনি যেভাবে চান তা নীচের নেভিগেশন বারে কাস্টমাইজ করতে পারেন। আপনি শিফিং মোডটি অক্ষম করতে পারবেন, আইকন এবং পাঠ্যের দৃশ্যমানতা পরিবর্তন করুন এবং আরও অনেক কিছু। অবশ্যই এটি চেষ্টা করে দেখুন।


0

আমি এই গিথব পোস্টটি উল্লেখ করেছি এবং নীচের ট্যাব বারের পৃষ্ঠাগুলির three layoutsজন্য আমি সেট করেছি three fragment

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")

    );

ব্যাজ গণনা সেট করতে:

  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;


    }

0

উপরে বর্ণিত উত্তর অনুসারে আপনি লেআউটগুলি তৈরি করতে পারেন যদি কেউ কোটলিনে এটি ব্যবহার করতে চান: -

 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
}

তারপরে oncreate এ আপনি উপরের শ্রোতাদের আপনার দর্শনে সেট করতে পারেন

   mDataBinding?.navigation?.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener)

-1
<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" />

নেভিগেশন.এক্সএমএল (মেনুর ভিতরে)

<?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()পদ্ধতি,

BottomNavigationView navigation = (BottomNavigationView)findViewById(R.id.navigation);
//Dont forgot this line     
BottomNavigationViewHelper.disableShiftMode(navigation);

এবং নিচের মত ক্লাস তৈরি করুন।

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);
        }
    }
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.