Okay,This is What I would like to do in MvvmCross without any plugins just native code. I did find a Tutorial on how to it, but I would like it in MvvmCross.iOS Have a look at what I would like to do in MvvmCross.iOS
Please advise or forward a better tutorial for MvvmCross.iOS
points to remember
The hamburger menu should have a draggable effect like the image I have linked
what I have tried
ViewDidLoad() -->
UIPanGestureRecognizer gesture = new UIPanGestureRecognizer();
gesture.AddTarget(() => HandleDrag(gesture));
this.View.AddGestureRecognizer(gesture);
panGestureRecognizer = new UIScreenEdgePanGestureRecognizer ( HandleSwipeRight);
panGestureRecognizer.Edges = UIRectEdge.Left;
this.View.AddGestureRecognizer(panGestureRecognizer);
HandleDrag() -->
protected void HandleDrag(UIPanGestureRecognizer recognizer)
{
PointF offset2 = (System.Drawing.PointF)recognizer.TranslationInView(View);
if (recognizer.State != (UIGestureRecognizerState.Cancelled | UIGestureRecognizerState.Failed
| UIGestureRecognizerState.Possible))
{
Console.WriteLine("Here");
// NEED TO LOAD ANOTHER VIEW HERE
openMenu();
}
}
openMenu() -->
public void openMenu()
{
viewBlack.Hidden = false;
this.view.Hidden = false;
UIView.Animate(
duration: 0.3,
delay: 0,
options: UIViewAnimationOptions.CurveEaseInOut |
UIViewAnimationOptions.Autoreverse,
animation: () =>
{
this.view.LayoutIfNeeded();
this.viewBlack.Alpha = this.maxBlackViewAlpha = 0.5f;
},
completion: () =>
{
panGestureRecognizer.Enabled = false;
}
);
}
hideMenu() -->
public void closeMenu(){
UIView.Animate(
duration: 0.3,
delay: 0,
options: UIViewAnimationOptions.CurveEaseInOut |
UIViewAnimationOptions.Autoreverse,
animation: () =>
{
this.view.LayoutIfNeeded();
this.viewBlack.Alpha = 0;
},
completion: () =>
{
panGestureRecognizer.Enabled = true;
viewBlack.Hidden = true;
view.Hidden = true;
}
);
}
My Custom Hamburger menu UIView -->
view = new UIView();
view.Frame = new CGRect(0, 0, UIScreen.MainScreen.Bounds.Width / 1.1, UIScreen.MainScreen.Bounds.Height);
var gradientLayer = new CAGradientLayer();
gradientLayer.Colors = new[] { UIColor.FromRGB(64, 0, 128).CGColor, UIColor.FromRGB(0, 0, 128).CGColor };
gradientLayer.Locations = new NSNumber[] { 0, 1 };
gradientLayer.Frame = view.Frame;
view.BackgroundColor = UIColor.Clear;
view.Layer.AddSublayer(gradientLayer);
var viewline = new UIView();
viewline.Frame = new CGRect(20, 60, 100, 1);
viewline.BackgroundColor = UIColor.White;
var bb = new UIBarButtonItem();
var Allbutton = new UIButton(new CGRect(0, 20, 135, 20));
Allbutton.SetTitleColor(UIColor.Black, UIControlState.Normal);
Allbutton.TitleLabel.BackgroundColor = UIColor.White;
Allbutton.SetTitle("Login", UIControlState.Normal);
var myPrefbutton = new UIButton(new CGRect(0, 120, 135, 20));
myPrefbutton.SetTitleColor(UIColor.Black, UIControlState.Normal);
myPrefbutton.SetTitle("Logout", UIControlState.Normal);
myPrefbutton.TitleLabel.BackgroundColor = UIColor.White;
view.BackgroundColor = UIColor.White;
view.Add(Allbutton);
view.Add(viewline);
view.Add(myPrefbutton);
view.Hidden = true;
this.View.AddSubviews(view);
this is the only code I was able to convert into MvvmCross.iOS from tutorial(SWIFT) and it's works but I cannot drag the menu to show, what happens is that it load up normally and it's fast
Note!!! I am not using any Storyboards or nib files just using pure code for this hamburger menu
please has a good look at the .gif notice that the menu is draggable which makes it's animation slow and not fast.
if I have confused you please don't be sad I have just started coding in iOS and MvvmCross... I'm still a noob
Got it to work
first had to create a UIVew class -->
SideMenuView : MvxViewController
then set the X to minus... it will be zero if a user selects the navbaritem I also added a overlay UIView
viewBlack = new UIView();
viewBlack.Frame = new CGRect(0, 0, UIScreen.MainScreen.Bounds.Width, UIScreen.MainScreen.Bounds.Height);
viewBlack.BackgroundColor = UIColor.Black;
viewBlack.Alpha = 0.5f;
viewBlack.Hidden = true;
this.View.AddSubviews(viewBlack);