android - ডিজাইন সমর্থন লাইব্রেরির ট্যাবলয়েটে ট্যাবগুলির মধ্যে বিভাজকটি কীভাবে সেট করবেন?




androiddesignsupport (6)

আমি v7-appcompat লাইব্রেরির নতুন android.support.design.widget.TabLayout ব্যবহার করছি, এবং একটি সমস্যা পেয়েছি, ট্যাবগুলির মধ্যে বিভাজক সেট করার কোনও উপায় নেই, আছে কিনা তা জানেন না।

আমি পেজার অ্যাডাপ্টারটি সফলভাবে কনফিগার করেছি এবং ট্যাবগুলি দেখতে ভাল লাগছে তবে ট্যাবগুলির মধ্যে বিভাজকটি সেট করতে পারে না।

আমি এই ধরণের ট্যাবগুলি চাই

Tab1 | Tab2 | Tab3

তবে বর্তমানে এটি প্রদর্শিত হচ্ছে

Tab1  Tab2  Tab3

আমার এক্সএমএল হয়

<android.support.design.widget.CoordinatorLayout 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.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" >

        <include layout="@layout/toolbar" />

        <android.support.design.widget.TabLayout
            android:id="@+id/tablayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/shape_tabbar_background"
            app:tabIndicatorColor="@android:color/white"
            app:tabIndicatorHeight="4dp" />
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</android.support.design.widget.CoordinatorLayout>

আমি এটির মাধ্যমে ট্যাব যুক্ত করছি

viewPager = (ViewPager) findViewById(R.id.viewpager);
    viewPager.setOffscreenPageLimit(2);
    adapter = new TabAdapterLoginActivity(getSupportFragmentManager(),
            titles);
    viewPager.setAdapter(adapter);
    tabLayout = (TabLayout) findViewById(R.id.tablayout);
    tabLayout.setupWithViewPager(viewPager);

আমি মনে করি না এটি সম্ভব হয় যদিও ট্যাব তৈরির সময় আপনি একটি কাস্টমভিউ নির্দিষ্ট না করে এবং উদাহরণস্বরূপ আপনার বিভাজক যুক্ত করেন; একটি টেক্সটভিউ এবং আপনি স্পষ্টভাবে TextView.setCompoundDrawablesWithIntrinsicBounds(0, 0,(int)id_of_a_divider, 0);

যেমন আপনি এটির প্রথম Tab সনাক্ত করার চেষ্টা করছেন,

