inabox/InABox.Mobile/InABox.Mobile.Shared/Components/MobileMenuButton/MobileMenuButton.xaml.cs

using System;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
using System.Collections;
using System.Collections.Generic;
using System.Linq;
using Syncfusion.XForms.PopupLayout;
using XF.Material.Forms.UI;

namespace InABox.Mobile
{
    
    
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class MobileMenuButton
    {
        
        private SfPopupLayout _popup;

        private MobileMenuButtonMenu _menu;

        public IList<MobileMenuEntry> Items => _menu.Items;
        
        public RelativePosition Position { get; set; }
        
        public event EventHandler Appearing;
        
        private ImageSource _source;
        
        public ImageSource Image
        {
            get => _image.Source;
            set => _image.Source = value;
        }
        
        public Size ImageSize
        {
            get => new Size(_image.WidthRequest,_image.HeightRequest);
            set
            {
                _image.HeightRequest = value.Height;
                _image.WidthRequest = value.Width;
            }
        }
        
        public event MobileMenuButtonClickedEvent Clicked;
        
        public MobileMenuButton()
        {
            _menu = new MobileMenuButtonMenu();
            _menu.ItemClicked += (sender,args) => _popup.Dismiss();
            InitializeComponent();
            _popup = new SfPopupLayout();
            Position = RelativePosition.AlignToLeftOf;
        }

        private void _image_OnClicked(object sender, EventArgs e)
        {
            Appearing?.Invoke(this, EventArgs.Empty);
            if (_menu.Items.Any())
            {
                _popup.PopupView.ContentTemplate = new DataTemplate(() => _menu);
                _popup.PopupView.ShowFooter = false;
                _popup.PopupView.ShowHeader = false;
                _popup.PopupView.AutoSizeMode = AutoSizeMode.Both;
                _popup.PopupView.PopupStyle.CornerRadius = 5;
                _popup.Padding = new Thickness(5);
                GetOffset(out double x, out double y);
                
                _popup.ShowRelativeToView(this, Position, x, y);
            }
            else
                Clicked?.Invoke(this, new MobileMenuButtonClickedEventArgs(null));
        }

        /// <summary>
        /// Calculates the offest of the Menu to position it at the center of the Button
        ///  Let's not presume that all the calculations are correct - its only been tested
        /// against AlignToLeftOf (for top-right-hand side menu options 
        /// </summary>
        /// <param name="x"></param>
        /// <param name="y"></param>
        private void GetOffset(out double x, out double y)
        {
            x = 0F;
            y = 0F;
            // Displays the popup at the top of the given view.
            if (Position == RelativePosition.AlignTop)
            {
                x = Width / 2F;
                y = Height / 2F;
            }
            // Displays the popup to the left of the given view.</summary>
            else if (Position == RelativePosition.AlignToLeftOf)
            {
                x = Width / 2F;
                y = Height / 2F;
            }
            // Displays the popup to the right of the given view.</summary>
            else if (Position == RelativePosition.AlignToRightOf)
            {
                x = 0F - (Width / 2F);
                y = Height / 2F;
            }
            // Displays the popup at the bottom of the given view.</summary>
            else if (Position == RelativePosition.AlignBottom)
            {
                x = Width / 2F;
                y = 0F - (Height / 2F);
            }
            // Displays the popup at the top left position of the given view.
            else if (Position == RelativePosition.AlignTopLeft)
            {
                x = Width / 2F;
                y = Height / 2F;
            }
            // Displays the popup at the top right position of the given view.
            else if (Position == RelativePosition.AlignTopRight)
            {
                x = 0F - (Width / 2F);
                y = Height / 2F;
            }
            // Displays the popup at the bottom left position of the given view.
            else if (Position == RelativePosition.AlignBottomLeft)
            {
                x = 0F - (Width / 2F);
                y = Height / 2F;
            }
            // Displays the popup at the bottom right position of the given view.
            else if (Position == RelativePosition.AlignBottomRight)
            {
                x = 0F - (Width / 2F);
                y = 0F - (Height / 2F);
            }
        }
    }
    
}