在 Xamarin Android 中自定义 Tab 文本颜色、堆叠颜色和滑动功能? [英] customizing Tab text color, stacked color, and swipe functionality in Xamarin Android?

问题描述

我在 xamarin android 中有三个选项卡，我使用选项卡主机来创建这些选项卡.现在，我想更改这些选项卡中的文本颜色，并且我想像 Xamarin Forms 中的选项卡页面一样使用滑动效果.我怎样才能做到这一点?如果需要，也请告诉我图书馆吗?

I have three tabs in xamarin android, I have used tab Host to create those tabs. Now, I want to change the text color in those tabs, and I want to use the swipe effect just like the Tabbed Page in Xamarin Forms. How can I achieve this? Please do tell me the library also ,if required?

推荐答案

我想更改这些选项卡中的文本颜色，并且我想像 Xamarin Forms 中的选项卡页面一样使用滑动效果

I want to change the text color in those tabs, and I want to use the swipe effect just like the Tabbed Page in Xamarin Forms

您可以使用 TabLayout，用法如下这:

You could use TabLayout, Usage like this :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

   <android.support.design.widget.TabLayout
       android:layout_height="wrap_content"
       android:layout_width="match_parent"
       android:id="@+id/tablayout"
       app:tabTextColor="@color/colorPrimary"
       app:tabSelectedTextColor="@color/colorAccent"
       app:tabIndicatorColor="@android:color/holo_orange_light">

      <android.support.design.widget.TabItem
          android:text="tab 1"/>
      <android.support.design.widget.TabItem
          android:text="tab 2"/>
      <android.support.design.widget.TabItem
          android:text="tab 3"/>

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

 </LinearLayout>

改变文字颜色的属性:

 app:tabTextColor         -->   The default text color to be applied to tabs.
 app:tabSelectedTextColor -->   The text color to be applied to the currently selected tab. 
 app:tabIndicatorColor    -->   Color of the indicator used to show the currently selected tab. 

效果像这个.

像 Xamarin Forms 中的标签页一样使用滑动效果

use the swipe effect just like the Tabbed Page in Xamarin Forms

在 Xamarin.Forms 中，tabs 与 Page 相关联，实际上当它在原生 Android 中呈现时，它与 ViewPager.所以如果你想实现滑动效果功能，你必须自己编写代码.有关更多详细信息，您可以阅读 文档.

In Xamarin.Forms, tabs is associated with Page, actually when it render in native Android, it was associated with ViewPager. So if you want implement the swipe effect feature, you have to write the code by yourself. For more details, you could read the document.

要使用 TabLayout，您必须添加 Xamarin.Android.Support.v4 和 Xamarin.Android.Support.Design nuget 包.

To use TabLayout, you have to add Xamarin.Android.Support.v4 and Xamarin.Android.Support.Design nuget package.

编辑 2 ；

这是一个关于实现滑动效果的简单演示:

Here is a simple demo about implement the swipe effect :

public class MainActivity : AppCompatActivity
{
    private List<Android.Support.V4.App.Fragment> mFragments = new List<Android.Support.V4.App.Fragment>();
    private List<string> mTabTitles = new List<string>();
    protected override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);

        SetContentView(Resource.Layout.Main);
        TabLayout tabLayout = FindViewById<TabLayout>(Resource.Id.tablayout);
        ViewPager viewPager = FindViewById<ViewPager>(Resource.Id.view_pager);

        initTab();
        mFragments.Add(new Fragment1());
        mFragments.Add(new Fragment1());
        mFragments.Add(new Fragment1());
        mFragments.Add(new Fragment1());

        viewPager.Adapter = new ViewPagerAdapter(SupportFragmentManager, mFragments,mTabTitles);
        tabLayout.SetupWithViewPager(viewPager);
    }

    private void initTab()
    {
        for (int i = 1; i < 5; i++)
        {
            mTabTitles.Add("Tab" + i);
        }
    }
}

public class ViewPagerAdapter : FragmentPagerAdapter
{
    private List<string> mTabTitles;
    private static  int FRAGMENT_COUNT = 4;

    public ViewPagerAdapter(Android.Support.V4.App.FragmentManager fragmentManager, List<Android.Support.V4.App.Fragment> fragments, List<string> tabTitles):base(fragmentManager)
    {
        mTabTitles = tabTitles;
    }

    public override Android.Support.V4.App.Fragment GetItem(int position)
    {
        Fragment1 testFragment = new Fragment1();
        return testFragment;
    }

    public override int Count => FRAGMENT_COUNT;

    public override ICharSequence GetPageTitleFormatted(int position)
    {
        return new Java.Lang.String(mTabTitles[position]);
    }
}

axml 文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  <android.support.design.widget.TabLayout
      android:layout_height="wrap_content"
      android:layout_width="match_parent"
      android:id="@+id/tablayout"
    >
  </android.support.design.widget.TabLayout>
   <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
   </android.support.v4.view.ViewPager>

</LinearLayout>

效果.

编辑 3:

在我的演示中，Fragment 应该使用 Android.Support.V4.App.Fragment，代码如下:

In my demo, Fragment should use Android.Support.V4.App.Fragment, code like this :

public class Fragment1 : Android.Support.V4.App.Fragment
{
    public override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);

        // Create your fragment here
    }

    public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
    {
        // Use this to return your custom view for this Fragment
        return inflater.Inflate(Resource.Layout.YourFragment, container, false);

        return base.OnCreateView(inflater, container, savedInstanceState);
    }
}

这篇关于在 Xamarin Android 中自定义 Tab 文本颜色、堆叠颜色和滑动功能?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！