Themes
Send Feedback

Glossary Item Box

Topic Overview

Purpose

This topic provides a conceptual overview of the supported themes available in the IGCalendarView™ control.

In this topic


Introduction

Theme summary

Calendar themes allow you to give the gauge a consistent, color coordinated look and feel. Simply set the IGCalendarView theme property to one of the predefined themes.

  • IGCalendarViewDefaultTheme
  • IGCalendarViewLightTheme1
  • IGCalendarViewLightTheme2
  • IGCalendarViewLightTheme3
Note: Store the theme instance as a class variable, the theme property on the IGCalendarView is weak; it does not retain the reference.

To create a custom theme, create a class that inherits from IGCalendarThemeDefinition. The theme definition provides the following overrides.

  • fontNameNormal
  • fontNameHeavy
  • fontNameLight
  • fontSizeYearLabel
  • fontSizeMax
  • fontSizeMin
  • yearViewMonthSpacing
  • highlightColor
  • majorColor
  • minorColor
  • backingColor
  • outLineColor
  • lightTextColor
  • weekDayDisplayType

Theme names

The following table contains the supported themes and their associated theme names.

Theme Name

Preview

IGCalendarDefaultTheme

IGCalendarTheme1

IGCalendarTheme2

IGCalendarTheme3



Custom Theme – Code Example

Description

The code below creates an instance of the IGGridView and configures it to use a custom theme.

Preview

The following image illustrates the code example when ran.

Prerequisites

This code example requires the inclusion of the IG framework; details about how to add this framework are available in the Adding the IG Framework File topic.

Code

In Objective-C:

@interface CalendarThemes1 : NSObject <IGCalendarThemeDefinition>
@end
@implementation CalendarThemes1
//Month Title and Back Button Color
- (UIColor *)highlightColor
{
    return [UIColor colorWithRed:123/255.0 green:87/255.0 blue:56/255.0 alpha:1.0];
}
//Text Color - Year, day, week name
- (UIColor *)majorColor
{
    return [UIColor blackColor];
}
//Header Background Title Area
- (UIColor *)minorColor
{
    return [UIColor colorWithRed:0.522 green:0.576 blue:0.478 alpha:1.0];
}
//Background Color
- (UIColor *)backingColor
{
    return [UIColor colorWithRed:0.871 green:0.863 blue:0.722 alpha:1.0];
}
//Subtle lines, as separators
- (UIColor *)outLineColor
{
    return [UIColor colorWithRed:0.811 green:0.803 blue:0.662 alpha:1.0];
}
//Appointments
- (UIColor *)lightTextColor
{
    return [UIColor colorWithRed:0.129 green:0.180 blue:0.196 alpha:1.0];
}
@end
@interface igViewController ()
{
    CalendarThemes1 *_theme;
}
@end
@implementation igViewController
- (void)viewDidLoad
{
    [super viewDidLoad];
    IGCalendarView *calendar = [[IGCalendarView alloc] initWithFrame:self.view.bounds];
    calendar.autoresizingMask = UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth;
    calendar.theme = _theme = [[CalendarThemes1 alloc] init];
    [self.view addSubview:calendar];
}
@end

In C#:

public class CalendarThemes1 : IGCalendarThemeDefinition
{
      //Month Title and Back Button Color
      public override UIColor HighlightColor {
            get {
                  return new UIColor (0.482f, 0.341f, 0.22f, 1.0f);
            }
      }
      //Text Color - Year, day, week name
      public override UIColor MajorColor {
            get {
                  return UIColor.Black;
            }
      }
      //Header Background Title Area
      public override UIColor MinorColor {
            get {
                  return new UIColor (0.522f, 0.576f, 0.478f, 1.0f);
            }
      }
      //Background Color
      public override UIColor BackingColor {
            get {
                  return new UIColor (0.871f, 0.863f, 0.722f, 1.0f);
            }
      }
      //Subtle lines, as separators
      public override UIColor OutLineColor {
            get {
                  return new UIColor (0.811f, 0.803f, 0.662f, 1.0f);
            }
      }
      //Appointments
      public override UIColor LightTextColor {
            get {
                  return new UIColor (0.129f, 0.180f, 0.196f, 1.0f);
            }
      }
}
public partial class CalendarThemes_CSViewController : UIViewController
{
      CalendarThemes1 _theme;
      public CalendarThemes_CSViewController ()
      {
      }
      public override void ViewDidLoad ()
      {
            base.ViewDidLoad ();
            
            IGCalendarView calendar = new IGCalendarView();
            calendar.Frame = this.View.Bounds;
            calendar.AutoresizingMask = UIViewAutoresizing.FlexibleHeight|UIViewAutoresizing.FlexibleWidth;
            calendar.Theme = _theme = new CalendarThemes1();
            this.View.Add (calendar);
      }
}

Related Content

Topics

The following topic provides additional information related to this topic.

Topic

Purpose

This topic serves as a gateway to the features and functionality of the IGCalendarView control.