How to add footer to Flyout Drawer in Xamarin.Ios?

Question

I'm trying to add a footer to the Flyout Drawer for Native Xamarin.ios.

The requirement is similar to these two Android questions, except that I need it done for iOS native:

How to add footer to NavigationView - Android support design library?

and

Add footer layout in navigation drawer

public class FlyoutDrawerMenuTableView : UITableViewController
{
    public override void ViewDidLoad()
    {
        base.ViewDidLoad();

        this.TableView.RegisterClassForCellReuse(typeof(UITableViewVibrantCell), "VibrantCell");
    }

    public override nint RowsInSection(UITableView tableView, nint section)
    {
        return 4;
    }

    public override UITableViewCell GetCell(UITableView tableView, Foundation.NSIndexPath indexPath)
    {
        var cell = tableView.DequeueReusableCell("VibrantCell");
        cell.TextLabel.TextColor = UIColor.White;

        switch (indexPath.Row)
        {
            case 0:
                cell.TextLabel.Text = "Home";
                cell.ImageView.Image = UIImage.FromBundle("home.png");
                break;
            case 1:
                cell.TextLabel.Text = "Preferences";
                cell.ImageView.Image = UIImage.FromBundle("preferences.png");
                break;
            case 2:
                cell.TextLabel.Text = "About";
                cell.ImageView.Image = UIImage.FromBundle("about.png");
                break;
            case 3:
                cell.TextLabel.Text = "Log Out";
                cell.ImageView.Image = UIImage.FromBundle("log_out.png");
                break;
        }

        return cell;
    }

    public override void RowSelected(UITableView tableView, Foundation.NSIndexPath indexPath)
    {
        tableView.DeselectRow(indexPath, true);
        switch (indexPath.Row)
        {
            case 0:
                // Navigate to Home.
                break;
            case 1:
                // Navigate to Preferences.
                break;
            case 2:
                // Navigate to About.
                break;
            case 3:
                // Navigate to Log Out...
                // HERE IS MY QUESTION: HOW CAN I PLACE THIS AS A
                // FOOTER TO THE FLYOUT DRAWER, IN THE VERY BOTTOM?

                // Here is the code thus far:

                cell.TranslatesAutoresizingMaskIntoConstraints = false;
                View.AddSubview(cell);

                cell.TopAnchor.ConstraintEqualTo(View.TopAnchor, 100).Active = true;
                cell.LeftAnchor.ConstraintEqualTo(View.LeftAnchor, 20).Active = true;
                cell.RightAnchor.ConstraintEqualTo(View.RightAnchor, -20).Active = true;
                cell.BottomAnchor.ConstraintEqualTo(View.BottomAnchor, -100).Active = true;

                // What should these numbers above be????

                break;
        }

        this.ShowViewController(vc, this);
    }
}

My question is in the last "Case 3" part: How can I place the last option as a footer to the Flyout Drawer, in the very bottom?

I'm basing my code off the sample in this Nuget Package:

https://github.com/TheEightBot/Xamarin.SideMenu

Thank you.

///

UPDATE: Below is a screenshot of what we are trying to accomplish. Thank you.

FINAL UPDATE: Here is the working code for reference, with slight modification from Junior Jiang...

        UIImageView tableViewFooterImageView = new UIImageView(UIImage.FromBundle(“log_out.png”));

        var tableViewFooter = new UIView(new RectangleF(20, (float)UIScreen.MainScreen.Bounds.Height - 120, 375, 66));

        tableViewFooter.Add(tableViewFooterLabel);
        tableViewFooter.Add(tableViewFooterImageView);

        TableView.Add(tableViewFooter);

Answer 1

Not using cell to realize footer view , UITableView.TableFooterView Property can do that.

As follow:

UILabel label = new UILabel(new CoreGraphics.CGRect(0, 0, 200, 50));
label.Text = "I am a footer view";
label.TextAlignment = UITextAlignment.Center;
label.BackgroundColor = UIColor.Cyan;
this.TableView.TableFooterView = label;

You can custom a View with image & title in TableFooterView .