Create An Scroll View in Xamarin iOS

Delpin Susai Raj Saturday, 30 June 2018

In this blog, you will learn how to Create An Scroll View in Xamarin iOS, using Xamarin Studio.




Introduction

Xamarin is a platform to develop cross-platform and multi-platform apps (for example, Windows phone, Android, iOS). In Xamarin platform, the code sharing concept is used. In Xamarin Studio, Visual Studio is also available.

Prerequisites


  • Xamarin Studio.
  • Xcode.


The steps given below are required to be followed in order to Create An Scroll View in Xamarin iOS, using Xamarin Studio.

Step 1

Go To Xamarin Studio.

Click New Solution—> select iOS—>select App--> Choose single View App. Afterwards, click Next.



Step 2

In this step, configure your app. Give the app name (Ex:sample), Organization Identifier. Afterwards, click Next.



Step 3

In this step, give your project name (Ex: Sample) and solution name (Ex: Sample). Give the path of your project. Afterwards, click Create.



Step 4

Subsequently, go to the solution. In the solution, get all the files and sources in your project. Now, select Main.storyboard and double click to open Main.storyboard page.



Step 5

After opening the Main.storyboard, you can design this page, as per your desire.



Step 6

In this step, add the Image form your Local system.

Go to Solution—>Resource-->Right click-->Add-->Add Files.



Step 7


Now, you can choose the required image. Click open.

Next, choose Copy the Files to the directory. Afterwards, click Ok.



Step 8


In this step, go to the ViewController.cs page. write the code given below.

ViewController.cs


using System;
using CoreGraphics;
using UIKit;
using Foundation;

namespace XamariniOSScrollView
{
 public partial class ViewController : UIViewController
 {
  UIScrollView scrollView;
  UIImageView imageView;
  protected ViewController(IntPtr handle) : base(handle)
  {
   // Note: this .ctor should not contain any initialization logic.
  }

  public override void ViewDidLoad()
  {
   base.ViewDidLoad();
   // Perform any additional setup after loading the view, typically from a nib.

   scrollView = new UIScrollView(new CGRect(0, 0, View.Frame.Width, View.Frame.Height));
   View.AddSubview(scrollView);

   imageView = new UIImageView(UIImage.FromFile("Xamarin.jpg"));
   scrollView.ContentSize = imageView.Image.Size;
   scrollView.AddSubview(imageView);
  }

  public override void DidReceiveMemoryWarning()
  {
   base.DidReceiveMemoryWarning();
   // Release any cached data, images, etc that aren't in use.
  }
 }
}
}



Step 9

Now, go to Run option , choose Debug and the list of iPhone and iPad simulators, which are available. You can choose any one simulator and run it.



Output

After a few seconds, the app will start running on your iPhone simulator.You will see your app working successfully.



You can scroll the image . Scroll will be work successfully.

Summary

This was the process of how to Create An Scroll View in Xamarin ios , using Xamarin Studio.




How to Rotate an Image in Xamarin iOS

Delpin Susai Raj Monday, 25 June 2018

In this blog, you will learn how to Rotate an Image in Xamarin iOS, using Xamarin Studio.



Introduction

Xamarin is a platform to develop cross-platform and multi-platform apps (for example, Windows phone, Android, iOS). In Xamarin platform, the code sharing concept is used. In Xamarin Studio, Visual Studio is also available.

Prerequisites


  • Xamarin Studio.
  • Xcode.


The steps given below are required to be followed in order to Rotate an Image in Xamarin iOS, using Xamarin Studio.

Step 1

Go To Xamarin Studio.

Click New Solution—> select iOS—>select App--> Choose single View App. Afterwards, click Next.



Step 2

In this step, configure your app. Give the app name (Ex:sample), Organization Identifier. Afterwards, click Next.



Step 3

In this step, give your project name (Ex: Sample) and solution name (Ex: Sample). Give the path of your project. Afterwards, click Create.



Step 4

Subsequently, go to the solution. In the solution, get all the files and sources in your project. Now, select Main.storyboard and double click to open Main.storyboard page.