if(firstTab){
    tabLayout.getTabAt(0).getCustomView()
    .setCompoundDrawablesWithIntrinsicBounds(0, 0,(int)id_of_a_divider, 0);
    //some little casting
}else if(lastTab){
  //dont get any
   tabLayout.getTabAt(index).getCustomView()
    .setCompoundDrawablesWithIntrinsicBounds(0,0,0, 0);
 else{
    //the rest takes two sides,
     tabLayout.getTabAt(index).getCustomView()
    .setCompoundDrawablesWithIntrinsicBounds((int)id_of_a_divider
       , 0,(int)id_of_a_divider, 0);

আমি আশা করি আপনি, আমার ধারণা পেতে


এটি চেষ্টা করুন, আশা করি এটি আপনার পক্ষে ভাল কাজ করে।

tab_activity.xml

<TabHost
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >
            </TabWidget>

            <View
                android:layout_width="match_parent"
                android:layout_height="2dp"
                android:background="@color/edt_footer_bg" />

            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginTop="15dp"
                android:background="@android:color/transparent" >
            </FrameLayout>
        </LinearLayout>
    </TabHost>

home_tab.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    xmlns:mytextview="http://schemas.android.com/apk/res/com.bne"
    android:layout_height="50dp"
    android:layout_marginRight="2dp"
    android:background="@color/app_bg_inner"
    android:gravity="center"
    android:padding="10dp" >

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@drawable/tab_selector"
        android:textSize="@dimen/txt_12"
        mytextview:txt_custom_font="@string/RobotoRegular" />

</LinearLayout>

স্রোতের জন্য সেরা নয় তবে বিকল্প উপায়।

মেইন.এক্সএমএল এ

<android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    style="@style/Base.Widget.Design.TabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/master_color"
    app:elevation="0dp"
    app:tabMode="scrollable"
    app:tabPaddingEnd="2dp"
    app:tabPaddingStart="0dp"
    app:tabSelectedTextColor="@color/white"
    app:tabTextColor="#82c6e6" />

আমি টুকরোটি ব্যবহার করছি এবং onCreate() মতো করে করছি

if (savedInstanceState == null) {
    replaceFragment(fragmentOne);
}

ট্যাব সেট করুন

ব্যক্তিগত অকার্যকর সেটআপ ট্যাবলয়আউট () {

    fragmentOne = new FragmentOne();
    fragmentTwo = new FragmentTwo();

    allTabs.addTab(allTabs.newTab().setText("CURRENT YEAR"), true);
    allTabs.addTab(allTabs.newTab().setText("2015"));
    allTabs.addTab(allTabs.newTab().setText("2014"));
    allTabs.addTab(allTabs.newTab().setText("2013"));
    allTabs.addTab(allTabs.newTab().setText("2012"));
    allTabs.addTab(allTabs.newTab().setText("2011"));

    //Hide Indicator
    allTabs.setSelectedTabIndicatorColor(getResources().getColor(android.R.color.transparent));
    //Set Custom tab Background
    for (int i = 1; i < allTabs.getTabCount(); i++) {
        TabLayout.Tab tab = allTabs.getTabAt(i);
        RelativeLayout relativeLayout = (RelativeLayout)
                LayoutInflater.from(getActivity()).inflate(R.layout.tab_layout, allTabs, false);
        tvTabText = (TextView) relativeLayout.findViewById(R.id.tab_title);
        View view = (View) relativeLayout.findViewById(R.id.deviderView);

        tvTabText.setText(tab.getText());
        tab.setCustomView(relativeLayout);

        if (i == 0) {
            view.setVisibility(View.GONE);
            tab.select();
        }
    }

}

tab_layout.xml

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- Tab title -->
    <TextView
        android:id="@+id/tab_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center_horizontal"
        android:padding="10dp"
        android:text="sdasd"
        android:textColor="@drawable/tab_item_selector"
        android:textSize="@dimen/text_size_normal"
        android:textStyle="bold" />

    <!-- Tab divider -->

    <View
        android:id="@+id/deviderView"
        android:layout_width="1dp"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:layout_marginBottom="15dp"
        android:layout_marginTop="15dp"
        android:background="@android:color/white"
        android:gravity="right" />

</RelativeLayout>

tab_item_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:color="@android:color/white" />
    <item android:state_focused="true" android:color="@android:color/white" />
    <item android:state_pressed="true" android:color="@android:color/white" />
    <item android:color="#82c6e6" />
</selector>

সর্বদা একটি alচ্ছিক উত্তর হিসাবে বিবেচনা করুন।


হাই আপনি যা করতে চেষ্টা করেছিলেন তা অনুসরণ হিসাবে অনুসরণ করতে পারেন: -

1-সাধারণ ট্যাবলআউট তৈরি করুন।

মোডটি 2-মোড করুন MODE_FIXED

এটিকে ফ্রেমলায়াউটে 2-যোগ করা এবং এর উপরে লিনিয়ার লেআউট দিগন্তীয় যুক্ত করুন।

আপনার ট্যাবগুলির সংখ্যা হিসাবে অনুভূমিক বিন্যাসে বোতামগুলি 3-যুক্ত করুন এবং প্রতিটি বোতামের জন্য বোতামগুলি আকারের লেআউট_ওয়াইট = 1 এর সমান করুন।

বোতামগুলির পটভূমি স্বচ্ছ করুন।

ভিউ বা ভিউয়ের মাধ্যমে দিগন্তীয় রৈখিক লেআউটে বোতামগুলির মধ্যে 3-স্পার্টেটর যুক্ত করুন এবং 0.5 ডিপি বা আপনি যা চান তার চেয়ে মোটা হিসাবে প্রস্থকে নির্দিষ্ট করুন।

4-আপনি বোতামগুলিতে ইয়ার ক্লিক যুক্ত করতে বা কোনও অপর ভিউতে বোতামটি পরিবর্তন করতে পারেন যা ক্লিকটি হ্যান্ডেল করে না তাই এর নীচে থাকা ট্যাবটি ক্লিক করতে পারে :) action

এটি কুরুচিপূর্ণ দ্রাবণ হতে পারে তবে এটি নিখুঁতভাবে কাজ করে এবং কাজটি করে

আপনি যদি নির্বাচিত ট্যাবের পটভূমি পরিবর্তন করতে চান তবে অন্য ইঙ্গিতটি আপনি ট্যাবলআউট শৈলীতে সূচককে হাইগ্যাট করতে পারেন যা ট্যাবলআউটের প্রকৃত উচ্চতার সমান।

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/transparent"
    android:orientation="vertical">


    <FrameLayout
        android:id="@+id/content_parent"

        android:layout_width="fill_parent"
        android:layout_height="fill_parent">


        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1"

            android:background="@android:color/transparent" />




        <android.support.design.widget.TabLayout
            android:id="@+id/sliding_tabs"
            style="@style/MyCustomTabLayout"
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:layout_gravity="bottom"
            android:background="#99888888"
            android:clickable="false"
            android:layoutDirection="rtl"

              />


        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="0.5dp"
            android:layout_gravity="bottom"
            android:layout_marginBottom="60dp"
            android:background="#60ffffff"></LinearLayout>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="60dp"
            android:layout_gravity="bottom|right"
            android:background="@android:color/transparent"
            android:orientation="horizontal">


            <Button
                android:id="@+id/button1"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:background="@android:color/transparent"
                android:clickable="true" />



            <LinearLayout
                android:layout_width="0.5dp"
                android:layout_height="60dp"
                android:background="#60ffffff"></LinearLayout>

            <Button
                android:id="@+id/button2"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:background="@android:color/transparent"
                android:clickable="true"

                />

            <LinearLayout
                android:layout_width="0.5dp"
                android:layout_height="60dp"
                android:background="#60ffffff"></LinearLayout>

            <Button
                android:id="@+id/button3"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:background="@android:color/transparent"
                android:clickable="true"

                />

            <LinearLayout
                android:layout_width="0.5dp"
                android:layout_height="60dp"
                android:background="#60ffffff"></LinearLayout>

            <Button
                android:id="@+id/button4"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:background="@android:color/transparent"
                android:clickable="true"

                />

            <LinearLayout
                android:layout_width="0.5dp"
                android:layout_height="60dp"
                android:background="#60ffffff"></LinearLayout>

            <Button
                android:id="@+id/button5"
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:background="@android:color/transparent"
                android:clickable="true"

                />

        </LinearLayout>

    </FrameLayout>

এবং এটি স্টাইলের জন্য

 <style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
        <item name="tabIndicatorColor">#50000000</item>
        <item name="tabTextAppearance">@style/MyCustomTabTextAppearance</item>
        <item name="tabIndicatorHeight">60dp</item>
        <item name="tabSelectedTextColor">#222222</item>

TabHost mTabHost.getTabWidget().setDividerDrawable(R.Color.blue);TabHost সেট করতে এই কোডটি ব্যবহার করার চেষ্টা করুন mTabHost.getTabWidget().setDividerDrawable(R.Color.blue);


TabLayout HorizontalScrollView এবং এটির প্রথম সন্তান TabLayout

তাই কেবলমাত্র ডিভাইডার যুক্ত করতে নীচের কোডটি ব্যবহার করুন

    View root = tabLayout.getChildAt(0);
    if (root instanceof LinearLayout) {
        ((LinearLayout) root).setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);
        GradientDrawable drawable = new GradientDrawable();
        drawable.setColor(getResources().getColor(R.color.separator));
        drawable.setSize(2, 1);
        ((LinearLayout) root).setDividerPadding(10);
        ((LinearLayout) root).setDividerDrawable(drawable);
    }

নীচে স্যাম্পল স্ক্রিন শট দেওয়া আছে

পর্দা 1

স্ক্রিন 2







androiddesignsupport