Xamarin.Forms上的选项卡式页面自定义呈现器 [英] Tabbed page custom renderer on Xamarin.Forms

问题描述

如何使用选项卡式页面自定义呈现器实现屏幕截图(&totaleRegioni省级&)中类似顶部栏的效果？我现在使用的是由三种不同标签组成的假标签。

我需要更改选项卡的字体系列、字体大小和填充。

推荐答案

如果要更改选项卡页的字体，可以使用自定义呈现器将其重置。

MyTabbedPageRenderer.cs：

[assembly: ExportRenderer(typeof(MainPage), typeof(MyTabbedPageRenderer))]
namespace TabbedPageDemo.Droid
{
class MyTabbedPageRenderer : TabbedPageRenderer
{
    public MyTabbedPageRenderer(Context context) : base(context)
    {

    }
    protected override void OnElementChanged(ElementChangedEventArgs<TabbedPage> e)
    {
        base.OnElementChanged(e);

        if (e.NewElement == null || e.OldElement != null)
            return;

        TabLayout tablayout = (TabLayout)ViewGroup.GetChildAt(1);
        Android.Views.ViewGroup vgroup = (Android.Views.ViewGroup)tablayout.GetChildAt(0);
        for (int i = 0; i < vgroup.ChildCount; i++)
        {
            Android.Views.ViewGroup vvgroup = (Android.Views.ViewGroup)vgroup.GetChildAt(i);
            Typeface fontFace = Typeface.CreateFromAsset(this.Context.Assets, "Trashtalk.ttf");
            for (int j = 0; j < vvgroup.ChildCount; j++)
            {
                Android.Views.View vView = (Android.Views.View)vvgroup.GetChildAt(j);
                if (vView.GetType() == typeof(Android.Support.V7.Widget.AppCompatTextView) || vView.GetType() == typeof(Android.Widget.TextView))
                {
                    //here change textview style
                    TextView txtView = (TextView)vView;
                    txtView.TextSize = 14f;
                    txtView.SetTypeface(fontFace, TypefaceStyle.Normal);
                }
            }
        }
    }
  }
}

例如，我使用选项卡式页面模板项目。

更新：

在资源中创建字体文件夹。在其中添加.ttf文件和myfont.xml。

<?xml version="1.0" encoding="utf-8" ?>
<font-family xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto">
 <font android:font="@font/Samantha"
          android:fontStyle="normal"
          android:fontWeight="400"
          app:font="@font/Samantha"
          app:fontStyle="normal"
          app:fontWeight="400"/>

</font-family>

Style.xml

<style name="MyTabLayout" parent="Base.Widget.Design.TabLayout">
<item name="tabTextAppearance">@style/MyTabTextAppearance</item>
</style>

<style name="MyTabTextAppearance" parent="TextAppearance.AppCompat.Button">
<item name="android:textSize">20sp</item>
<item name="android:fontFamily">@font/myfont</item>
</style>

应用Tabbar.xml中的样式。

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.TabLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:tabIndicatorColor="@android:color/white"
app:tabGravity="fill"
app:tabMode="fixed" 
style="@style/MyTabLayout"/>

这篇关于Xamarin.Forms上的选项卡式页面自定义呈现器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！