Step 5

After opening the Main.storyboard, you can design this page, as per your desire.



Step 6

Now, go to the toolbox Window. In the toolbox Window, get all the types of the tools and controls. You need to go to the toolbox Window. Now, scroll down and you will see all the tools and controls. You need to drag and drop the Button.
Next You need to align the Button, using constraints.



Step 7

Now, go to the properties Window. Select the Button and give a name (Ex:btnRotate).



Step 8


You need to drag and drop the image View.
Next You need to align the image View, using constraints.



Step 9

In this step, add the Image form your Local system.

Go to Solution—>Resource-->Right click-->Add-->Add Files.



Step 10

Now, you can choose the required image. Click open.



Step 11

Next, choose Copy the Files to the directory. Afterwards, click Ok.



Step 12

Now, go to the properties Window. Select the image View and give a name (Ex:image1) and Choose image.



Step 13

In this step, go to the ViewController.cs page, add the following namespace.

ViewController.cs

using CoreGraphics;




Step 14

In this step, go to the ViewController.cs page. write the code given below.

ViewController.cs



namespace XamariniOSImageRotation
{
 public partial class ViewController : UIViewController
 {
  protected ViewController(IntPtr handle) : base(handle)
  {
   // Note: this .ctor should not contain any initialization logic.
  }

  public override void ViewDidLoad()
  {
   base.ViewDidLoad();
   // Perform any additional setup after loading the view, typically from a nib.
  }

  partial void BtnRotate_TouchUpInside(UIButton sender)
  {
   image1.Transform = CGAffineTransform.MakeRotation((float)Math.PI / 4);
   View.AddSubview(image1);
     
  }

  public override void DidReceiveMemoryWarning()
  {
   base.DidReceiveMemoryWarning();
   // Release any cached data, images, etc that aren't in use.
  }
 }
}




Step 15

Now, go to Run option , choose Debug and the list of iPhone and iPad simulators, which are available. You can choose any one simulator and run it.



Output

After a few seconds, the app will start running on your iPhone simulator.You will see your app working successfully.



You can click the Rotate Image Button, image will rotate successfully.

Summary

This was the process of how to Rotate an Image in Xamarin ios , using Xamarin Studio.




How to Use Navigation Controller in Xamarin iOS

Delpin Susai Raj Saturday, 23 June 2018

In this article, you will learn how to Use Navigation Controller in Xamarin iOS, using Xamarin Studio.



Introduction

Xamarin is a platform to develop cross-platform and multi-platform apps (for example, Windows phone, Android, iOS). In Xamarin platform, the code sharing concept is used. In Xamarin Studio, Visual Studio is also available.

Prerequisites


  • Xamarin Studio.
  • Xcode.


The steps given below are required to be followed in order to Use Navigation Controller, using Xamarin Studio.

Step 1

Go To Xamarin Studio.

Click New Solution—> select iOS—>select App--> Choose single View App. Afterwards, click Next.



Step 2

In this step, configure your app. Give the app name (Ex:sample), Organization Identifier. Afterwards, click Next.



Step 3

In this step, give your project name (Ex: Sample) and solution name (Ex: Sample). Give the path of your project. Afterwards, click Create.



Step 4

Subsequently, go to the solution. In the solution, get all the files and sources in your project. Now, select Main.storyboard and double click to open Main.storyboard page.



Step 5

After opening the Main.storyboard, you can design this page, as per your desire.



Step 6

Now, go to the toolbox Window. In the toolbox Window, get all the types of the tools and controls. You need to go to the toolbox Window. Now, scroll down and you will see all the tools and controls. You need to drag and drop the Navigation Controller.



Step 7

Now, you can Delete the Table View Controller.



Step 8

In this step, you can set the arrow mark in Navigation Controller front.default set the arrow mark in View Controller. you can move it. 



Step 9

In this step, set the Root of your view controller. you can click the bottom of navigation controller (Ctrl+Right Click+ Drag) Move the cursor to View Controller. if release the click show the list of options. you can choose Root.



Step 10

