xamarin.ios implement PageController with images o

Question

i'm developing an ios app with xamarin, only code, without StoryBoard, or any designer. i need to implement a UiViewController that contains many images, and scrolls horizontally, just like this.

I don't have found anything suitable for me. so someone have some suggestion or some example to show me?

Answer 1

Seems like you need a UIPageViewController without storyboard or .xib.

You need 3 custom classes to implement it.

1. MyPageViewController - A custom UIPageViewController

   public class MyPageViewController : UIPageViewController
   {
       private List<ContentViewController> pages = new List<ContentViewController>();
   
       public MyPageViewController() : base(UIPageViewControllerTransitionStyle.Scroll, UIPageViewControllerNavigationOrientation.Horizontal)
       {
           View.Frame = UIScreen.MainScreen.Bounds;
   
           pages.Add(new ContentViewController(0,UIColor.Red));
           pages.Add(new ContentViewController(1,UIColor.Green));
           pages.Add(new ContentViewController(2,UIColor.Blue));
   
           DataSource = new PageDataSource(pages);
   
           SetViewControllers(new UIViewController[] { pages [0] as UIViewController }, UIPageViewControllerNavigationDirection.Forward, false, null);
       }
   }
   

2. PageDataSource:

   public class PageDataSource : UIPageViewControllerDataSource
   {
       List<ContentViewController> pages; 
   
       public PageDataSource(List<ContentViewController> pages)
       {
           this.pages = pages;
       }
   
       override public UIViewController GetPreviousViewController(UIPageViewController pageViewController, UIViewController referenceViewController)
       {
           ContentViewController currentPage = referenceViewController as ContentViewController;
           ContentViewController pageToReturn = null;
   
           if (currentPage.Index == 0)
           {
               pageToReturn = pages[pages.Count - 1];
           }
           else
           {
               pageToReturn = pages[currentPage.Index - 1];
           }
   
           // NOTE: If the same view controller is returned, UIPageViewController will break and show black screen
           return pageToReturn != currentPage ? pageToReturn : null; 
       }
   
       override public UIViewController GetNextViewController(UIPageViewController pageViewController, UIViewController referenceViewController)
       {
           ContentViewController currentPage = referenceViewController as ContentViewController;
           ContentViewController pageToReturn = pages[(currentPage.Index + 1) % pages.Count];
   
           return pageToReturn != currentPage ? pageToReturn : null;
       }
   }
   

3. ContentViewController - A custom UIViewController, just need to add the property Index

   public class ContentViewController : UIViewController
   {
       private int index = -1;
       public int Index
       {
           get
           { 
               return index;
           }
       }
   
       public ContentViewController(int _index, UIColor backColor)
       {
           this.index = _index;
           this.View.Frame = UIScreen.MainScreen.Bounds;
           this.View.BackgroundColor = backColor;
       }
   }
   

And finally, override the FinishedLaunching method in your AppDelegate.cs:

public override bool FinishedLaunching(UIApplication application, NSDictionary launchOptions)
{
    this.Window = new UIWindow(UIScreen.MainScreen.Bounds);
    this.Window.RootViewController = new MyPageViewController();
    this.Window.MakeKeyAndVisible();

    return true;
}

Hope it can help you.

If you still have some questions, just leave it here.