Xamarin forms Android how We change Tabbed Page Ic

问题:

Xamarin forms Android how We change Tabbed Page Icon Size. I have Using AppCompact Themes and I want Increase Tabbed Page icon size in Tabbar.axaml

回答1:

You can create a Custom renderer and change the size of icon in the native platform. Actually you can override the whole tab's layout.

For example, in PCL first create a class inherit from TabbedPage:

public class MyTabbedPage : TabbedPage
{
}

Then create its renderer in Android project for example like this:

[assembly: ExportRenderer(typeof(MyTabbedPage), typeof(MyTabbedPageRenderer))]

namespace YourNameSpace.Droid
{
    public class MyTabbedPageRenderer : TabbedPageRenderer
    {
        protected override void SetTabIcon(TabLayout.Tab tab, FileImageSource icon)
        {
            base.SetTabIcon(tab, icon);

            tab.SetCustomView(Resource.Layout.mytablayout);
            var imageview = tab.CustomView.FindViewById<ImageView>(Resource.Id.icon);
            imageview.SetBackgroundDrawable(tab.Icon);
        }
    }
}

The layout I created is like this:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  <ImageView
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:scaleType="fitCenter"
        android:id="@+id/icon"
        android:layout_gravity="center_horizontal" />
</LinearLayout>

As you can see, I set the size directly in the axml file.

When you want to use this custom TabbedPage, you can for example code like this:

<local:MyTabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:TabbedPageForms"
             x:Class="TabbedPageForms.MainPage">

    <local:TodayPage Title="Today" Icon="hamburger.jpg" />

    <local:SchedulePage Title="Schedule" Icon="hamburger.jpg" />
</local:MyTabbedPage>

Code behind:

public partial class MainPage : MyTabbedPage
{
    public MainPage()
    {
        InitializeComponent();
    }
}