I am using tabbed page.
how to switch from a1.png to a2.png when I tap the menu?
I mean first menu is selected then the icon is a1.png if not then icon is a2.png
and remove the color in it.
I am using tabbed page.
how to switch from a1.png to a2.png when I tap the menu?
I mean first menu is selected then the icon is a1.png if not then icon is a2.png
and remove the color in it.
Hello,
Welcome to our Microsoft Q&A platform!
I mean first menu is selected then the icon is a1.png if not then icon is a2.png
For this function, try to custom a custom TabbedPage renderer and implement the TabLayout.IOnTabSelectedListener to override the related methods. Check the code:
[assembly: ExportRenderer(typeof(CustomTabbedPage), typeof(CustomTabbedPageRenderer))]
namespace TestApplication.Droid
{
public class CustomTabbedPageRenderer : TabbedPageRenderer, TabLayout.IOnTabSelectedListener
{
public CustomTabbedPageRenderer(Context context) : base(context)
{
}
void TabLayout.IOnTabSelectedListener.OnTabSelected(TabLayout.Tab tab)
{
if (tab == null)
{
return;
}
switch (tab.Text)
{
case "Tab 1":
tab.SetIcon(Resource.Drawable.selectedIcon);
break;
case "Tab 2":
tab.SetIcon(Resource.Drawable.selectedIcon);
break;
case "Tab 3":
tab.SetIcon(Resource.Drawable.selectedIcon);
break;
default:
break;
}
}
void TabLayout.IOnTabSelectedListener.OnTabUnselected(TabLayout.Tab tab)
{
if (tab == null)
{
return;
}
switch (tab.Text)
{
case "Tab 1":
tab.SetIcon(Resource.Drawable.unSelectedIcon);
break;
case "Tab 2":
tab.SetIcon(Resource.Drawable.unSelectedIcon);
break;
case "Tab 3":
tab.SetIcon(Resource.Drawable.unSelectedIcon);
break;
default:
break;
}
}
}
}
Best Regards,
Jarvan Zhang
If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.
Hi, what color do you mean? Could you please post a screenshot do display that?
The 'tab.Text' corresponds to the Title of the subpage, please make sure the value is the same. Check the code:
<local:CustomTabbedPage ...
xmlns:local="clr-namespace:TestApplication_5"
x:Class="TestApplication_5.TabbedPage1">
<local:Page1 Title="Tab 1" IconImageSource="selectedIcon"/>
<local:Page2 Title="Tab 2" IconImageSource="unSelectedIcon"/>
<local:Page3 Title="Tab 3" IconImageSource="unSelectedIcon"/>
</local:CustomTabbedPage>
May I know whether your issue has been solved or not? If not, please share it in here. We can work together to figure it out.
7 people are following this question.