Rating Bar in Xamarin iOS

In this article, you will learn how to Create a Rating Bar 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.

Browse Code Here

Prerequisites

• Xamarin Studio.
• Xcode.

The steps given below are required to be followed in order to Create a Rating Bar 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.
After opening the Main.storyboard, you can design this page, as per your desire.

Step 5

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

Step 6

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

Go to Solution—>Resource-->Right click-->Add-->Add Files.Now, you can choose the required Images. Click open.

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

Step 7

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

1. Button(btn1)
2. Button(btn2)
3. Button(btn3)
4. Button(btn4)
5. Button(btn5)
6. Label(lblRate)

Step 8


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

ViewController.cs

using System;

using UIKit;

namespace XamariniOSRatingBar
{
 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();


   btn1.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn2.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn3.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn4.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn5.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);

   lblRating.Text = "Your Rating:0/5";

  }

  partial void UIButton17_TouchUpInside(UIButton sender)
  {
   btn1.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn2.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn3.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn4.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn5.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);


   lblRating.Text = "Your Rating:5/5";
  }

  partial void UIButton16_TouchUpInside(UIButton sender)
  {
   btn1.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn2.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn3.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn4.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);


   btn5.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);

   lblRating.Text = "Your Rating:4/5";
  }

  partial void UIButton15_TouchUpInside(UIButton sender)
  {

   btn1.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn2.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn3.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);



   btn4.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn5.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);

   lblRating.Text = "Your Rating:3/5";
  }

  partial void UIButton14_TouchUpInside(UIButton sender)
  {
   btn1.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);
   btn2.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);


   btn3.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn4.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn5.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);

   lblRating.Text = "Your Rating:2/5";
  }

  partial void UIButton13_TouchUpInside(UIButton sender)
  {
   btn1.SetBackgroundImage(UIImage.FromFile("yellow-star.png"), UIControlState.Normal);

   btn2.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn3.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn4.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);
   btn5.SetBackgroundImage(UIImage.FromFile("gray-star.png"), UIControlState.Normal);

   lblRating.Text = "Your Rating:1/5";
  }

  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 see the Rating bar is Working Successfully.

Summary

This was the process of how to Create a Rating Bar in Xamarin iOS , using Xamarin Studio.

Please Share Your Comments and Feedback.