조건부 서식을 사용하면 사용자는 구체적 조건에 따라 개별 데이터 셀의 모양을 변경할 수 있습니다. 중요한 정보를 강조 표시하는 데 도움이 되고, 추세를 파악하고, 데이터 해석을 더 쉽게 만듭니다. 조건부 서식을 쉽게 생성하고 관리하는 것은 응용 프로그램의 사용자 환경에 중요합니다.

조건부 서식의 디자인 및 구현을 지원하기 위해 최신 ComponentOne 릴리스에는 최신 컨트롤인 C1RulesManager를 도입합니다. C1RulesManager는 UI 기반 컴포넌트로써, 사용자는 조건부 서식을 디자인하여 FlexPivot, FlexGrid, DataGridView 등의 데이터 인식 컨트롤에 적용할 수 있습니다. 컨트롤에는 개발자가 디자인 타임 및 런타임에 서식 규칙의 컬렉션을 추가 및 관리할 수 있도록 하는 직관적 API가 있습니다.

위 이미지는 런타임의 C1RulesManager를 보여 줍니다.

C1RulesManager 소개

해당 UI 컨트롤은 Excel에서 영감을 받았습니다. 이 컨트롤은 개별 데이터 셀에 대한 조건부 서식 기능을 제공합니다. 해당 컨트롤에는 정보를 강조 표시하고 기존 추세를 식별하며 데이터를 비교하는 데 도움이 되는 여러 개의 표시기가 기본 제공됩니다. 규칙 관리자는 Excel과 마찬가지로 데이터 막대, 단색 및 그라데이션 색조, 기타 여러 가지 아이콘 및 표시기를 지원합니다.

이미지는 C1RulesManager에서 사용할 수 있는 다양한 아이콘/표시기를 보여 줍니다.

새 컨트롤을 사용하면 셀 배경색, 테두리 선 스타일, 글꼴 색 등의 조건부 서식을 특정 조건과 값이 일치하는 셀에 적용할 수 있습니다. 조건부 서식 규칙은 조건을 지정합니다.

컨트롤을 사용하면 기본 제공되는 가장 일반적인 조건을 선택할 수 있습니다. 또한 사용자 정의 조건을 생성할 수 있는 옵션도 제공합니다.

규칙 관리자는 런타임에서 식 편집기를 사용한 사용자 정의 식 빌드를 지원합니다. 식 편집기는 텍스트 상자와 같은 컴포넌트이지만 스마트 코드 완성, 구문 및 오류 강조 표시 등의 기능을 제공합니다. 이를 위해 식 편집기는 표준 상수, 미리 정의된 연산자, 함수 등을 제공합니다.

이 GIF는 조건부 서식 규칙에 따라 사용자 정의 식을 만들기 위한 식 편집기를 보여 줍니다.

UI 기반의 규칙 관리자를 사용하면 조건부 서식 규칙을 쉽게 만들고 관리할 수 있습니다. C1RulesManager는 'RuleCollection' 컬렉션에서 지정된 모든 조건부 서식 규칙을 저장합니다. 컬렉션 규칙에는 C1RulesManager.Rules 속성을 통해 액세스할 수 있습니다.

서식 규칙은 우선 순위대로 나열됩니다. 새 서식 규칙은 목록 하단에 자동으로 추가되며 가장 낮은 우선 순위가 됩니다. 런타임에 위 또는 아래 버튼을 사용하여 목록에서 원하는 서식 규칙의 우선 순위를 변경합니다.

또한 사용자는 기존 서식 규칙을 관리할 수 있습니다. 삭제 규칙 버튼을 클릭하여 런타임에 규칙을 제거합니다. 해당 체크박스를 선택 취소하여 조건부 서식 스타일을 임시로 숨깁니다. 체크박스를 다시 선택하고 규칙을 다시 구현합니다.

이 이미지는 규칙 관리를 위해 C1RulesManager에서 지원하는 런타임 작업을 보여 줍니다.

이러한 모든 기능은 C1RulesManager 컨트롤에서 사용할 수 있습니다. 다음 사용 사례는 기능을 통합한 것입니다.

 

C1RulesManager 사용 사례: 세계 경제 전망[상위 10개 국가]

세계 경제 전망(WEO)은 국제통화기금(IMF) 직원이 진행한 설문 조사입니다. 특정 기간에 걸친 IMF 직원의 경제 발전 분석 결과를 제시합니다. 이 보고서는 국제 감시 활동에 따른 확인 및 연구 결과를 전달하기 위한 주요 도구입니다.

