question

ArtyomVoytenko-0103 avatar image
0 Votes"
ArtyomVoytenko-0103 asked ·

Problem with routing after creating custom shell renderer tabbar

Hello everybody! I made custom shell tabbar button according this topic https://forums.xamarin.com/discussion/185038/how-we-can-create-custom-tab-like-that-on-shell-tabbar . It works, but i have a question: how to direct users on some page after Click? Thanks.

dotnet-xamarinforms
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

LeonLu-MSFT avatar image
0 Votes"
LeonLu-MSFT answered ·

Hello,​

Welcome to our Microsoft Q&A platform!

You can add click event to image. when click the image send a messageCenter.

private async void SetupLargeTab()
        {
            var todoTabBar = (TodoTabBar)ShellItem;
            var layout = new FrameLayout(Context);

            var imageHandler = todoTabBar.LargeTab.Icon.GetHandler();
            Bitmap bitmap = await imageHandler.LoadImageAsync(todoTabBar.LargeTab.Icon, Context);
            var image = new ImageView(Context);
            image.SetImageBitmap(bitmap);
            image.Click += Image_Click;
            layout.AddView(image);

            var lp = new FrameLayout.LayoutParams(200, 200);
            _bottomView.Measure((int)MeasureSpecMode.Unspecified, (int)MeasureSpecMode.Unspecified);
            lp.BottomMargin = _bottomView.MeasuredHeight / 2;

            layout.LayoutParameters = lp;

            _shellOverlay.RemoveAllViews();
            _shellOverlay.AddView(layout);
        }

        private void Image_Click(object sender, System.EventArgs e)
        {
           
            MessagingCenter.Send<App, string>(App.Current as App, "OneMessage","");
        }


Then in the AppShell, you can Subscribe the message. Making a navigation, I navigate to the Page1

public partial class AppShell : Xamarin.Forms.Shell
    {
        public AppShell()
        {
            InitializeComponent();

            Routing.RegisterRoute("Page1", typeof(Page1));


            MessagingCenter.Subscribe<App, string>(App.Current, "OneMessage", (snd, arg) =>
            {
                Device.BeginInvokeOnMainThread( async() => {
                    //Navigation.PushAsync(new NavigationPage(new DetailsInfo(arg)));

                    await Shell.Current.GoToAsync("Page1");
                });
            });
        }
    }


Here is running screenshot.


76371-image.png

76305-image.png

Best Regards,

Leon Lu



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.



image.png (17.5 KiB)
image.png (21.1 KiB)
· 7 ·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Thanks for your answer! But now i have another problem: when i try to direct to another pages (after visiting my custom tub bar pages) to my route add new part like: //page2/customTabBarPage or //page3/customTabBarPage and i cann`t to go to my page2 and page3. How can i fix it? Thanks.

0 Votes 0 ·
LeonLu-MSFT avatar image LeonLu-MSFT ArtyomVoytenko-0103 ·

Is //page2/customTabBarPage or //page3/customTabBarPage previous page? If so, you can click the back arrow in the top left, you will back to previous page.

0 Votes 0 ·

Look: i have 3 tabbar pages. Each of them has own page. And when i try to direct to another pages (after visiting my custom tub bar pages) to my route add new part. Page2 and Page 3 (in current context) it`s pages for my other tab bar. How to make absolute uri for my custom tub bar page?

0 Votes 0 ·
Show more comments