Now,You need to drag and drop the View Controller.



Step 11

Now,You need to drag and drop the Button in your first View Controller.



Step 12

In this step, Navigate to second view controller. you can click the Button (Ctrl +Right Click+ Move) Move the cursor to Second View Controller. if release the click show the list of options. you can choose Push.



Step 13

Now, go to Run option , choose Debug and the list of iPhone and iPad simulators, which are available. You can choose any one simulator and run it.



Output

After a few seconds, the app will start running on your iPhone simulator.You will see your app working successfully.



You can click the Next View Button, Navigation will be work successfully.



Summary

This was the process of how to Use Navigation Controller in Xamarin ios , using Xamarin Studio.




MPMoviePlayer in Xamarin iOS

Delpin Susai Raj

In this blog, you will learn how to Play Video using MPMoviePlayer in Xamarin iOS, using Xamarin Studio.



Introduction

Xamarin is a platform to develop cross-platform and multi-platform apps (for example, Windows phone, Android, iOS). In Xamarin platform, the code sharing concept is used. In Xamarin Studio, Visual Studio is also available.


Prerequisites

  • Xamarin Studio.
  • Xcode.

The steps given below are required to be followed in order to Play video using MPMoviePlayer in Xamarin iOS, using Xamarin Studio.

Step 1

Go To Xamarin Studio.

Click New Solution—> select iOS—>select App--> Choose single View App. Afterwards, click Next.



Step 2

In this step, configure your app. Give the app name (Ex:sample), Organization Identifier. Afterwards, click Next.



Step 3

In this step, give your project name (Ex: Sample) and solution name (Ex: Sample). Give the path of your project. Afterwards, click Create.



Step 4

Subsequently, go to the solution. In the solution, get all the files and sources in your project. Now, select Main.storyboard and double click to open Main.storyboard page.



Step 5

After opening the Main.storyboard, you can design this page, as per your desire.



Step 6

In this step design your app.using storyboard, Toolbox and Properties.

  1. Button(btnPlay).



Step 7


In this step, add the Video file form your Local system.Go to Solution—>Resource-->Right click-->Add-->Add Files.

Now, you can choose the required Video file. Click open. Next, choose Copy the Files to the directory. Afterwards, click Ok.

File name: Video.mp4



Step 8

In this step, Build Action(Content) you need to set Content type for your Video files.

Solution Explorer—>Video File—>Right Click—->Build Action—>Select Content.



Step 9


In this step, go to the ViewController.cs page. Add namespaces for required.

ViewController.cs

using System;

using UIKit;
using MediaPlayer;
using Foundation;



Step 10

In this step, Write the code given below in ViewController.cs.

ViewController.cs

Namespace XamariniOSMPMoviePlayer
{
	public partial class ViewController : UIViewController
	{
		protected ViewController(IntPtr handle) : base(handle)
		{
			// Note: this .ctor should not contain any initialization logic.
		}

		public override void ViewDidLoad()
		{
			base.ViewDidLoad();
			// Perform any additional setup after loading the view, typically from a nib.
		}

		partial void UIButton3_TouchUpInside(UIButton sender)
		{
			//Video File
			string videoFile = "Video.mp4";
			MPMoviePlayerController player = new MPMoviePlayerController(NSUrl.FromFilename(videoFile));
			View.AddSubview(player.View);
			player.SetFullscreen(true, true);

			//Video Play Fuction
			player.Play();
		}

		public override void DidReceiveMemoryWarning()
		{
			base.DidReceiveMemoryWarning();
			// Release any cached data, images, etc that aren't in use.
		}
	}
}


Step 11
Now, go to Run option , choose Debug and the list of iPhone and iPad simulators, which are available. You can choose any one simulator and run it.
Output
After a few seconds, the app will start running on your iPhone simulator.You will see your app working successfully.
You can click the Play Button, Video will Play successfully.
You need to rotate your device it’s work perfectly.
Summary
This was the process of how to Play video using MPMoviePlayer in Xamarin ios , using Xamarin Studio.
Please share your Comments and Feedbacks.