세계은행(World Bank)과 같은 조직은 다양한 국제 지표에 대해 전 세계를 대상으로 설문 조사를 실시하며, 데이터 리포지토리를 축적해 왔습니다. 세계은행은 이 데이터를 대중에 공개하여 보는 사람이 쉽게 이해하기를 바랍니다. 정보의 쉬운 해석을 위해 필수적인 섹션을 강조 표시하고 조건부 서식을 적용할 수도 있습니다.

해당 시나리오는 최신 C1RulesManager 컨트롤을 통해 쉽게 구현할 수 있습니다. 이 시나리오를 복제하는 방법을 살펴보기 위해 다음 부분에서는 C1RulesManager를 C1FlexGrid와 함께 사용하여 구현하는 방법을 설명합니다.

전면적 구현은 다음과 같은 섹션으로 나뉩니다.

1. 데이터 수집 및 그리드 바인딩

2. RulesManager를 그리드와 통합

3. RulesManager에서 조건부 서식 만들기

4. 조건부 서식 적용

데이터를 수집하고 FlexGrid에 바인딩하는 방법

C1RulesManager를 사용하여 데이터를 조건부로 강조 표시합니다. IMF에서 ‘세계 경제 전망’에 해당하는 데이터를 표시합니다. 데이터를 제한하기 위해 2019년 국내총생산(GDP)이 세계 상위 10위 내인 국가만 고려합니다.

데이터의 청사진을 사용하여 이 데이터를 그리드에 반영한 다음 그리드를 해당 데이터에 바인딩합니다. 다음 클래스를 만듭니다.

public class Country  
{  
      public string CountryCode { get; set; } 
      public string CountryName { get; set; } 
      public double ConstantGDP { get; set; } 
      public double CurrentGDP { get; set; } 
      public double GDPPerCapita { get; set; } 
      public double AverageInflation { get; set; } 
      public double Unemployment { get; set; } 
      public double GovNetLending { get; set; }  
      public double CurrentAccountBalance { get; set; }  
}

데이터의 청사진을 만든 다음 해당 DataSource 속성을 사용하여 그리드를 바인딩합니다.

var database = DataLoader.Import(); 
c1FlexGrid1.DataSource = database;

이미지는 조건부 서식 없이 데이터로 채운 FlexGrid를 보여 줍니다.

C1RulesManager를 FlexGrid와 통합하는 방법

C1RulesManager는 개별 컴포넌트로 사용할 수 있습니다. C1RulesManager를 VS Toolbox에서 양식 위에 놓고(또는 NuGet에서 추가) 데이터 집약적 컨트롤에 연결합니다.

이를 데이터 인식 컨트롤에 통합하는 것은 한 단계로 된 프로세스입니다. C1RulesManager를 FlexGrid와 통합하려면 C1RulesManager.SetC1RulesManager 메서드를 호출합니다.

c1RulesManager1.SetC1RulesManager(c1FlexGrid1, c1RulesManager1);

이미지는 FlexGrid와 통합된 C1RulesManager를 보여 줍니다.

RulesManager에서 조건부 서식 만들기

C1RulesManager에서 조건에 따른 서식 규칙을 추가합니다. 규칙 클래스의 Name, Expression 및 Style 속성을 사용하여 RulesManager에서 규칙을 정의합니다.

• Name은 사용자가 규칙을 식별하고자 하는 이름을 지정합니다.

• Expression은 셀 범위가 규칙에 따라 서식을 지정하도록 할지를 결정하는 조건을 지정합니다.

• Style은 셀의 조건부 서식에 사용될 항목 스타일을 정의합니다.

RulesManager는 여러 유형의 조건부 서식 스타일을 지원합니다.

지원되는 서식 스타일: 단색 셀 배경

이 스타일 유형에서는 단색이 셀 배경을 채웁니다. 셀 색상은 그리드 열 및 셀 범위에서 지정된 최솟값과 최댓값에 비례한 셀 값의 위치에 의해 결정됩니다.

GradientSettings.BackgroundPoints를 설정하여 단색 셀 배경을 표시합니다.

var inflationRule = new C1.Win.RulesManager.Rule()  
{  
      Name = 'Inflation Analysis',  
      Expression = '= [AverageInflation] >= 0', 
      Style = new ItemStyle()  
      {  
              ForeColor = Color.White,  
              Gradient = new GradientSettings()  
              {  
                      BackgroundPoints = new GradientPoint[]  
                      {  
                                new GradientPoint(GradientPointType.MinValue){ Color = Color.Green, Value=0}, 
                                new GradientPoint(GradientPointType.Percent){ Color = Color.Yellow, Value=50f},
                              new GradientPoint(GradientPointType.MaxValue){ Color = Color.Red,}  
                      },  
              BorderColor = Color.Black  
              }  
      }  
};  
inflationRule.AppliesTo.Add(new FieldRange(new string[] { 'AverageInflation' }));  

 

지원되는 서식 스타일: 아이콘 및 표시기

셀 서식을 아이콘 또는 표시기로 적용합니다.

셀에 아이콘을 표시하도록 GradientSettings.IconPoints 속성을 정의합니다. C1RulesManager에서 여러 아이콘을 사용할 수 있습니다. 어떤 아이콘을 제공할지 결정하려면 GradientSettings.IconList 속성을 설정합니다.

var constantPricedGDPRule = new C1.Win.RulesManager.Rule()  
{  
      Name = 'Constant Priced GDP Comparison', 
      Expression = '=[ConstantGDP] >-10', 
      Style = new ItemStyle()  
      {  
              ForeColor = Color.White,  
              Gradient = new GradientSettings()  
              {  
                      IconList = IconListKey.Triangle, 
                      IconPoints = new GradientPoint[]  
                      {  
                              new GradientPoint(GradientPointType.MinValue) { Color = Color.Red, Value = -10  
},  
                              new GradientPoint(GradientPointType.MaxValue) { Color = Color.Green, Value = 10  
}  
                      }  
              }  
      }  
};  
constantPricedGDPRule.AppliesTo.Add(new FieldRange(new string[] { 'ConstantGDP' }));  

 

지원되는 서식 스타일: 단색 히스토그램

셀 범위에서 최솟값과 최댓값에 해당하는 값에 비례하여 셀에 히스토그램을 표시합니다.

GradientSettings.HistogramPoints를 정의합니다. 이 경우 히스토그램은 단색으로 렌더링합니다.

var currentPricedGDPRule = new C1.Win.RulesManager.Rule()  
{  
  Name = 'Current Priced GDP Analysis', 
  Expression = '= [CurrentGDP] >= 0', 
  Style = new ItemStyle()  
  {  
        ForeColor = Color.White, 
      Gradient = new GradientSettings()  
      {  
          HistogramPoints = new GradientPoint[]  
          {  
              new GradientPoint(GradientPointType.MinValue) { Color = Color.Green, Value = 0 },  
              new GradientPoint(GradientPointType.NotSelected) { Color = Color.Transparent, Value = 5.39f }, 
              new GradientPoint(GradientPointType.MaxValue) { Color = Color.Red, }  
          },  
          HistogramColor = Color.LimeGreen  
      }  
  }  
};  
currentPricedGDPRule.AppliesTo.Add(new FieldRange(new string[] { 'CurrentGDP' }));  

 

지원되는 서식 스타일: 그라데이션 색상 히스토그램

위 사례에서 렌더링된 히스토그램을 그라데이션 색상으로 채웁니다.

GradientSettings.IsGradientHistogram 속성을 "true"로 설정합니다.

C1RulesManager를 사용하면 런타임에 조건부 서식을 생성할 수도 있습니다. 코드를 통해 적용된 조건부 서식을 UI를 통해 디자인할 수도 있습니다. 컨트롤 런타임 UI를 사용하여 위의 조건부 서식을 만듭니다.

이 GIF는 C1RulesManager를 사용하여 런타임에 조건부 서식을 생성하는 과정을 보여 줍니다.

 

조건부 서식 적용 방법

조건부 서식이 생성되면 C1RulesManager.Add 메서드의 RulesCollection에서 추가하여 규칙을 추가합니다.

c1RulesManager1.Rules.Add(conditionalFormatRule);

위 이미지는 C1RulesManager를 사용하여 조건부 서식이 지정된 여러 개의 그리드 열을 보여 줍니다.

위 이미지와 같은 출력이 생성됩니다. C1FlexGrid를 포함한 C1RulesManager가 구현됩니다.

데모 다운로드: 블로그 첨부 파일을 확인해주세요

최신 ComponentOne 업데이트에 추가된 컨트롤이 유용하기를 바랍니다. 값을 추가하는 직관적 컴포넌트와 기능을 제공하기 위해 노력하고 있습니다.

응용 프로그램에서 어떤 창의적인 방법으로 RulesManager를 사용하고 계십니까?

도움말 방문: .NET | 데모: 샘플